Container Widget

The container widget enables you to add additional widgets in to a specific container or also known as a block.

Adding a container widget to your website. To add a container go to > Widgets and select container

Once you have your container in place. There any many settings that allow you to create and design the perfect section or your page.

Let's take a look closer at the container settings.

Below you will see:

1. Block settings

2. Column settings

3. Block display tab

4. Add block

Within a container you can edit:

• Background colour

• Add video

• Gradients

• Overlays

• Shape dividers

• Anchor points

Container Elements

Before we get in to the finer details let's take a look at the main container elements.

Like any container/block you can make divisions and create multiple horizontal columns and also vertical columns. The image below shows the container/block being split into 3 horizontal columns.

To do this action, simply hover your mouse at the top of the selected container/block. A button will appear which enables you to split the container in to up to 5 columns.

Note: Each column can be resized to the width you require. Additionally you can also add borders and different colours to each column.

In the image below we have added a colour to the columns so you can see visually what we mean.

Before we progress, in to how to use columns for your content, we mentioned about creating vertical columns too. To add a new column which can sit either above or below the 3 columns we have just created. The column we just created and you will see a plus + icon. This will add a new column above for example.

In the image below we have just added a new column above the previous column we just created. This time we created a split of two columns. White and black for reference.

Now we have one container with:

• 2 columns

• 3 columns

Container additional settings

Within the container you can control:

• Container delay

• Hide/make container draft

• Block/container positioning

Container delay works exactly the same as all widget delays: You are able to select a time frame when you want that entire container to display when someone visits your website.

Hiding or making container draft will hide the entire container from the website visitors view.

And finally, block/container positioning. This is a fast way to move your containers up and down your page.

Learn more about the Basic Building Blocks of a Page Builder.