Stackable Gutenberg Blocks

Gutenberg is the new editor that came with the release of WordPress version 5 and with it came blocks. Blocks are the new way to layout a post or page in WordPress. Whilst there are set of standard blocks, a number of developers have created plugins with a whole new set blocks.

One of the first ones we tried was the block plugin by Stackable. A the time of writing, it includes 24 blocks including Pricing Tables, Testimonials and Team Members. 

We are going to go through the steps to create a simple Call To Action section using the Container block. Below is the example from the Stackable website. We use the same block for the Contact section on our homepage.

Stackable Container Block
Stackable Container Block –

The first step is to create the Container block. All of the Stackable blocks are in their own section, unsurprising called “Stackable – Gutenberg Blocks”.

List of Stackable Blocks
Stackable Blocks

Once the block has been added, you can, if required, adjust the width setting.

Setting a Gutenberg block to full width
Changing the container to full width

The option to change the images are within the block settings and the image is upload via the Media Library . It is also possible to change tint strength which is similar to adjusting the opacity.

Container Title

Some container content

At this point, you can start to play with the blocks in the container. By default, it comes with a Heading and Paragraph blocks but these can be changed or added to. 

Contact Us

Give us a ring, we would
love to hear from you.

In the above container, we have two Headings and a Button block which links through to the Contact page. 

The introduction of Blocks into WordPress v5 and the Gutenberg editor makes being creative with posts a lot easier. New Block plugins mean that you can do more in the Gutenberg editor without the need to include lots of shortcodes.

About The Author

Subscribe to Blog Posts

We'll send you an email once a week with the latest blog posts.