← Back to Help Centre

How to use the Page Builder

Note: Since version 2.0 of Thrive, Shine, Flourish and Bloom were released, we have now changed the way you build the pages with your Snug theme. Find out more about how to build pages using the block editor here.

Our themes feature a built-in page builder to help you to easily customise your pages.

Each theme featured two page builders; a general page builder that can be used on any page and a homepage builder, which is specifically for use on the homepage.

How to select the page builder templates

In order to use the page builders on a page you must first assign a page template.

To do this, open up the page you want to use a page builder on and on the right-hand side of the screen, you will see the Page Attributes.  Here you will see the Template option. If you click on the drop-down list you will be able to see all of the page templates available to use.

If you are building your home page, use the Home Page template, but for all other pages use the Page Builder template.

You may need to save the page and refresh it before you can see the page builder.

The page builder looks like this before you have added any content to it.

Some of the page builders that come with some of our themes also include a Header Section. This is the section that will appear at the top of the page and this cannot be rearranged. The Header Section looks something like this:

How to use the page builder

The page builder is based on blocks. Each page builder features different blocks, and each block has a different role. We’ll cover the different blocks available in the individual theme guides (see the end of this page for more details).

You can add as many blocks to as page as you like and you can use the same block multiple times (with some exceptions). Once you have added the blocks you can rearrange them and change the order that they are displayed in on the page.  You can also change the colour of the background of the block to one of the colours within the theme’s colour scheme.

To add a block, click the Add Block button.

This will show you a list of all the blocks available for that page builder. Simply click on the block you want to add.

Let’s say for example you choose the Text block. It will then be added to the page builder and it will look something like this:

Once you have added your content, you will be able to see the block in action when you preview the page.

To add another block, just click on the Add Block button again.

How to rearrange the blocks

Once you have added some blocks to your page builder, you can move them around and change the order that they appear on the page.

To do this grab the title of the block by holding down the left button on your mouse and drag it to where you want it to go. The animation below shows how this works:

If you have a block with a lot of content you might find it easier to minimise the block before you move it. Simply click the up arrow in the top-right hand corner of the block to minimise it.

How to remove blocks

If you want to remove a block that you have added, hover over the block and click on the icon.

How to change the background colour of the blocks

You can change the background colour of all of the blocks (except for the full-width image blocks, as these have no background). 

At the bottom of each block, you will see the Background Colour option.

By default, this is set to Default, but if you want to change the colour of the background you can select a colour from 1 to 6. Each colour corresponds to one of the colours in the colour scheme, whether you have picked one of the premade colour schemes or you have created your own, with colour 1 being the lightest and colour 6 being the darkest.

If you choose a dark colour for the background, the text colour will automatically be changed to be a lighter colour so it is readable against the background colour.

For more information about the blocks available with each theme and how to use them, check out the relevant user guides for your theme:

Thrive | Shine | Flourish | Bloom