Skip to main content

Become an Architect: Process for Theme Creators

Many aspiring NationBuilder Architects will be interested in creating a new website theme. By going this route you will be able to create a new theme that you can use, not just for obtaining your architect certification but also for your own original website theme or as a base theme for selling to existing or potential clients. 

For others, it may make more sense to go through our theme editing architect process which is a more guided and supported process for learning all things NationBuilder theming, liquid and otherwise. In order to find out more about that process, click here. 

In order to become an Architect via the editor route, you will first need to sign up in order to request a sandbox. From there you will be required to create a website theme. You will need to create a great looking and modern website design - either as a live site for a client or within your NationBuilder sandbox - that both demonstrates your proficiency with our theming system, as well as the level of designs you are capable of creating for our customers.

Your theme must abide by the following requirements:

  • The website design should look heavily customized and not too similar to the official public themes. View examples.
  • Start with the "Bootstrap" framework when creating a new theme. This is the boilerplate framework which NationBuilder themes are built on.
  • Do not strip the contents of theme.scss and do not remove it from layout.html. Think of this stylesheet as a framework you are modifying and adding to. You can add styles or modify existing styles as you wish, but you should never remove them completely. Doing so almost certainly results in broken elements on various page types.
  • These elements should always remain in the layout.html file (not hardcoded):
    • {% include "nav" %}
    • {{ content_for header }}
    • {{ content_for_footer }}
  • Details matter: the forms and functionality should all operate properly. All components of the theme (forms, sidebars, top navigation, et.c) should have a custom design that plays into your overall design scheme.
  • Use the liquid tags {% subpage %} or {% tag %}. It is important to clearly understand how these liquid tags work, as it is what displays forms, functionality and dynamic content from one page on another page. For example, it's how you would create a "latest blog posts", a “take action” form or "upcoming events" widget on your homepage. Use this technique to do one of those things. Learn more by reading the theme documentation.
  • Keep customizations at the theme level as much as possible. New pages added to your site inherit customizations made at the theme level and not the page level. Your theme should maintain a consistent design layout as the site evolves.
  • The theme should work within the bounds of what the NationBuilder CMS editor allows (i.e. it should support field submissions up to their maximum character length)
  • Don’t hard code editable site content in the HTML templates. Because NationBuilder includes a CMS, our customers expect to be able edit most content through the page editor WYSIWYG. Hard coding this content would require site admins to navigate template code, making for a frustrating editing experience and increasing the likelihood of the theme breaking.
  • Build around engagement. NationBuilder sites are meant to inspire action and your theme should reflect this through creative use of forms, suggestion boxes, petitions, etc.

When your theme is ready for review - please send the URL to the theme and example website to [email protected] 

In order to prepare for the NationBuilder Architect Certification you may want to review the following guides and support docs: