In the page editor you can select specific elements you want on the page.
A button element is a clickable interactive element that can trigger many functions.
To add a button click the Add Element button in the upper right of the Page Editor (Websites > Funnels > select your page and click the Design button to take you to the Page Editor); then drag the "Button" element to your desired location.
A menu opens on the right which allows you to edit and format the button, including the option to edit the name and save your changes at the top, and three sub-menus just below: General, Icons, Advanced. The sub-menus are further explored below.
General
General Settings - In the General Settings section you can change the background color and where the button displays. The Show on Screen section allows you to select one or more device(s) to display the button, so you can display it only on mobile devices but not desktop, etc.
Click Action - Set the button's action when someone clicks on it. For example: sends a form, downloads a file, purchases a product, and more.
In this section, you will choose what kind of link the button wil send the visitor to:
- Custom link - The visitor will be redirected to a web page which you specify in the next field - the link. Enter in this field the page URL to which the visitor will be redirected.
- Page Link - You will redirect the visitor to a web page within your Sales Jet funnel. You cannot redirect a visitor to third-party site using this selection (use the Custom Link instead). In the "Page selection" drop-down you will see a list of your Sales Jet pages; select the page you want to redirect the visitor to.
- Product File Download Link - The visitor can download a file by clicking on the button. In the "Product file" drop-down choose one of your available products to alllow the visitor to download the product through this button. If this field is empty, create a file in the Products tab. Read more in the article "To create a product".
- Purchase - This option will redirect the visitor to the order payment page. In the drop-down "Product selection" choose a product from the list (product, service, subscription) and the button will add that product to the cart and take the visitor directly to the product payment page.
- Add to cart - This action adds the product to the cart, but does not take the visitor to the payment page. The visitor remains on their current page, but a cart opens on the right with the added products.
- Show popup - If you link a popup to this button you will be asked to choose one of your popups from the drop-down menu Popup Select. If no popups show up in this drop-down selection then you will need to set one up in the Popups section at the top of the Page Editor menu.
- Scroll to Section - Will redirect the visitor to another section of the current page. For example: jump to the end of the page. In the drop-down menu "Section selection" choose the section the visitor will be redirected to.
Padding - You can set and change the indentation of the text inside the button – on any side of the button. This function is used if you want to move the button text away from the sides of the button.
Main Text - Here you format the button's text. You can specify what you want the button to say, choose your alignment, font size and color, and the text margins.
Secondary text - You can have two different styles of text inside the button. By toggling the Secondary text selection on you will be given the same format options as listed in the Main text selection, allowing you to set two completely independent sets of text inside the button.
Icons
Left Icon and Right icon - These are two identical fields that allow you to add icons inside the button; to the right and left relative to the position of the text. You can select an icon, adjust the size, select the padding (indentation), change the color of the icon and the background around it.
Advanced
Border - You can customize the border around the button: border style (solid, dotted, double, dotted, inside, outside), thickness and color.
Round Corners - You can adjust the rounding degree of the button corners.
Shadow - Create a shadow behind the button, choose a color and adjust the shadow dimensions and blur.
Text Shadow - This section adds a shadow to the text inside the button. You can change the shadow and blur dimensions as well as change the text shadow color.
Conditional impression. This function will hide or show the selected item from the visitor. For example, if you want to show a special offer to a new user, then hide this offer and do not show it again. Turn on Conditional Impression. Select "Show" - if you want to show the item, or "Hide" - if you want to hide it from the visitor. Then select the condition: first visit, return visit, the product has a special offer and has already registered.