Button options

You can add a button to your landing page in the Smartpages platform and specify what will happen when you click on it.

In this guide, you will learn how to add a button to your landing page, edit and configure it.

Watch our video tutorial:

Add button

On the left side of the editor, find the Button widget, then drag and drop it into the active area of your landing page.

Edit button

Click on the button to start editing. You will see its context menu (1) and toolbar on the right side of the editor (2).

Context menu

You can change the size of the button by clicking on the dots on the frame (1). The remaining icons let you change its position (2), enter the button settings (2), duplicate it (4), move it to the top/bottom (5), and delete the button (6).

Widget toolbar

In the widget toolbar, you can go to the settings or select the style of the button, turn on/off mobile or desktop view (by default, the button is visible in both views), change the button size, and edit the text displayed on the button (label).

Underneath, you will find tabs with some additional options. You can turn them on or off using the slider located in the right-hand corner of each tab (except Typography and Other tabs).

Typography – change the font and its size and color, adjust the text line’s height, select styles, and alignment. You can also add Google fonts or your own ones.
Background – choose the style of the background: full color, gradient, or image.
Border – adjust the parameters of the frame: thickness, line style, and color.
Rounded corners – set specific values to round corners (the value can be the same for all corners or different for each).
Text shadow – control the text-shadow settings.
Shadow – set values for the shadow of the button.
Other – adjust button position

Button settings

You can enter the button settings from the context menu (1) or the toolbar (2).

There are two tabs:

Type
Settings

Type

Here you can select the type of action that will be activated when you click on the button. Remember: save your settings after each change.

Redirect – enter the URL to which the user will be redirected after clicking on the button. Remember that the redirection URL should start with the https:// prefix. NOTE: You can’t create a callto or mailto link simultaneously and check the option Track click as conversion – the link will not work correctly. You can read more about the click to call option here. See here how to create a link to send an email here.
Redirect to a landing page – select a target landing page to which the user will be redirected after clicking the button.
Download file – insert a link to your file or upload a file to share a file with a user.
Section link – select a section to which your landing page will be scrolled smoothly after clicking on the button.
Show lightbox – choose a lightbox to be displayed after clicking on the button.

In the end, remember to save and close.

Settings