How to add a header image to your Gadsden website theme

A key feature of your Gadsden website theme is the ability to add one or more “header images.” These photographs sit at the top of your page, just above the action form.

Screenshot

Header photos will automatically be cropped and scaled to fit on any screen size.

How to add a header image for a single page

In order to match your header image to your page’s content, and create visual distinction between pages on your website, Gadsden allows you to assign a unique header image per page.

To add a header image to your page, navigate within NationBuilder’s control panel to Website > Pages > [The Page] > Settings > Feature content sliders

There, create a new “slider” as follows:

  • Label: Header Image
  • Headline / Action text: [leave intentionally blank]
  • Page to feature: [enter the slug of the current page]
  • Image: Upload your preferred image.
  • Status: Published
Screenshot: Create a featured content slider

The “slider” will not appear as a “slider” in the traditional sense. It will appear as the header image, only.

How to add a site-wide header image

In addition to a per-page header image, you may also opt for a site-wide header image. This image would show, by default, on every page (except the homepage). 

To add a site-wide header image, navigate within your NationBuilder control panel to Website > Site settings > Header image. There, upload your preferred image. 

Note: If you have specified a header image for an individual page, as described above, then that image will override the site-wide header image for the relevant page.

Optimizing header images

To ensure that your header images are optimally sized, and that they load quickly, we recommend the following:

  • Crop your image to a 500:188 aspect ratio (ex: 500 x 188 pixels).
  • Use a service like TinyPNG to compress the image to its smallest possible size.
  • Finally, upload your image within your NationBuilder control panel.