Page Boilerplate

All the elements described above should be included on your page as described in this HTML boilerplate:

Show/hide markup
      <!-- stylesheet assets - brand.css, search.css -->
      <!-- site css -->
     <header id="header">
        <!-- include campus header element - header-*.html-->
        <!-- include search element - search.html-->

        <!-- site content -->
      <!-- include footer element - footer.html-->

      <!-- javascript assets - search.js-->
      <!-- site javascript files -->
      <!-- search initialization -->

Examples for sites requiring a local copy of the branding markup

For sites requiring a local copy of the branding markup:

  1. Refer to the asset location section to determine the URLs that are appropriate for your site.
  2. Create local copies of the contents of the asset files.
  3. Copy the source markup and include it in your page as indicated above.



The branding footer should feature “Celebrating 200 years” in honor of Indiana University’s Bicentennial celebration.

If your site does not use the IU Web Framework, update your footer’s markup to use the latest footer markup. Then, update your CSS to include the latest footer CSS. The styles required in this case are all of the selectors which include #footer .tagline (such as #footer .tagline.bicentennial), and they can be found within this CSS file. Please note that the second set of styles with these selectors are within a media query.

Updating the privacy link in the footer

The footer branding element also includes a link to the privacy policy for your site. The link defaults to an index page of the root-level ‘privacy’ folder of the site; virtualhostname/privacy/. This link can be modified by using the following javascript code:

var newPrivacyURL = '';
(oldPrivacyURL = document.getElementById('privacy-policy-link')) ? (oldPrivacyURL.href = newPrivacyURL) : '';