This feature available on All Plans
Contents
Widget Settings
Setup (Setup Links)
Paging Widget
Visibility
CSS Class
Overview
You can use the Navbar Widget to add navigational links to your campaign. This can help your visitors immensely by making your campaign easy to get around (especially if you have a large campaign with a lot of widgets); or the links can lead to other external websites of interest, like your social media channels.
To add one of these widgets to your campaign, click the Navbar Widget icon in the Add Widgets Panel, or click and drag the icon into your preview area.
Widget Settings
The widget settings popup is where you'll make any needed changes to your Navbar Widget. To change the widget name, click on the pencil icon in the top-left (next to the name) then type your new name.
You will also see the CSS ID (starting with a #) of your new widget listed in the top-right corner of the popup.
You'll want to move through each item in the menu on the left side to make sure you've completely customized the Navbar Widget in the way you'd like. You can navigate through these sections using the Back and Next buttons at the bottom.
When you're finished making changes to your widget, click the blue Save and Exit button.
Setup (Setup Links)
The Setup section is where you'll add the links that will populate the widget. Your options are to add links to the Left, Middle, or Right side of the widget. To add a link to any of these sections, just click Add link. The steps are the same for all the sections, but in this example we'll add a link to the Left section.
This will open the Link popup, with all the options for your new link.
First, you'll determine the text or image used for your button. Add text using the Link text field, or click on the + icon under Link image to open the Media Library and select an image to appear on your button.
Now you'll decide whether you want the button to open a link or trigger an action in your campaign. To have it open a link, select the Go to URL radio button. Then type the URL of your selected site into the URL field. Finally, you'll decide whether you want to open the link in a new window, or in the same window.
If you'd like to have the link trigger an action in your campaign (which is likely if you're using it for in-campaign navigation), select the Take action radio button. From there, you'll choose which widget you want to trigger using the widget dropdown on the left, and which action is triggered using the Choose an action... dropdown on the right. Your options are Show, Hide, and Scroll to.
There's also a section where you can use the button to award points to an entrant via Points for Actions. Use the Form Widget dropdown to select the form where your entrants are submitting their information, add the number of points they'll receive for clicking the button using the Points to award field, and then add an Action label - this label added to this field will be applied to any entry that completes the action.
When you've finished, click on Save Link to be brought back to the Setup section.
You'll see your new link appear in the appropriate section; all the needed information about the link is available at a glance.
You'll see the text you added to the button (or a thumbnail of the image you used) and then either the name of the action that is triggered or the URL to which the button is connected. In addition, these icons:
When you have multiple links in the same section, click and hold the three lines icon, then drag the link up or down to change the order in which it appears in the navbar.
Click the pencil icon to edit the link's settings.
Click the X icon to delete the link.
Paging Widget
On campaigns where a Paging Widget is being used, this section helps you to make sure that the links in the Navbar Widget correspond to the appropriate containers/widgets established in the Paging Widget.
To synchronize your Paging Widget's links so that they appear properly in your navbar, make sure your Paging Widget is selected using the radio button, then click the Synchronize Links Now button.
Visibility
If you'd like to limit visibility of the widget to a specific date and time, make the widget a popup, only show the widget in your Builder, or limit in which country/countries the widget can be seen; you'd do so in the Visibility section. More information about these settings can be found in the Widget Visibility help doc.
CSS Class
In this section, you can add a CSS Class that will be associated with the Navbar Widget - that way you can target it with custom CSS code. Rules and naming conventions are provided so that you don't use a class that won't work. Simply add your CSS class(es) to the Extra CSS Classes field.
