Last month we talked about block libraries and the block directory in the WordPress repository. This month, November 2021, we are discussing putting those blocks together to with patterns and layouts to quickly put together a beautiful page or post for our website. We also take a quick look at what block enabled themes, such as the Twenty twenty-one or Seedlet themes, can offer us.
Definitions
Blocks
Blocks are the smallest, most atomic unit in the WordPress editor. The Paragraph is the default block. Blocks can be static (an image) or dynamic (a list of posts).
Patterns
Patterns are curated collections of blocks, often organized around a specific section or purpose. They make up common patterns across the web.
Layouts
Layouts are one step up from patterns. They can be groupings of patterns or specific blocks that make up the entire design of your page — including your header, footer, and any additional global or repeating block areas, like sidebars.
This is where WP is going with Full Site Editing (FSE)
Topics Covered
- Review definitions of blocks/patterns/layouts
- Compare layouts to page templates
- Review Blocks Paterns and Layouts page from wordpress.org design section
- Review wordpress.org patterns directory
- Open local working site
- Copy Meteor Shower. Paste and review.
- Review block settings for options
- Review block list view to show individual block components
- Contrast with reusable blocks in that not connected to central template.
- Review themes / Add Theme
- Filter on Block Patterns / Install Seedlet
- Activate Twenty-Twenty One
- Add page and review pattern layout options.
- Event detail pattern – Featured
- Create a pattern
Resources:
- https://learn.wordpress.org/workshop/advanced-layouts-with-the-block-editor/
- https://www.godaddy.com/garage/using-block-patterns-to-speed-up-site-builds/
- https://www.godaddy.com/garage/wordpress-block-pattern-reusable-block-or-template-part/
- https://make.wordpress.org/design/2019/11/14/blocks-patterns-and-layouts/
- https://learn.wordpress.org/workshop/intro-to-publishing-with-the-block-editor/
- https://wordpress.org/patterns/
- https://wpsig.pacsnet.org/
Video Recording
This month I continued my learning on how to edit the recorded video from the Teams meeting. I recorded the Teams meeting and downloaded the video file after the meeting. Once downloaded I used the open-source OpenShot Video Editor, on my Linux laptop (how about that) to clean up the recording a bit. I cut out the waiting time at the beginning of the recording where I was waiting for participants to come online and the bit of small talk banter that ensued until we kicked things off. I exported the whole thing for use on YouTube and voila, here you go.