How To: Use the Gutenberg Blocks

Add a New Column or Section

Each section you create should be enclosed in either a column or a secion. This will allow you to control the way the content displays on the page

Add a Column Block

  • Click the ‘+’ button to open the block library.
  • Look for the ‘Columns’ block and select it. This will insert a columns block with two columns by default.

Customize the Columns

  • Click on the individual columns to add content like text, images, or other media.
  • Use the block toolbar to adjust the width and content alignment of each column.

Adjust the Number of Columns

  • To change the number of columns, select the columns block and use the block settings on the right sidebar. Here, you can increase or decrease the number of columns.

Add Blocks to you Column or Section

Add a Block

  • Click the ‘+’ button and search for the block you want to add my either searching for the block name or by browsing the block options
  • These are the common blocks that are used on the MDSynergy website.

Common Blocks

Here is a list of common blocks available in the Gutenberg editor for the Twenty Twenty-One theme, along with their typical uses:

Paragraph Block:
Use: This is the basic block for adding text. It’s used for regular content writing.

Heading Block Use: To add headings to your content. Useful for organizing and structuring content with titles and subheadings.

Image Block Use: To insert single images. Offers basic image formatting options like alignment and captions.

Gallery Block Use: For displaying multiple images in a grid layout. Ideal for photo galleries or showcasing a portfolio.

List Block Use: To create bulleted or numbered lists. Useful for listing items or features.

Quote Block Use: To highlight quotations. It’s often used to emphasize excerpts or testimonials.

Audio Block Use: To embed audio files directly into your content. Great for podcasts or music.

Cover Block Use: For adding an image or video with text overlay. Often used for headers or promotional sections.

Video Block Use: To embed a video directly into your post or page.

Columns Block Use: To create a multi-column layout. Useful for text, images, and other content types.

Group Block Use: To group multiple blocks together, allowing you to style or layout them as a single unit.

Button Block Use: To add call-to-action buttons. Customizable with links, text, and colors.

Spacer Block Use: To add space between blocks. Helps in adjusting the layout and spacing of your content.

Separator Block Use: To add a horizontal line or divider between content, enhancing the content structure.

Embed Blocks Use: To embed content from external sources like YouTube, Twitter, and other supported platforms.

Table Block Use: To create simple tables for displaying data or information.

Media & Text Block Use: To place media (image or video) next to text, great for showcasing features or services.

Social Icons Block Use: To add social media icons linking to your profiles or pages.

Each of these blocks comes with its own set of customization options and settings.