How To Add A New Column

This guide will show you how to add a new column within a panel. Columns are used as the core building blocks of the site and can be made different sizes to take up different widths of the screen.

You may need to use the full-screen option to see the video more clearly.

Step By Step Guide

1:
First of all we need to load the editor. To do this click 'Content' on the left menu, once this drops down and gives you some more options, click 'Pages'. Then select the page you would like to edit, finally click the 'Editor' button in the top left.


2:
Next you will need to click on the column closest to where you would like the new one to go. From here click on the two small cogs in the toolbar .


3a:
From here you will have two options. You can add a column after (to the right) of the current column.


3b:
Alternatively you can click ' Add Column Before ' to add a column to the left of current column.


4:
Now you will want to click the ' Edit ' button in the top right of the screen. This is where you go to set the size of the column.


5:
On the next screen there are a few options. On the left you can see the different screen sizes, on the right you can then set the size you wish the column to display at that screen size. All the sizes have a fraction and percentage, this dictates the width of the column. So for example if you wanted to create a row with 3 columns you will need to set all three columns to be 1/3 of the screen.

Due to responsive design the normal setup would be full width on extra small screen sizes, e.g. mobile and tablets. Then have it decreasing in width as the screen size gets bigger.

Once you have added your sizes, click the ' Edit ' button.


6:
Finally all that is left to do is click the green 'Save' button in the bottom right. Now you will be able to see the column appear in the editor.

Related Articles

© Copyright 2021 Toolkit Websites LtdWeb Design By Toolkit Websites