The Divider element is a useful landing page tool for content separation and thematic partitions.


Adding the Divider

1. Find the Divider element in the toolbar on the left-hand side. 

Tip: The Divider element automatically adjust to the size of the container it is located in.


2. Drag-and-drop the Divider onto your landing page.

Tips: A dashed blue line appears when you've started dragging an element. It shows you where the element will be added once you drop it on the page. 

Use “Ctrl+Z” shortcut to undo the last action or use arrows in the toolbar at the top of the page.


Customizing the Divider

3. In order to access the Inspector tab, you have to first click the Divider HR element as is indicated in the screenshot below.


4. Now that you have selected the Divider HR element, click the Pencil icon in the formating toolbar above the element or click the Inspector tab icon at the top of the left-hand toolbar.

Under the Inspector tab, expand the Border section to customize the Divider. 

Next, select the Top Border icon to start editing the Divider.


5. Choose how you want to stylize the Divider by selecting its design from such options as:

  • Solid
  • Dashed
  • Dotted
  • Double
  • Groove
  • Ridge
  • Inset
  • Outset


6. Next, choose how you want to color the Divider by opening the Border Color window and picking a color.


7. Make use of Padding and Margins to further customize the Divider on your page.