Custom Header/Footer

Access from the Admin Console

Location: Site > Custom Configurations > Custom Header/Footer

Overview

You can customize the appearance of the headers and footers for your AnswerHub community.

You can perform the following actions in the Custom Header/Footer Page:

• Edit Header and Footer Content
• Change How Links Display in the AnswerHub Footer
• Change the Background Color of an AnswerHub Footer
• Replace the AnswerHub Logo in the Footer with Text

Edit Header and Footer Content

HEADER

1. Head Content: Enter either HTML, Markdown, or Freemarker information in the text field.

📘

NOTE:

The Head content text field will accept both, code that affects your entire website, and code that only affects the header of your site.

2. Header Content: Enter either HTML, Markdown, or Freemarker information in the text field.
3. Select the appropriate Header content type from the drop-down menu:

• HTML
• Markdown
• Freemarker

FOOTER

4. Footer Content: Enter either HTML, Markdown, or Freemarker information in the text field
5. Select the appropriate Footer content type from the drop-down menu:

• HTML
• Markdown
• Freemarker

6. Click the SAVE CHANGES button.

A successful save will result in a green bar at the top of the page that reads "Custom Header/Footer content saved successfully."

Change How Links Display in the AnswerHub Footer

1. Enter the following information in the Footer Content Field:

HTML

<a href="/page/about.html">About</a>
<span class="link-seperator"> |</span>
<a href="page/faq.html">FAQ</a>
<span class="link-seperator"> |</span>
<a href="page/privacy.html">Privacy</a>
<span class="link-seperator"> |</span>
<a href="/contact.html">Contact</a>

2. Select HTML from the drop-down menu for Footer Content Type.
3. Click the SAVE CHANGES button.
   A successful save will result in a green bar at the top of the page that reads "Custom header/footer content saved successfully."

To see your changes on the site, select the BACK TO SITE button in the top right-hand corner of your Admin dashboard.

Change the Background Color of an AnswerHub Footer

1. Enter the following styling information in the Footer Content Field:

CSS

<style>
#bottom .extra-inner {
  background: #888 none repeat scroll 0 0 
} 
</style>

2. Select HTML from the drop-down menu for Footer Content Type.
3. Click the SAVE CHANGES button.
   A successful save will result in a green bar at the top of the page that reads "Custom header/footer content saved successfully."

The style change will result in a footer background with a lighter gray color. To select a different color, you can look through different hex codes and swap it out with the #888 above.

To see your changes on the site, select the BACK TO SITE button in the top right-hand corner of your Admin dashboard.

Replace the AnswerHub Logo in the Footer with Text

Rather than the logo, some users prefer the text-based link, "Powered by AnswerHub."

To replace the AnswerHub logo in the footer with the linked text:

1. Enter the following information in the Footer Content field:

HTML

<div class="row">
  <div class="span12 text-center">
    <ul class="inline">
      <li><a href="https://devada.com/answerhub/" target="_blank">Powered by AnswerHub</a></li>
    </ul>
  </div>
</div>

2. Select HTML from the drop-down menu for Footer Content Type.
3. Click the SAVE CHANGES button.
   A successful save will result in a green bar at the top of the page that reads "Custom header/footer content saved successfully."

To see your changes on the site, click the BACK TO SITE button in the top right-hand corner of your Admin dashboard.