Learn how to add the button element to your Clickfunnels page.
Why you would need this:
- Buttons are an essential element to any Clickfunnels page. Buttons can be set to allow visitors to submit an opt-in form, go to another page, trigger content to show/hide, etc.
What you will need:
- Clickfunnels Page. Click here to learn how to get started.
Step 1: Add Button Element
- Click on Add New Element from within a row or click on the "+" below an existing element.
- Search or Select the Button Element.
- Click on the Gear icon on the button element orange border to open the settings.
Step 2: Edit Settings
- Click on the Gear icon on the button element orange border to open the settings.
- Edit the element and adjust the Settings as desired.
- Top Margin - Add space above your element.
- Set Action - Choose what you want the button to do.
- Button Text - Choose the text that appears on the button.
- Sub Text - Choose the subtext that appears on the button.
- Font Family - Change the font of the text.
- Font Size - Change the size of the text
- Mobile Size - Change the size of the text on mobile devices.
- Sub Text Size - Change the subtexts size
- Mobile Sub Size - Change the subtexts size on mobile devices.
- Text Color - Change the text color using the Color Picker.
- BG Color - Change the background color using the Color Picker.
Advanced Style Settings
- Button Width - Choose if the width of the button should be based on the amount of text or the size of the row/column it's in.
- Inline / Block - Adjust the justification for the element.
- Style - Choose from custom or "Line Flat".
- Vertical Space - Adjust the space above/below the element.
- Horizontal Space - Adjust the space to the left/right of the element.
- Corners - Adjust the amount of rounding around the edges of the button.
- Border - Choose the size of the border.
- Box Shadow - Add a shadow around the element.
- Text Shadow - Add a shadow around the text.
- Text Transform - Quickly set all text, to Uppercase, Lowercase, or Capitalized.
- Letter Spacing - Change the space between each character of text.
- Icon Picker - Add an icon to the left of your text.
- Icon Picker (After) - Add an icon to the right of your text.
- Button Effect - Choose a built-in animation option.
- Button Align - Choose the justification for the button.
Advanced Animation
- Timed Delay - fade in or fade in with scale.
- Type - On page load or on page scroll for the delay that you have set.
What you can do now:
If you have any questions about this, please contact our support team by clicking the support icon in the bottom right-hand corner of this page.
Comments
3 comments
Terrible to have videos without controls or audio. or the ability to maximize them so you can see them. This make the whole page worthless to me!
It doesn't tell me anything about how to save the action or how to set an action to a web address. Useless.
How do you change the border color?
Please sign in to leave a comment.