Section Settings & Content Settings

The contentbox editor differs from the Drag-drop editor in that they both have a content Area to add and remove snippet blocks, but the Contentbox also has an outer section area, that can have background images applied and a height set.

Content sits within the section and can be repositioned and resized.

You can stack multiple sections with their own content areas on top of each other.


Section Area

Affect the outer container, height, background, padding etc

Content Area

Affect the inner content where the snippet blocks are added - content width, background colour, alignment etc.


Launching the settings modal to change the section or content areas

To launch the contentbox settings modal to change the section settings such as section height or background, click the Blue Cog icon at the top left or the Section Settings button bottom right.

The Contentbox Settings Modal Popup

The Contentbox settings modal allows you to set all the options on a Contentbox section, including height, background images and more.


General Properties

  • Set the Section height
  • Set the Content width
  • Set a Background Image
  • Set a Background colour
  • Change text to white/black
  • Show a Scroll icon

Content Padding | Alignment

Set the vertical margin above the content area. Set content padding and alignment

Background Options

  • Fine-tune your background image settings size and position
  • Set an overlay colour and opacity
  • Set a background mask
  • Set a background colour for the entire section e.g. for 2 col section blocks.

Section Width (Multiple Columns Only)

  • Set the width of a section column relative to its siblings
  • Set a max-width for the section columns within the section. 

Content Styling

Settings to affect how the content area looks, box colour and opacity

Mobile Settings

Settings that affect the section on mobile

Animation

Section animation options

Slideshow | Video

Add or remove a slideshow or video element

Section Attributes

Advanced options to make the sections sticky, force the width of the section, add an ID or Z Index. Add gutter spacing to the section.

Hide Section | Move Section

Temporarily hide a Section from view or schedule when the time period the section can be viewed.

Move the section in relation to the sections above and below

Section CSS

Advanced area allowing CSS editing for the section

Section Classes

Advanced area allow Classes to be added / removed.