Separators (Dividers)

As the name suggests, 'Separators' add a space or line onto your page layout to break the content up.

Separators are a great way to separate elements or blocks of content within your website to make sure you have consistent spacing and separators throughout your site.

Spacers come in 4 different options:

  1. Empty Space
  2. Unbroken Line
  3. Dashed Line
  4. Dotted Line

The video below shows how these options will display.

Adding a Separator to your page

  1. Make sure you are on the page you wish to add the spacer to.
  2. Click on the ‘+Add Element’ Icon on the page's Header Bar.
  3. Drag and Drop the Separator icon onto the area of the page that you want it to appear in.
  4. Click on the Settings Icon
  5. Depending on your preference, select from the list of spacer options.
  6. Click 'Apply'

You have now added a spacer to your page.

Separator options

Click edit on your separator to see options.

Top and bottom spacing Spacing options work off a grid, to help keep your site spacing uniform.
Width Is a percentage value, and allows you to change the width of the separator.
Alignment Allows you to align your separator left, middle, right.
Thickness Controls the height of the separator
Colour If you have a colour palette set, you can choose from one of your preset colours, or select a custom colour instead, by clicking the custom button.

Deleting a Separator from a page

  1. Make sure you are on the page you wish to delete the Separator from.
  2. Hover your cursor on top of the Separator.
  3. Select the X icon to delete the Separator from your page.

You have now deleted the spacer off your page

Styling

Separator's can have their colours changed, to give interesting contrast to sections of your page. Whether it's a section seperation, or simple a smaller border under a heading. 

To change the colour of a separator:

  1. Click edit on your separator
  2. At the bottom you'll see the colour scheme. Select a default colour, or choose a custom colour
    colour scheme

If you haven't set a colour scheme for your site, you will only have the 'Custom' colour available to you.

Can't find the answer you are looking for?

Try using searching below: