Customising your Funnel or Website Builder helps you create a professional and engaging experience. Each element in the builder has various settings to adjust appearance, structure, and behaviour. This guide walks you through the General and Advanced settings for managing sections, rows, columns, and elements.
Accessing Settings
There are three ways to access settings for any section, row, column, or element:
- Click on the Settings icon attached to each area box (GREEN, BLUE, LILAC, and ORANGE).
- Click on the element itself.
- Use the Show Settings button to open the settings panel.
All three methods take you to the Settings Panel, which is divided into General Settings and Advanced Settings for Sections and Rows, and General, Animation, and Advanced for Elements.
General Settings
This is where the majority of edits are made.
- Element Name/Title: Here you'll see the default name/title of the edit option you're working on. You can leave it as is or rename it.
- Margin & Padding:
- Margin: Adjust the top or bottom margin of your content using the toggle bars.
- Padding: Move content left, right, top, or bottom by adjusting the four padding toggle bars.
- Background Color: To change the background colour of a specific edit option, such as the Section, Row, Column, or Element, simply click on the content you want to adjust the background of.
- Sticky: Use the Sticky option to choose whether your Sections remain at the top or bottom of the page when you scroll down.
- BG Media Type: Select between image and video type here.
- BG Media: To add a background image, click on the image button on the right side of the BG image box, upload or select an image, and copy the URL from the upper right corner of the page to add it.
- Allow Row to Take the Entire Width: Toggle this button to activate full width for the Row option.
Advanced Settings
In Advanced Settings, you'll find options for borders, visibility, custom classes, and CSS selectors.
- Box Shadow: Adding a box shadow can also make the border visible on a box.
- Border Option: Customise borders by selecting style, width, colour, and radius.
- Style: Choose the type of border (e.g., solid, dashed).
- Width: Adjust the thickness of the border.
- Color: Select a colour for the border.
- Width: The width option lets you select how thick you want the border to be.
- Visibility: To customise the visibility of an edit option, select the icon to highlight either mobile devices, desktops, or both.
- Custom Class: You can also enter your custom class in the Custom Class field.
- CSS Selector: If you need to copy the Custom CSS, select the Copy icon on the right side of the reference code.
With these tools to hand, tailoring your funnel or website is straightforward. Use the General and Advanced Settings to tweak spacing, borders, visibility, and more, making sure every detail reflects your brand's style. These customisation options let you build a polished, professional design that looks great and delivers a great user experience.