As seen before, sections are the top most components of the page which enclose the rows and columns.
To add a section, click on ADD SECTION
To edit a section, click on the menu and select the option from the list
Another method to edit a section: Tap on the section in the right panel and the module editor appears on the left. Select the option
To duplicate a section, in the layout manager panel click the menu and from the options click duplicate
To delete a section, in the layout manager panel click the menu and from the options click delete
To rearrange a section, in the layout manager panel drag the section to the required position
To set a background colour, click on the colour palette and select a colour
To set a background image, click on the plus sign and upload an image from the library
There are four options: Repeat Horizontally and Vertically, Repeat Horizontally, Repeat Vertically, None.
Use the Repeat options if incase you use a pattern as a background image.
Scroll: The background image will scroll with the rest of the page
Fixed: The background image will remain stationary when the page is scorlled
You can choose where to position the background in the section
You can adjust the size of the background in the section
Background Image animation
You can choose if the background needs to be animated; in this case there are four options: None, Parallax, Horizontal Loop Animation, Vertical Loop Animation
To set custom padding on all four sides, enter the values individually
To set the padding on all four sides equally, select the linker icon and enter any one value.
The value can be entered in pixels or percentage
Note: For optimum results, set the top and bottom values in pixels and left and right values in percentage
To set custom border on all four sides, enter the values individually
To set the border on all four sides equally, select the linker icon and enter any one value.
The value can be entered in pixels or percentage.
Border Colour: You can choose the border colour using the colour palette.
The offset can be set by entering the value in pixels and the section will move up accordingly
The background in this case can be a video instead of a colour or image.
Note that the video needs to be uploaded in all the three formats to be compatible with all the browsers.
YouTube or Vimeo videos cannot be used as backgrounds. Only self-hosted videos are supported.
To set an overlay for the background, select the colour and the opacity from the palette
Section without background overlay
Section with background overlay
An unique id can be set for the section to customize it using css. (unique alpha numeric, no spaces, no special characters)
A class can be set for the section to customize it using css
A title can be set for the section. This is useful for identifying a section easily for your own reference and is also used in the Single Page demos where the titles are shown in the Navigation Dots on the right.
Full Screen Section
Enabling this setting will set the height of the section to that of the screen.
The section can be hidden from a specific screen size
Mobile < 767px
Tablet – 768px – 1024px
Laptops – 1025px – 1377px
Desktops – > 1378px