Used to divide sections of a page. If the settings are not changed, the widget will produce a thin divider in an accent color (grey) that fits the width of the container it is placed in.


How do I add this widget to a page?

  1. Click Edit Page
  2. Click the Edit Content icon (pencil) and select either Insert before or Insert after
  3. Choose the DividerĀ widget
  4. Additional fields can be found in the Settings tab, these will allow you to customize the look of the widget. The fields and their descriptions are listed below;
    • Color - Choose the color of the divider. Options available are Primary, Secondary, Tertiary, Accent, Info, Gray, Light Gray, Dark Gray and Dark/Black. By Default the color chosen is Accent.
    • Height - Select the height of the divider from the following; Default, Small, Medium and Large. The default is small.
    • Style - Pick the style of the divider from the following options; Default, Dashed, Dotted, Solid and Double. The default is a solid line.
    • Width - Choose the width of the divider, by default it is 100%. Other options include; 25%, 50%, 75% and 100%.
    • Icon - Pick from a selection of icons if you want the divider to be something other than a line.
    • Custom CSS Classes - If you need to target the divider with a custom style enter the custom class name in this field.
  5. When you are finished, click on the green Create button and your Divider widget will show up on the page.
  6. Make sure to click the Save --> Publish options just as you would when you're editing pages.