Language selection

Government of Canada / Gouvernement du Canada

Search

Display main band and sub-footer band with no optional links

The global (site-wide) footer at the bottom of each web page contains up to 3 bands:

The contextual band is optional on all page types (standard, transactional, campaign).

On transactional and campaign pages, you can omit the Social media, Mobile applications and About Canada.ca links from the sub-footer band.

Reference implementation

Expected output code - Footer with no contextual band and no optional links in sub-footer band
<footer id="wb-info">
	<h2 class="wb-inv">About this site</h2>


	<div class="gc-main-footer">
		<div class="container">
			<nav>
				<h3>Government of Canada</h3>
				<ul class="list-col-xs-1 list-col-sm-2 list-col-md-3"><li><a href="https://www.canada.ca/en/contact.html">All contacts</a></li>
					<li><a href="https://www.canada.ca/en/government/dept.html">Departments and agencies</a></li>
					<li><a href="https://www.canada.ca/en/government/system.html">About government</a></li></ul>
				<h4><span class="wb-inv">Themes and topics</span></h4>
				<ul class="list-unstyled colcount-sm-2 colcount-md-3"><li><a href="https://www.canada.ca/en/services/jobs.html">Jobs</a></li>
					<li><a href="https://www.canada.ca/en/services/immigration-citizenship.html">Immigration and citizenship</a></li>
					<li><a href="https://travel.gc.ca/">Travel and tourism</a></li>
					<li><a href="https://www.canada.ca/en/services/business.html">Business</a></li>
					<li><a href="https://www.canada.ca/en/services/benefits.html">Benefits</a></li>
					<li><a href="https://www.canada.ca/en/services/health.html">Health</a></li>
					<li><a href="https://www.canada.ca/en/services/taxes.html">Taxes</a></li>
					<li><a href="https://www.canada.ca/en/services/environment.html">Environment and natural resources</a></li>
					<li><a href="https://www.canada.ca/en/services/defence.html">National security and defence</a></li>
					<li><a href="https://www.canada.ca/en/services/culture.html">Culture, history and sport</a></li>
					<li><a href="https://www.canada.ca/en/services/policing.html">Policing, justice and emergencies</a></li>
					<li><a href="https://www.canada.ca/en/services/transport.html">Transport and infrastructure</a></li>
					<li><a href="https://international.gc.ca/world-monde/index.aspx?lang=eng">Canada and the world</a></li>
					<li><a href="https://www.canada.ca/en/services/finance.html">Money and finance</a></li>
					<li><a href="https://www.canada.ca/en/services/science.html">Science and innovation</a></li>
					<li><a href="https://www.canada.ca/en/services/indigenous-peoples.html">Indigenous peoples</a></li>
					<li><a href="https://www.canada.ca/en/services/veterans-military.html">Veterans and military</a></li>
					<li><a href="https://www.canada.ca/en/services/youth.html">Youth</a></li></ul>
			</nav>
		</div>
	</div>

	<div class="gc-sub-footer">
		<div class="container d-flex align-items-center">
			<nav>
				<h3 class="wb-inv">Government of Canada Corporate</h3>
				<ul>
					<li><a href="https://www.canada.ca/en/transparency/terms.html">Terms and conditions</a></li>
					<li><a href="https://www.canada.ca/en/transparency/privacy.html">Privacy</a></li></ul>
			</nav>
			<div class="wtrmrk align-self-end">
				<img src="https://wet-boew.github.io/themes-dist/GCWeb/GCWeb/assets/wmms-blk.svg" alt="Symbol of the Government of Canada" />
			</div>
		</div>
	</div>
</footer>

For GCWeb-Jekyll theme

By setting the noFooterContextual and noFooterCorporate variables to “true”, the contextual band and optional links from the sub-footer band will be hidden on page load.</p>

Guidance

Consult the Canada.ca Design System for guidance on which footer elements to use based on the type of page you’re creating:

Page details

Date modified: