“Row“ is the main content element of the Page Builder. Rows are used to divide your page into the logic blocks with columns, columns later will hold your content blocks.
Rows can be divided into the layouts (eg. 1/2 + 1/2, 1/3 + 1/3 + 1/3, and so on). Your page can have an unlimited number of rows. To change row’s position, click and drag row’s drag handler (top left row’s corner) and drag row around (vertical axis).
Row Settings↑ Back to Top
General
- Row Width: Select stretching options for row and content. By default, the stretched content of this theme is set to 1140px.
- Padding Top: Add some padding to the top of the row. You are given 7 presets to work with: 0px, 15px, 30px, 60px, 90px, 120px and 150px. This settings are referred inside the admin options as None, 1px, 1x, 2x, 3x, 4x, 5x & 6x.
- Padding Bottom: Add some padding to the top of the row. You are given 7 presets to work with: 0px, 15px, 30px, 60px, 90px, 120px and 150px. This settings are referred inside the admin options as None, 1px, 1x, 2x, 3x, 4x, 5x & 6x.
Style
- Background Color: Select the background color from the color palette.
- Background Image: Upload/Select an image to use as background for the row. If a background image is set you will have the following options:
- Background repeat: Select the background repeat property in case an image is selected as background. Check this for reference
- Background position: Define the background position. Check this for reference
- Background attachment: Define the background attachment. Check this for reference
- Background Size: Define the background size. Check this for reference.
- Parallax: Add parallax type background for row.
- Use Video Background: If checked a video will be used as row background.
- Video background (webm) file URL: Add the video URL.
- Video background (mp4) file URL: Add the video URL.
- Video background (ogv) file URL: Add the video URL.
- Overlay Color: Select a color for the overlay layer.
- Overlay Opacity: Select the overlay opacity for the overlay color.
Inner Columns
- Columns Gap: Select a gap between the columns in the current row.
- Full height row: If checked, the row will be set to full height.
- Equal height: If checked, columns will be set to have equal height.
- Content position: Select content position within columns.
Off Grid
- Shift Y-Axis: Set how much the element has to shift in the Y axis. You are given 11 presets to work with: -150px, -120x, -90px, -60px, -30px, -15px, 0px, 15px, 30px, 60px, 90px, 120px and 150px. This settings are referred inside the admin options as -5, -4, -3, -2, -1, 0, 1, 2, 3, 4, 5.
- Shift y-axis fixed: This will deactivate shift-y for responsive devices.
Responsive
- Display in Desktop: Choose the visibility of the element in desktop layout mode (when the viewport is greater than 960px wide).
- Display in Tablet: Choose the visibility of the element in desktop layout mode (when the viewport is greater than 570px and smaller than 960px wide).
- Display in Mobile: Choose the visibility of the element in desktop layout mode (when the viewport is smaller than 570px wide).
Extra
- Row ID: Define an HTML ID for this block.
- Extra Class Name: Add a CSS class if you want one.
- Section Name: Required for the one-page scroll, this give the name to the section