Use this guide if you want to:

A fresh, functional, versatile, and mobile-friendly theme built on Bootstrap 4. Use it for your organization’s flagship website, a single-page microsite, and everything in between. View the demo site.

If you are using a custom theme based on the previous version of this theme, you can find some documentation here.

You can change the logo size using page tags, see Changing the logo size using page tags section below.

Featured Content Sliders are a versatile way to showcase pages, campaigns, or key messages using large, visually engaging imagery and optional overlay text or buttons. These sliders are fully responsive and will adapt to different screen sizes.

By default, each slide in a Featured Content Slider uses the uploaded image as a background image. This ensures the slider always fills the full width of the screen and scales smoothly across devices.

However, because background images are automatically resized and cropped to fill the available space, some parts of your image may not always be visible, particularly on smaller screens or devices with wider aspect ratios.

Pro Tip: Avoid using images that contain important text or faces near the edges. Instead, use the “Headline / Action text” field to display overlay text on top of your image.

You can optionally enable Hero Slider Mode, which displays the entire image at its original aspect ratio on all screen sizes.

This mode ensures that your full image is always visible — no cropping occurs — making it ideal for photography or artwork where the full composition is important.

To enable Hero Slider Mode, simply tag the page with: include hero slider

The Top Nav is your website’s main navigation menu that appears at the top of every page.

By default, the Top Nav in the Raise theme is sticky (i.e., it’s a “sticky nav”), meaning it remains visible at the top of the screen as users scroll down the page. This ensures your key navigation links and calls-to-action (like Donate or Sign Up buttons) are always accessible, improving usability and engagement — especially on longer pages or mobile devices.

You can disable the sticky navigation bar on specific pages by tagging that page with: disable sticky nav

When this tag is applied, the navigation bar will remain in a fixed position at the top of the page (non-sticky) and will no longer follow users as they scroll.

If you prefer to disable the sticky nav across your entire site, you can do so by tagging your homepage with: site: disable sticky nav

When this tag is applied, the sticky navigation feature will be turned off globally for all pages on your site.

Tag any page with any of these tags to enable/disable the described feature:

By default, the Raise theme is optimized for logos with a landscape or wide rectangular aspect ratio, which tend to display best in the website’s Top Nav.

However, if your logo is square, vertical, or highly detailed, the default logo size may not provide enough space for it to display clearly. You can increase the logo’s display size using page tags, or set custom maximum width and height values with some basic theme edits (see Advanced Logo Size Editability section below for more on this option).

To switch between the default and either of the alternate preset logo sizes, tag your homepage with either site: navbar logo medium or site: navbar logo large.

Each size option increases the logo’s maximum width and height within the Top Nav.

When using larger logo options, note that increasing the logo height will also increase the overall height of your site’s navigation bar.

The Raise theme includes a flexible, page + tag based system for adding social media icons to your website’s footer. This approach makes it easy to manage your footer links directly from the NationBuilder control panel.

To add a social media icon to your website’s footer:

The icon for that platform will automatically appear in your site’s footer, linking to the URL entered in the redirect page’s Redirect to field.

The following platform names are supported and will display the appropriate icon when used as the page name:

Additional Details:

By default, the Raise theme uses NationBuilder’s single-line address field. When the address field option is enabled for a given action page (e.g. Signup pages, Petition pages, etc.), users can enter their full address into a single input field, and NationBuilder will automatically parse that data into the appropriate fields of the user’s User Submitted Address on their profile.

If you are located outside of the USA, you should follow these instructions to split the default single address field into separate fields. Simply tag that page with: include split address fields. When this tag is applied, the default single-line address field will be replaced by the following separate fields: Address Line 1, Address Line 2, City, State / Province, Postal Code, Country.

All data captured via these split address fields will be stored in the user’s Home Address fields on their profile.

Supported page types include:

Additional notes:

You need a custom theme if you want to:

You don’t need one for:

Note: We recommend creating a custom theme only if you’re comfortable making light edits to code, and have some understanding of HTML, CSS, SCSS, and Liquid.

For more on creating and cloning themes, see Create a website theme with NationBuilder.

The updated Raise theme includes a new annotated SCSS file that makes it easy to update your site’s color palette without needing to understand advanced CSS.

The four adjustable color settings used throughout the Raise theme are:

After updating your color values, click Save and publish changes to apply them to your site.

Additional Tips:

The Raise theme includes a set of pre-loaded Google Fonts that you can set as the Heading and Body fonts by making some minor edits to the _theme-fonts.scss theme file.

Depending on your logo, the space available might make your logo too small. You can make a couple of edits to allow more space in this area. Please note that making this space larger will increase the size of your top navigation, making the logo space too large the Top Navigation tiles and Donate button will appear too small.

Ideal logo specifications:

To make the change, sign in to your nation's control panel and click Websites > Theme > Files > variables.scss, scroll to line 704 & 705

For most logos, a good size for width is 17rem, and for height, 6 or 7rem. If the logo has small lettering included, you can try 20rem width and 8rem height.

Note: The Larger this logo is made, the more the Top Nav will expand. If it is too large, the Top Nav page titles and the Donate-button appear too small, and it doesn’t look great.

If you need help, please reach out to [email protected]. Note that our Support team may recommend you work with one of our ecosystem partners if the customizations you are trying to make are outside of the scope of the technical advice they can provide.

The Raise theme now includes built-in multi-language support for:

To change your site’s language:

Once updated, all theme-level text, such as button labels, form instructions, and other interface elements, will automatically appear in the selected language.

Things to remember:

The updated Raise theme includes a series of enhancements to improve accessibility. However, how you add and manage content on pages throughout your website remains a key factor in the overall accessibility of your site.

For guidance on creating accessible content and ensuring your NationBuilder pages meet accessibility best practices, check out this article: Building an Inclusive Digital Presence.