Skip to main content

Using the new Control Panel? Dig into our new documentation

Updating existing signup pages

May 11, 2015: Signup pages created before this date need to be updated to take advantage of new functionality. A person signing up can now add multiple tags to her profile. 

Previously, a person could tag themselves on a signup page using a dropdown menu on the website. The signup selected one option from the menu and a corresponding tag was appended to their profile. Now, you can allow signups to select one or multiple tags from a list using either radio buttons or checkboxes.

Table of Contents

Updating your signup page if you have a stock theme

No change is needed if you have a signup page with one of our stock themes. Your template will be updated automatically to the new format. Any tags you may have added to the “Ask signups to tag themselves with one of these” text box will be moved to the current radio button options section under Signup settings > Radio buttons.

Any tags from Signup settings > Basics:

Signup old ask tags

Will be moved to Signup settings > Radio buttons

Signup current radio button options

Note that if you currently have a dropdown menu on your signup page, it will change to radio buttons. If you would like to have your supporters select multiple tags you can change the tag list to checkboxes at Signup settings > Basics.

Allow signups to tag themselves with

Consider editing your tag options from the dropdown menu since it might take up substantial space on your updated signup page. Please refer to our signup page HOWTO to learn how to adjust current tag options.

Updating your signup page if you have a custom theme

If you have a custom theme for your signup page, one change will automatically occur when the page is updated. Any tags added to the “Ask signups to tag themselves with one of these” text box will be moved to the current radio button options section under Signup settings > Radio buttons

On the signup page your users will still see the tags in a dropdown menu format.

Signup drop down

If you want to display your tags using radio buttons or checkboxes you must update the code manually in the page template.

Transitioning your custom signup page

First, go to [Website] > Theme > Current custom theme > Files

Click Select files to upload. Select the “_labeled_tags.html” file available in the Signup Tag Upgrade Kit.

If your custom theme is cloned from a stock NationBuilder V2 theme (Publish, Verve, Presence, etc...) use the html file from the “NationBuilder V2 Themes” folder. Alternatively, refer to our Bootstrap instructions if you use a Bootstrap framework. 

Once the file is successfully uploaded, go to signup page you want to update and go to the Template tab.

Find this snippet of code:

{% if page.signup.has_optional_tags? %}

<div class="row-fluid">

<div class="span12"><label for="signup_optional_tag">Choose one</label>{% collection_select "optional_tag", page.signup.optional_tags, class:"select" %}</div>


{% endif %}

old liquid for signups

Replace that code with:

{% if page.signup.has_labeled_tags? %}

{% include "labeled_tags" %}

{% endif %}

new liquid for signups

Click Save and publish changes to save your changes and have them go live. The dropdown menu will disappear and all tag options will display with radio buttons or checkboxes.

new signup checkboxes

Although you do not have to update your signup page, it is highly recommended in order to get the most out of the update which allows users to select multiple tags on your front-facing site.

Bootstrap framework

If you’re using the Bootstrap framework, upload the "_labeled_tags.html" file from the "Bootstrap framework" folder in the Signup Tag Upgrade Kit. You will upload this file at [Website] > Theme > Current custom theme > Files. After the file is uploaded, go to the Template tab of your signup page to replace the following snippet of code.

Your class names will look a little different, but you will still want to find the code that starts and ends with: 

{%if page.signup.has_optional_tags?%}

Replace that code with: 

{% if page.signup.has_labeled_tags? %}
{% include "labeled_tags" %}
{% endif %}

How to create a signup page

How to use tags to organize people

Why create a tag library

If you’re unclear on how this feature works, please ask a question. If you would like to see changes to this feature, please submit a suggestion.