Row Editor

Modified on Sun, 29 Mar, 2020 at 11:48 PM

Overview

Use the Row Design Editor to change the row's background color/image, add a border, or adjust the padding and margins (inner and outer spacing) of the row. Use rows to organize and arrange the content in your site.

Guide

Pan over the top left of a row until a row button appears. Click the Row button.

The up and down arrows move the current row up or down. The + button will add a row above the current row being edited.

Other editing options include:

Add Column - adds a column to the row.
Edit Design - pulls up the Row Design Editor.
Entrance Animation - adds an entrance animation to the row (e.g fade from right, bounce in, zoom in).
Clear Padding - clears the inner spacing inside the row.
Copy - copies the row.
Hide On Device - hide the row on a specific device (e.g desktop, tablet, mobile).
Edit Anchor - anchor the row to the page or delete an existing anchor.
Delete - deletes the row.

Design Editor

To edit the background style or spacing, click Edit Design to open the Design Editor.

Full Bleed Rows

You can change the row into a full bleed row, which allows content to span the entire width of the screen. If you choose not have full bleed rows, the content width is limited to 960px.

Background Image Slider

We added the ability to select multiple images for the row or column background. This essentially creates an image slider in the background.

To create the background image slider, click on the + sign and select multiple images from the image picker.

Once the slider is created, you can set slide settings such as slide transition style and slide speed from the row design menu.

Any of the other background image options such as Background Overlay, Positioning, and display style can be applied to the slider.

Keep in mind that you can add this background slider to any Column as well.

Parallax controls on row

Enable or disable a row’s background image parallax effect. Click the style tab in the Design Editor for the row to find the toggle to enable or disable Parallax Background and Scrolling.

Considerations

Before editing rows, back up your site. This ensures that you will be able to restore a previous version of your website if you make a mistake. For more information about backing up your website, refer to Backup Site.

Row Editor

Overview

Use the Row Design Editor to change the row's background color/image, add a border, or adjust the padding and margins (inner and outer spacing) of the row. Use rows to organize and arrange the content in your site.

Guide

Pan over the top left of a row until a row button appears. Click the Row button.

The up and down arrows move the current row up or down. The + button will add a row above the current row being edited.

Other editing options include:

Add Column - adds a column to the row.

Edit Design - pulls up the Row Design Editor.

Entrance Animation - adds an entrance animation to the row (e.g fade from right, bounce in, zoom in).

Clear Padding - clears the inner spacing inside the row.

Copy - copies the row.

Hide On Device - hide the row on a specific device (e.g desktop, tablet, mobile).

Edit Anchor - anchor the row to the page or delete an existing anchor.

Delete - deletes the row.

Design Editor

To edit the background style or spacing, click Edit Design to open the Design Editor.

Full Bleed Rows

You can change the row into a full bleed row, which allows content to span the entire width of the screen. If you choose not have full bleed rows, the content width is limited to 960px.

Background Image Slider

We added the ability to select multiple images for the row or column background. This essentially creates an image slider in the background.

To create the background image slider, click on the + sign and select multiple images from the image picker.

Once the slider is created, you can set slide settings such as slide transition style and slide speed from the row design menu.

Any of the other background image options such as Background Overlay, Positioning, and display style can be applied to the slider.

Keep in mind that you can add this background slider to any Column as well.

Parallax controls on row

Enable or disable a row’s background image parallax effect. Click the style tab in the Design Editor for the row to find the toggle to enable or disable Parallax Background and Scrolling.

Considerations

Before editing rows, back up your site. This ensures that you will be able to restore a previous version of your website if you make a mistake. For more information about backing up your website, refer to Backup Site.