Buttons Widget

This feature available on All Plans

Overview

The Buttons Widget allows you to add customizable buttons to your campaign. These buttons can:

• Link to external websites, such as social media channels.
• Trigger actions to help visitors navigate your campaign.
• Display pop-ups or award points to entrants.

Adding the Buttons Widget

To add the Buttons Widget to your campaign:

1. Click the Buttons Widget icon in the Add Widgets Panel, or
2. Drag the icon into your preview area.

Widget Settings

The widget settings pop-up allows you to customize the Buttons Widget.

Renaming the Widget

1. Click the pencil icon in the top-left corner (next to the widget name).
2. Enter a new name and press Enter.

CSS ID

The CSS ID (starting with a #) is displayed in the top-right corner of the pop-up.

Customization

Navigate through the left-side menu to configure the widget. Use the Back and Next buttons to move between sections.

When finished, click the blue Save and Exit button.

Setup (Adding Links)

The Setup section is where you add and organize the links that form your buttons.

Adding a Button

1. Click the Add New Link button to open the Link pop-up.

2. Configure the button:

   • Text or Image:
     • Add text using the Link text field.
     • Or click the + icon under Link image to open the Media Library and select an image for the button.
   • Action Type:
     • Go to URL: Enter the URL and specify whether it opens in a new window or the same window.
     • Take Action: Select a widget to trigger using the Widget dropdown, and choose an action (Show, Hide, or Scroll to) from the Choose an action... dropdown.
   • Points for Actions (optional):
     • Use the Form Widget dropdown to select the form associated with the entry.
     • Enter the points awarded for clicking the button in the Points to award field.
     • Add an Action label to track the action in the entrant's entry data.

3. Click Save Link to add the button.

Managing Buttons

Reordering Buttons: Click and hold the three lines icon (☰), then drag the button to adjust its position in the widget.

Editing Buttons: Click the pencil icon to modify the button settings.

Deleting Buttons: Click the X icon to remove the button.

Visibility

Control when and where the Buttons Widget is visible using the Visibility section. Options include:

• Setting specific dates and times.
• Displaying the widget only in the Builder.
• Restricting visibility by country.

For more details, refer to the Widget Visibility Help Doc.

Extras

Explore advanced customization options in the Extras section, including:

• Main Tag
• CSS Classes
• Smart Labels

Learn about the Extras Section here.

Button Styling Options

When the Widget is selected, you can customize the styling of the specific widget. Some of the options include changing the button color, button font, and widget alignment. You will see the following areas of styling available in the Style Panel:

• Layout
• Button
• Button Border
• Button Text
• Button Image
• Button Hover
• Widget