Design Blocks

[wp101 video=”design-blocks”]

In this video, the instructor introduces the Design Blocks available by default in WordPress, which help structure and style content on your site.

1. Columns Block

• Lets you arrange content side by side in up to six columns.
• Can combine multiple Columns blocks to build grid layouts.
• Options:
  • Wide or full-width alignment
  • Adjust vertical alignment of items
  • Change number of columns with a slider
  • Set text and background colors for each column
• You can insert any other block inside columns (images, headings, paragraphs, etc.).
• Use the block navigation to easily select parent blocks or individual items.

2. Group Block

• Lets you group multiple blocks together.
• Makes it easier to:
  • Move, copy, or duplicate sets of blocks
  • Save as a Reusable Block for future use

3. Divider Blocks

1. Read More Block
   • Splits a blog post into a teaser (shown on archive pages) and the full article.
   • Visitors must click “Read More” to view the full post.
2. Page Break Block
   • Splits long content into multiple paginated sections.
   • Visitors navigate using numeric page links at the bottom.
3. Separator Block
   • Adds a visual horizontal line between sections.
   • Styles include:
     • Short centered line
     • Wide line
     • Three dots
4. Spacer Block
   • Adds customizable white space between blocks.
   • Adjust height by dragging or entering exact pixel values.

Key Takeaway:

WordPress Design Blocks—such as Columns, Groups, Separators, and Spacers—help you create structured, visually appealing layouts. They allow you to organize content into grids, divide sections clearly, and reuse block groups to streamline your workflow.