Bring Me Your Issues #5! Live stream from Apr 20, 2023
In this video, originally streamed on April 20, 2023, we continue working through our list of user-submitted issues and try to build a complex navigation block.
0:00 Welcome
07:38 Using @wordpress/create-block to scaffold the block files
13:51 Generating our markup for the navigation
18:30 Changet the save property for our static block so we can avoid errors while making markup changes.
20:10 Adding InnerBlocks to the main block
21:12 Scaffolding a second block that can only be inserted into the Mega Menu block
32:41 Looking at useInnerBlockProps for our InnerBlocks items.
50:33 Adding InnerBlocks to the Mega Menu Section block.
54:14 Using the existing navigation style blocks for the actual menu items.
1:00:26 Adjusting some CSS and color controls
1:02:21 Customizing the button text using the RichText component
1:10:23 Constraining RichText to a single line using the disableLineBreaks prop.
1:14:56 Updating the save.js to use RichText.Content to output the text
1:16:18 Adding from JavaScript to the front end of the block using the viewScript property
Resources:
Twitch Repo: https://kdta.io/314n2
Bring Me Your Issues lIst: https://github.com/ryanwelcher/twitch...
@wordpress/create-block package: https://developer.wordpress.org/block...
Using InnerBlocks: https://developer.wordpress.org/block...
useInnerBlocksProps: https://github.com/WordPress/gutenber...
RichText component: https://developer.wordpress.org/block...
viewScript property of block.json: https://developer.wordpress.org/block...
#wordpress #gutenberg #wordpresstutorial #wordpressplugin #block-development