Footer
The footer component displays information that should be placed at the bottom of all pages.
Advanced footer
The advanced footer component contains two parts, a row with contact details, map and social media links, and a row displaying the copyright and policy links.
<footer class="footer">
<div class="container">
<div class="columns is-multiline">
<div class="column is-one-quarter-desktop is-half-tablet">
<ul class="footer-contact-items">
<li>Oxford Brookes University</li>
<li>Headington Campus</li>
<li>Oxford</li>
<li><a href="https://maps.google.com/maps?q=OX3+0BP"><span class="sr-only">Google maps</span>OX3 0BP</a></li>
<li>UK</li>
<li><a href="tel:+441865741111">+44 (0) 1865 741111</a></li>
</ul>
<p><a class="footer-campus-link" href="https://www.brookes.ac.uk/about-brookes/contacts-maps-and-campuses/campus-addresses/">Campus addresses »</a></p>
</div>
<div class="column is-one-quarter-desktop is-half-tablet">
<h2 class="is-sr-only">Location map</h2>
<a href="https://www.brookes.ac.uk/about-brookes/contacts-maps-and-campuses/"> <img src="https://www.brookes.ac.uk/getmedia/eda2e0c0-8985-42d7-a4ec-765500926863/map-homepage.png" alt="Oxford Brookes University map"> </a>
</div>
<div class="column is-half-desktop is-full-tablet has-text-right-desktop">
<h2 class="is-sr-only">Social media</h2>
<ul class="footer-social-icons m-bottom-0"><li><a href="https://www.facebook.com/oxfordbrookes"><span class="fab fa-facebook-f"></span><span class="sr-only">Facebook</span></a></li><li><a href="https://www.twitter.com/oxford_brookes"><span class="fab fa-twitter"></span><span class="sr-only">Twitter</span></a></li><li><a href="https://www.linkedin.com/edu/school?id=12621&oxfordbrookes"><span class="fab fa-linkedin-in"></span><span class="sr-only">Linkedin</span></a></li><li><a href="https://www.youtube.com/oxfordbrookes"><span class="fab fa-youtube"></span><span class="sr-only">Youtube</span></a></li><li><a href="https://www.flickr.com/photos/40003115@N05/"><span class="fab fa-flickr"></span><span class="sr-only">Flickr</span></a></li><li><a href="https://www.instagram.com/oxfordbrookes/"><span class="fab fa-instagram"></span><span class="sr-only">Instagram</span></a></li><li><a href="https://www.weibo.com/OxfordBrookesUni"><span class="fab fa-weibo"></span><span class="sr-only">Weibo</span></a></li></ul>
</div>
</div>
<div class="columns">
<div class="column is-full has-text-right-desktop p-bottom-0">
<h2 class="is-sr-only">Footer Navigation</h2>
<ul class="footer-footnote-links m-bottom-30">
<li>© 2023 Oxford Brookes University</li>
<li>-</li>
<li><a href="https://www.brookes.ac.uk/about-brookes/structure-and-governance/policies-and-financial-statements/">Policies</a></li>
<li><a href="https://www.brookes.ac.uk/accessibility/accessibility-statement/">Accessibility</a></li>
<li><a href="https://www.brookes.ac.uk/about-brookes/structure-and-governance/policies-and-financial-statements/privacy-policy/">Privacy</a></li>
<li><a href="https://www.brookes.ac.uk/about-brookes/structure-and-governance/policies-and-financial-statements/cookie-policy/">Cookies</a></li>
<li><a href="https://www.brookes.ac.uk/about-brookes/structure-and-governance/policies-and-financial-statements/modern-slavery-and-human-trafficking/">Modern slavery statement</a></li>
<li><a href="https://www.brookes.ac.uk/about-brookes/structure-and-governance/policies-and-financial-statements/student-protection-plan/">Student Protection Plan</a></li>
</ul>
</div>
</div>
</div>
</footer>Basic footer
The basic version of the footer only includes a row displaying the copyright and policy links.
<footer class="footer">
<div class="container">
<div class="columns">
<div class="column is-full has-text-right-desktop p-bottom-0">
<h2 class="is-sr-only">Footer Navigation</h2>
<ul class="footer-footnote-links m-bottom-30">
<li>© 2023 Oxford Brookes University</li>
<li>-</li>
<li><a href="https://www.brookes.ac.uk/about-brookes/structure-and-governance/policies-and-financial-statements/">Policies</a></li>
<li><a href="https://www.brookes.ac.uk/accessibility/accessibility-statement/">Accessibility</a></li>
<li><a href="https://www.brookes.ac.uk/about-brookes/structure-and-governance/policies-and-financial-statements/privacy-policy/">Privacy</a></li>
<li><a href="https://www.brookes.ac.uk/about-brookes/structure-and-governance/policies-and-financial-statements/cookie-policy/">Cookies</a></li>
<li><a href="https://www.brookes.ac.uk/about-brookes/structure-and-governance/policies-and-financial-statements/modern-slavery-and-human-trafficking/">Modern slavery statement</a></li>
<li><a href="https://www.brookes.ac.uk/about-brookes/structure-and-governance/policies-and-financial-statements/student-protection-plan/">Student Protection Plan</a></li>
</ul>
</div>
</div>
</div>
</footer>The contact details, maps and social media links can be changed. The copyright and policy links must always be used on all pages without any modification.
Use aria-label attributes on each icon (i.e., Facebook, Twitter, etc.).
Headings are hidden to all devices except screen readers with .is-sr-only.