FAQ - Styling Content with the Style Editor (Drag-drop & Contentbox)

The STYLE EDITOR (Red Cog icon)

Allows you to style any Drag-drop or Contentbox snippet block by selecting the required element, then using the tabs to change various properties.

COLOUR EDITOR (Blue Palette Icon)

Quickly add colours to different content areas of the Drag-drop or Contentbox snippet.

Column Tools

The Column tools that appear on hover allow you to change the reorder, resize or copy / delete column content

Effects Options

Within the STYLE EDITOR is an effects tab which allows you to add  animation effects and custom styling.

Learn about styling options from the links below:

If you haven't learned what the icons are for in the drag drop area, the drag-drop introduction is a good place to start.
 

How to add Rounded Corners and Borders
You can add rounded corners and borders via the Style Editor popup.

Changing a Snippet Block background colour with the Colour Editor

Adding or removing a column from a Snippet Block
You can add or remove columns using the + and X column tool icons

Reordering Columns
You can move columns left/right within the Snippet Block

Resize Columns
You can resize columns within the Snippet Block

Hiding Icons in the editor for distraction free editing
If the icons are getting in the way of your editing you can quickly toggle them by double-clicking in the editor

Adding custom classes or CSS rules to a snippet block
You can edit the HTML manually via the row-tools or via the Style Modal popup.

Changing the max-width of a snippet block
By default the width of the snippet blocks attempt to stretch to the full width of the content area, but you can set a max-width.

Style and reposition Column content via Column Formatting Effects
Within the CROP EDITOR popup options is the ability to apply preset COLUMN STYLES to reposition column content.

FAQ Topics