How To Configure The Buttons on Your Website

In this tutorial, we’ll explain how to configure the buttons for your website. This allows you to determine the action(s) that occur when someone clicks a button on your page and can be fully customized.  For instructions on configuring your navigation menu, skip to Step 3.

Step 1: Getting Started With Button Configuration

• Navigate to the page you'd like to edit.

• Select the button to configure.

• Navigate to the left side of the screen to "add elements plus icon” and then click on buttons

.

• Select from the list of ready-made buttons.

Step 2: Choose Your Button Actions

• From the “Link To” list, you can choose any of the following options:

  • Open popup

  • Website URL

  • Hide elements

  • Show elements

  • Scroll to Element

  • Go to page

  • One-click up/down sell product

  • Call

  • SMS

  • Email address

  • Membership

• Once you’ve chosen your option for the Button Action from the dropdown, you will need to fill out the remainder of the information needed for that particular action.

• For example, if you choose “Website URL” you will need to enter the specific.URL, and toggle on or off the “Open in New Tab” feature:

NOTE: If you choose “Website URL” you can choose a link from a hosted file in your Media Library.

• If you choose “Scroll to element” you will need to select an element, It will highlight the element in your builder which you hover over during your selection:

Tip: When you have a lot of similarly named elements, it helps to name your elements uniquely to find them more easily in this dropdown.

• Entrance and Hover Animations for Buttons

You can also add dynamic entrance and hover animations for buttons. This allows you to apply captivating visual effects to buttons, enhancing user interaction and capturing attention. With options such as fade, slide, bounce, rotate, and zoom, you can animate buttons to create a more visually appealing experience for your audience.

Benefit: These animations activate when elements come into view, ensuring they capture the audience's attention at the right moment.

How to Use: Navigate to the website editor, select the button you wish to animate, and choose from various animation options in the new animations tab. Save and publish your changes to see the effects in action.

Note: The button effects have been relocated from the advanced tab to the animations tab, and all previous settings remain unaffected.

Step 3: (Optional) Navigation Menu Configuration

• Select the page you'd like to edit.

  • NOTE: When editing the buttons on a navigation menu, you will need to configure the buttons on each website page. 

• Select Navigation Menu.

• Navigate to "Navigation Menu Settings" on the right-hand side.

• Scroll down to "Menu Items" > Select "Edit" on the button you'd like to configure.

• In the popup, enter the website URL or the page you'd like to assign the button to > Click "Submit".

• Repeat this step for each button.

• Once ALL of the navigation menu buttons have been configured, click "Save" to confirm your updates/changes.

• Repeat steps 1-3 for the remaining pages.