ConvertedU Marketing Library Webinar Blog

Need help? You've come to the right place

What's New Getting Started Drag and Drop Standard Builder Integrations Center

Page Structure and Layout (Drag & Drop Builder)

In our Drag & Drop Builder, pages are composed of four main elements: sections, rows, columns, and widgets. Sections are the most general organizational element—each page must have at least one. Rows break up sections, and can be separated into up to six columns. Widgets are blocks of content that you can organize within your pages’ columns. 

The rest of this article will cover the settings available for pages, sections, columns, and widgets (rows do not have their own settings). To learn more about how to access element settings, check out our guide on customizing your Drag & Drop templates.

At the page level you can:

  • Adjust the page’s maximum width.
  • Add SEO tags, social sharing metadata, and analytics tracking code.
  • Set a background color or image for your page.
  • Adjust background image settings like vertical positioning, repeat options, and color overlay. 
  • Preview changes without publishing them to your live page.
  • Publish new pages and update changes to existing pages.
  • Add custom CSS, which can also target individual sections, widgets, etc. (note that we cannot provide support for custom code)

You cannot:

  • Share pages.
  • Save pages as templates. Instead, you can clone pages and use the duplicate as a starting point for a new page. 

Sections are the containers that hold rows. You can:

  • Add multiple sections to a page.
  • Rearrange by dragging them into your preferred order.
  • Add a background image or color to a section.
  • Control background image settings like vertical position, repeat options, image fill, and adding a color overlay
  • Adjust the padding (top, right, bottom, left) of the section.
  • Add an arrow border to the top or bottom of a section.
  • Configure a timing control to have a section appear after a specified time period.
  • Duplicate sections of your page. 
  • Toggle a section’s visibility (you can also hide sections on specific devices).

You cannot:

  • Delete all sections from a page; each page must have at least one section.

 

Rows and columns are the containers that organize widgets. You can:

  • Add up to six columns per row.
  • Resize columns.
  • Rearrange rows and columns.
  • Add a background color or image to a column (and access the same background image options as you can for sections).
  • Adjust the margin and padding for each column.
  • Add an arrow border to any one side of a column.
  • Duplicate a row or column within a row.
  • Delete a column from a row.
  • Delete a full row.
  • Switch from one layout to another (e.g from a 3-column layout to a 6-column layout).

You cannot:

  • Add a column to a column.
  • Hide a column/row from a section.
  • Resize rows.
  • Have a section without any rows or a row without any columns.

Widgets are the dynamic elements that allow you to customize your page’s content. You can:

  • Stack widgets on top of other widgets within a column.
  • Reorganize widgets by dragging and dropping into columns.
  • Copy or duplicate a widget.
  • Delete individual widgets within a column.
  • Access the customization options by double clicking on the widget.

You cannot:

  • Hide a widget.
  • Add a widget inside another widget.

(Updated February 10, 2017)

Was this article helpful?
0 out of 0 found this helpful
Powered by Zendesk