FAQ content

Look & Feel: Customize the banner image, header, and footer for your LibAnswers system

In this article

You can customize your site's look and feel by displaying a banner image and/or a custom HTML header at the top of every public page. This can help you brand your LibAnswers site, letting patrons know they are using a service provided by your library.

In addition to adding a custom header to your pages, you can also add a custom HTML footer. This is another great way to customize your public LibAnswers pages to blend in with your library or institution's website. Any code you add will be inserted after the system footer, which contains the "Login to LibApps" link.


When you set your banner image at the system level, it will be inherited by all of your FAQ groups. However, within each group's look & feel settings, you have the option to exclude the system banner and use a different image instead. This can help you create groups that have their own style and branding.

We recommend using images with a width of at least 1170px in PNG, JPG, or GIF formats.

  1. Go to Admin > System Settings.
  2. Click the Look & Feel tab.
  3. In the Top Banner box, use the dropdown options to customize the banner image for your system.
    • To upload a new image, select Upload a new banner to the server from the dropdown menu.
    • If you want to remove a previously uploaded image, select Remove the banner from the server.
    • To not make any changes, select Do not change the current banner image.
  4. Click the Save button.
The Top Banner options

If you'd like to have more than just a simple banner image as the header for your public LibAnswers pages, you can add Custom Header Code. This allows you to create a header for your system using HTML code, which is a great way to create a header that blends in with your library or institution's website. For example, if your library website has a header with dropdown menus, you could recreate that on your LibAnswers site so patrons have a seamless experience moving back and forth.

When you add a custom header at the system level, it will be inherited by all of your groups. However, within each group's look & feel settings, you have the option to exclude the custom header and use a different one instead. This can help you create groups that have their own style and branding.

  1. Go to Admin > System Settings.
  2. Click the Look & Feel tab.
  3. Enter your HTML code in the Custom Header Code text box.
    • PRO TIP: want your custom header to align with the rest of the content on the page? Place your header code inside of a <div class="container"></div> element.
  4. Click the Save button.
The Custom Header Code setting

When you add a custom footer at the system level, it will be inherited by all of your groups. However, within each group's look & feel settings, you have the option to exclude the custom footer and use a different one instead. This can help you create groups that have their own style and branding.

  1. Go to Admin > System Settings.
  2. Click the Look & Feel tab.
  3. Enter your HTML code in the Custom Footer text box.
    • PRO TIP: want your custom footer to align with the rest of the content on the page? Place your footer code inside of a <div class="container"></div> element.
  4. Click the Save button.
The Custom Footer Code setting