Quickly place a line/divider between sections on a page.
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?
- Click Edit Page
- Click either + Content or the Settings icon (down-facing arrow) which will be located to the right of Edit where you will need to select either Insert above or Insert below
- Choose the Divider widget
- 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.
- When you are finished, click on the green Create button and your Divider widget will show up on the page.
- Make sure to click either the Publish or the Save Draft option just as you would when you're editing pages.