Site Footer
A site footer is a consistent base to a website that provides useful, global information no matter what page you are on.
Department Example
This is an example footer for a department within a faculty
<footer id="site-footer" class="grey py-4">
<div class="container">
<div class="row row-eq-height">
<div class="col-xl-3 col-lg-12 col-md-6 text-center text-xl-right">
<h2 id="site-name" class="mr-xl-4"><a href="" class="tier1 upperlower0">Faculty</a>
<a href="" class="tier2">Department</a></h2>
</div>
<div class="col-xl-3 col-lg-4 col-md-6 text-center text-xl-left">
<h3>Location Details</h3>
<a href=""><address>1280 Main St. West<br>
John Hodgings Engineering<br>
Building Room A315<br>
Hamilton, ON L8S 4L7</address></a>
</div>
<div class="col-xl-3 col-lg-4 col-md-6 text-center text-xl-left">
<h3>Office Hours</h3>
<p>Monday - Friday<br>8:30am to 4:30am</p>
</div>
<div class="col-xl-3 col-lg-4 col-md-6 text-center text-xl-left">
<h3>Contact Information</h3>
<p>Phone: <a href="tel:+19055259140p22222">905 525-9140 Ext. 22222</a><br> Email: <a href="mailto:name@mcmaster.ca">name@mcmaster.ca</a></p>
<div class="ss-icon-menu">
<a class="ss-icons ss-instagram" href="#"><span class="sr-only">Instagram</span></a>
<a class="ss-icons ss-twitter" href="#"><span class="sr-only">Twitter</span></a>
<a class="ss-icons ss-facebook" href="#"><span class="sr-only">Facebook</span></a>
<!-- <a class="ss-icons ss-youtube" href="#"><span class="sr-only">YouTube</span></a>
<a class="ss-icons ss-google-plus" href="#"><span class="sr-only">Google Plus</span></a>
<a class="ss-icons ss-linkedin" href="#"><span class="sr-only">LinkedIn</span></a> -->
</div>
</div>
</div>
</div>
</footer>
Generic Footer Example
This is an example footer for a generic site. The site name now has an upper and lower case title with no parent faculty.
<footer id="site-footer" class="grey py-4">
<div class="container">
<div class="row row-eq-height">
<div class="col-xl-3 col-lg-12 col-md-6 text-center text-xl-right">
<h2 id="site-name" class="mr-xl-4"><a href="" class="tier1 upperlower">Site Name</a></h2>
</div>
<div class="col-xl-3 col-lg-4 col-md-6 text-center text-xl-left">
<h3>Location Details</h3>
<a href=""><address>1280 Main St. West<br>
John Hodgings Engineering<br>
Building Room A315<br>
Hamilton, ON L8S 4L7</address></a>
</div>
<div class="col-xl-3 col-lg-4 col-md-6 text-center text-xl-left">
<h3>Office Hours</h3>
<p>Monday - Friday<br>8:30am to 4:30am</p>
</div>
<div class="col-xl-3 col-lg-4 col-md-6 text-center text-xl-left">
<h3>Contact Information</h3>
<p>Phone: <a href="tel:+19055259140p22222">905 525-9140 Ext. 22222</a><br> Email: <a href="mailto:name@mcmaster.ca">name@mcmaster.ca</a></p>
<div class="ss-icon-menu">
<!-- <a class="ss-icons ss-instagram" href="#"><span class="sr-only">Instagram</span></a>
<a class="ss-icons ss-twitter" href="#"><span class="sr-only">Twitter</span></a>
<a class="ss-icons ss-facebook" href="#"><span class="sr-only">Facebook</span></a> -->
<a class="ss-icons ss-youtube" href="#"><span class="sr-only">YouTube</span></a>
<a class="ss-icons ss-google-plus" href="#"><span class="sr-only">Google Plus</span></a>
<a class="ss-icons ss-linkedin" href="#"><span class="sr-only">LinkedIn</span></a>
</div>
</div>
</div>
</div>
</footer>