Content Elements are drag and drop blocks that allow you to add different types of content to your page.
Once added they can be rearranged (using the drag handle), duplicated and deleted using the toolbar that appears at the top of the element when it's been selected.
Some Elements have sidebar editing screen that will slide in from the left when you click on a particular element and provide you with additional editing options.
If the Copy option is used from the toolbar that appears above a content element, or if the whole area is highlighted it can be pasted into another open CMS page.
Headers
Header uses the standard HTML heading tags (H1-H5) to allow you to create heading and sub-headings on your page. You can set the heading level and alignment by selecting the headline text.
Text
Text is the main content block you can use to add text to your site. Text can be formatted once added by selecting it and choosing from the options on the editing bar that pops-up: code formatting (display only), bold, italics, strikethrough, ordered and unordered lists, alignment, font size, and links.
Images
The Image element allows you to add a standalone image to your page. Once an image is added, from the editing sidebar, you'll be able to add a caption, set the image size and alignment, and add an action on click (light-box or link).
By clicking the pencil icon on the image itself you'll be able to edit the image by cropping or rotating it.
Gallery
A Gallery can be used to display a number of images in stacked grid pattern of up to four columns. From the editing sidebar you can set the number of columns in the gallery and set the image to open in a light-box on click (displays full image).
By clicking the pencil icon on the image you can edit the image by cropping or rotating it. You can rearrange the images in the gallery by dragging and dropping them on the page.
Slider
A Slider works similarly to the Gallery on your homepage, displaying a number of images in a full width slideshow.
From the editing sidebar you can rearrange the images by dragging, edit the action on click for individual images (edit button), choose the positioning of the slider arrows and pager dots, and turn off autoscroll or set its transition speed if enabled.
By clicking the pencil icon on the image you'll be able to edit the image by cropping or rotating it.
Code
The Code content block allows you to add HTML, CSS or Javascript directly to the page. This provides an experienced user with the ability to add custom elements and code to their page.
If you don't have experience editing code, proceed with caution, as incorrect code could break a page.
Video
Video can be used to display a full width video embed from either YouTube or Vimeo. Just add the video URL in the editing sidebar, the code block can be used alternatively if you would like to customize your video embed
Buttons
The Buttons section allows you to link out to other important links or URLs with the convenience of clear visibility and purpose for the user.
Buttons, like all elements in CMS have a drag and drop functionality. Buttons can be edited on the side bar by changing their color, size, shape, and more.
When creating a button, you have the ability to rename the button to fit your purposes and link out to the desired URL when hovering your mouse over each individual button.
Accordions
The Accordion element allows you to condense information into drop-down sections that can be easily expanded upon clicking.
Each section can have its own name and can contain one or more content elements.
There are theme options in the editing sidebar that allow you to customize your Accordion - you can choose between Default, Light, and Dark, as well as select which icon style is used for expanding the content.
Space
Spaces allow you to create empty vertical space on the page. You can adjust the height by either clicking and dragging the element itself on the page or by manually setting the height (in pixels) in the editing sidebar.
Separator
Separators create a separator line or hard rule across the page to separate sections of content. From the left sidebar you can adjust the thickness of the line, its width (relative to the page or column) and its color.
Cards
The Card Element allows you to create a combined image/text block that you can use present content in a featured manner compared to a standard text block.
In the editing sidebar you can choose from three design choices:
Separators (offset text block with a bottom border)
None which removes the offset or any shadow or border
Box with shadow (off set text block with a drop shadow)
By default it features a left aligned image, a field for a headline and an area for text. The image, headline and and text field all have the same editing options as their standalone counterparts.
Additionally from the editing sidebar you can toggle off the headline or image completely, set the image position (left or right) and whether the text should wrap around the image or not.
Quote
The Quote Element adds a block quote type section to your page. The quote is offset from standard text by a stylistic element: either a left border or a stylized quote. It can be used to highlight text or to add an actual attributed quote—including author and source—to your page (depending on the design).
In the editing sidebar you can choose from one of three designs or set the
Tables
Tables add a simple data table to your page. You can adjust the number of rows or columns in the page by clicking on the bars on the right and bottom of the table itself or entering numbers manually in the editing sidebar.
Additionally in the editing sidebar you can also change the overall text alignment in the table cells, adjust the table orientation (whether the table header is the first row or the first column) choose whether your header text will be bold or not, and whether it has alternating colors in the boxes.