Skip to main content
MindTouch Success Center

Header and footer

Customizing the header and footer on your MindTouch site allows you to provide a seamless, branded experience to your site visitors. Add your own image, additional styling elements, JavaScript, navigation and more to align with your corporate look and feel.

Benefits of a custom header and footer

  • Provide a comprehensive look and feel from your main site to your support site
  • Inspire trust and authority in visitors
  • Offer additional navigation
  • Keep users engaged on your web properties

Headers are located at the top of a site and contain the custom header and site logo. Header colors and options change based on the user viewing it. The custom header section pulls in the content of a custom header template located at /Template:Custom/Views/Header.

A custom footer section (optional) pulls in content created in the custom footer template located at /Template:Custom/Views/FooterThe default MindTouch footer comes with the following out of the box:

  • Site's copyright information
  • Powered by MindTouch line 
  • Custom footer section

Customize header template

  1. Navigate to Site tools > Dashboard > Branding > Header template
  2. Open the Header template in Edit mode.
  3. Add the information you want to include on the template. 

To add CSS, DekiScript or JavaScript, add the respective code blocks

  1. Save the page.

Custom header example


Site logo example

Located in the upper left of the header area, your site logo can be uploaded in the control panel. 



As pro member, navigate to Site tools > Control panel > Branding > Logo & Icons and upload any of  the following file types: GIF, JPG, PNG or SVG.


 

If uploading an SVG, be sure to use a CSS rule set to limit the maximum width since SVGs do not have a default height and width. The following CSS limits the size of the site logo responsively by using ems which measure character width and not pixels.

.elm-header-logo-container img {
    max-width: 20em;
}  

Customize footer template

  1. Navigate to Site tools > Dashboard > Branding > Footer template
  2. Open the Footer template in Edit mode.
  3. Add the information you want to include on the template. 

To add CSS, DekiScript or JavaScript, add the respective code blocks

  1. Save the page.

Footer example


 

Learn more about customizing other branding regions of your MindTouch site.

  • Was this article helpful?