Filter blog posts on NationBuilder websites

View demo Get the code


Filter blog posts on NationBuilder websites

Our clients who are active NationBuilder bloggers often need a tool to categorise their blog posts by tags and we solve this by using awesome plugins such as Isotope and MixItUp. Both are easy to use and look great so we thought we would share a quick tutorial for you to freshen up your NationBuilder blog pages with the MixItUp plugin.

View demo


Relevant Files

HTML: pages_show_blog.html, pages_show_blog_wide.html

SCSS: _mixitup_styles.scss

JS: jquery.mixitup.min.js


The problem?

The standard bootstrap blog page looks like this:


The solution?

1.FOR BOOTSTRAP BASE THEME: Download these 4 files and upload them all to your theme.

FOR CANDIDATE THEME: Download these 4 files and upload them all to your theme.

2. In the theme.scss file, import the _mixitup_styles.scss partial.


A screenshot of the theme.scss file (the new line to add is the final one visible in this image) or you can copy these styles in your own scss file.


 3. In the layout.html file, include the JavaScript files just before the closing </body> tag


Add this JavaScript file directly before the closing </body> tag in the layout.html file


4. In the backend, make sure you upload a image file in the blog post pages files section, and that’s it.


Here is the live example site, visible at 

Get the code

View the Live Site

The plugin is free for personal work and for non-profit organisations otherwise make sure you purchase the relevant licence for MixItUp here

We love hearing about upcoming projects and campaign ideas. Get in touch to request a free consultation today!

Contact us