Footers

Footers serve site visitors who arrive at the bottom of a page without finding what they want.

Best practices

  • Footer links should point to popular content that might answer a visitor’s remaining questions. Links to disclaimers and legal content sometimes need to be in the footer, but try to minimize this where possible.
  • How links are organized in the footer does not have to mirror top-level header navigation.
  • Important contact information should be limited to general email, phone numbers, and one physical address.

The global footer is intended for use on all pages within the City of Winnipeg public website. They are available in English and French.

The global footer includes:

  • Organized columns of important links
  • Links to the social media directory
  • General contact information
  • Links to important policies and terms & conditions
  • A link to 311

See our basic page example and basic French page example for the global footers in use.

Global English footer

<!--stopindex-->
<footer class="global-footer">
  <div class="container">
    <a class="logo" aria-label="City of Winnipeg homepage" href="https://winnipeg.ca"><img alt="City of Winnipeg logo" src="/designsystem/assets/img/cv-h-white-rgb.svg"></a>
    <div class="row">
      <div class="col-lg-2 mb-4">
        <p class="address">City of Winnipeg<br>510 Main St<br>Winnipeg, Manitoba<br>R3B 1B9</p>
      </div>
      <div class="col-6 col-sm-3 col-lg-2">
        <ul class="no-inline-links">
          <li><a href="https://winnipeg.ca">Home</a></li>
          <li><a href="https://winnipeg.ca/interhom/accessibility/accessWinnipegCa.stm">Accessibility</a></li>          
          <li><a href="https://winnipeg.ca/311/default.asp#mobile-apps">Apps</a></li>
          <li><a href="https://data.winnipeg.ca">Open Data</a></li>
        </ul>
      </div>
      <div class="col-6 col-sm-3 col-lg-2">
        <ul class="no-inline-links">
          <li><a href="https://winnipeg.ca/interhom/toc/residents.asp">Residents</a></li>
          <li><a href="https://winnipeg.ca/interhom/toc/business.asp">Business</a></li>
          <li><a href="https://winnipeg.ca/interhom/toc/visitors.asp">Visitors</a></li>
          <li><a href="https://winnipeg.ca/interhom/toc/cityhall.asp">City Hall</a></li>
          <li><a href="https://winnipeg.ca/interhom/toc/departments.asp">Departments</a></li>
        </ul>
      </div>
      <div class="col-6 col-sm-3 col-lg-2">
        <ul class="no-inline-links">
          <li><a href="https://winnipeg.ca/311/default.asp#contact-311">Contact 311</a></li>
          <li><a href="https://winnipeg.ca/interhom/contact/locations.stm">City locations</a></li>
          <li><a href="https://winnipeg.ca/ourstories/default.stm">Our City, Our Stories</a></li>
          <li><a href="https://winnipeg.ca/interhom/mayor/default.asp">Mayor's office</a></li>
          <li><a href="https://winnipeg.ca/csc/media-centre/default.stm">Media centre</a></li>
        </ul>
      </div>
      <div class="col-6 col-sm-3 col-lg-2">
        <ul class="no-inline-links">
          <li><a href="https://selfservice.winnipeg.ca/">Employee portal</a></li>
          <li><a href="https://winnipeg.ca/hr/default.stm">Careers</a></li>
          <li><a href="https://winnipeg.ca/hr/department-information/employee-policies.stm">Employee Policies</a></li>
          <li><a href="https://winnipeg.ca/interhom/TOC/sitemap.asp">Site map</a></li>
          <li><a href="https://winnipeg.ca/interhom/conditions/privacy.stm">Privacy</a></li>
        </ul>
      </div>
      <div class="col-lg-2 mt-4 mt-lg-0">
        <div>
          <ul class="no-inline-links">
            <li><a href="https://winnipeg.ca/interhom/contact/default.stm">Connect with us</a></li>
          </ul>
        </div>
        <div class="social-links">
          <a href="https://twitter.com/cityofwinnipeg" aria-label="City of Winnipeg Twitter">
          <span class="fab fa-twitter" aria-hidden="true"></span>
          </a>
          <a href="https://www.facebook.com/cityofwinnipeg" aria-label="City of Winnipeg Facebook">
          <span class="fab fa-facebook-f" aria-hidden="true"></span>
          </a>
          <a href="https://www.youtube.com/user/thecityofwinnipeg" aria-label="City of Winnipeg YouTube">
          <span class="fab fa-youtube" aria-hidden="true"></span>
          </a>
          <a href="https://www.instagram.com/thecityofwinnipeg/" aria-label="City of Winnipeg Instagram">
          <span class="fab fa-instagram" aria-hidden="true"></span>
          </a>
          <a href="https://winnipeg.ca/interhom/RSS/default.stm" aria-label="City of Winnipeg RSS feed">
          <span class="far fa-rss" aria-hidden="true"></span>
          </a>
          <a href="https://winnipeg.ca/WpgMail/subscribe_all.stm" aria-label="City of Winnipeg Email">
          <span class="far fa-envelope" aria-hidden="true"></span>
          </a>
        </div>
      </div>
    </div>
    <div class="row justify-content-between mt-4">
      <div class="col-md-7">
        <h2 class="h6">Land acknowledgement</h2>
        <p class="small">Winnipeg is located in Treaty One Territory, the home and traditional lands of the Anishinaabe (Ojibwe), Ininew (Cree), and Dakota peoples, and in the National Homeland of the Red River Métis.  Our drinking water comes from Shoal Lake 40 First Nation, in Treaty Three Territory.</p>
      </div>
      <div class="col-md-4">
        <div class="small">&copy;1996-<script>
            document.write(new Date().getFullYear())
          </script>, City of Winnipeg</div>
        <div class="small conditions">Use of this site signifies your agreement to the <a href="https://winnipeg.ca/interhom/conditions/conditions-of-use.stm">Conditions of use</a></div>
      </div>
    </div>
  </div>
</footer>

Global French footer

<!--stopindex-->
<footer class="global-footer">
    <div class="container">
      <a class="logo" aria-label="Page d'accueil de la ville de Winnipeg" href="https://winnipeg.ca/francais/"><img alt="Logo de la ville de Winnipeg" src="/designsystem/assets/img/cv-h-white-rgb.svg"></a>
      <div class="row">
        <div class="col-lg-2 mb-4">
          <p class="address">Ville de Winnipeg<br>510, rue Main<br>Winnipeg (Manitoba)<br>R3B 1B9</p>
        </div>
        <div class="col-6 col-sm-3 col-lg-2">
          <ul class="no-inline-links">
            <li><a href="https://winnipeg.ca/francais/">Page d&#8217;accueil</a></li>
            <li><a href="https://winnipeg.ca/francais/interhom/accessibility/accessWinnipegCa.stm">Accessibilit&#233;</a></li>            
            <li><a href="https://winnipeg.ca/francais/311/default.asp#mobile-apps">Applis</a></li>
            <li><a href="https://data.winnipeg.ca">Donn&#233;es ouvertes</a></li>
          </ul>
        </div>
        <div class="col-6 col-sm-3 col-lg-2">
          <ul class="no-inline-links">
            <li><a href="https://winnipeg.ca/francais/interhom/toc/residents.asp">R&#233;sidents</a></li>
            <li><a href="https://winnipeg.ca/francais/interhom/toc/business.asp">Entreprises</a></li>
            <li><a href="https://winnipeg.ca/francais/interhom/toc/visitors.asp">Visiteurs</a></li>
            <li><a href="https://winnipeg.ca/francais/interhom/toc/cityhall.asp">H&#244;tel de ville</a></li>
            <li><a href="https://winnipeg.ca/francais/interhom/toc/departments.asp">Services</a></li>
          </ul>
        </div>
        <div class="col-6 col-sm-3 col-lg-2">
          <ul class="no-inline-links">
            <li><a href="https://winnipeg.ca/francais/311/default.asp#contact-311">Communiquez avec le Service 311</a></li>
            <li><a href="https://winnipeg.ca/francais/interhom/contact/locations.stm">Bureaux de services municipaux</a></li>
            <li><a href="https://winnipeg.ca/francais/ourstories/default.stm">Notre ville, nos histoires</a></li>
            <li><a href="https://winnipeg.ca/francais/interhom/mayor/default.asp">Bureau du maire</a></li>
            <li><a href="https://winnipeg.ca/francais/csc/media-centre/default.stm">Demandes de renseignements des m&#233;dias</a></li>
          </ul>
        </div>
        <div class="col-6 col-sm-3 col-lg-2">
          <ul class="no-inline-links">
            <li><a href="https://selfservice.winnipeg.ca/">Portail pour les employ&#233;s</a></li>
            <li><a href="https://winnipeg.ca/francais/hr/default.stm">Carri&#232;res</a></li>
            <li><a href="https://winnipeg.ca/francais/hr/department-information/employee-policies.stm">Politiques visant le personnel</a></li>
            <li><a href="https://winnipeg.ca/francais/interhom/TOC/sitemap.asp">Plan du site</a></li>
            <li><a href="https://winnipeg.ca/francais/interhom/conditions/privacy.stm">Politique de confidentialit&#233;</a></li>
          </ul>
        </div>
        <div class="col-lg-2 mt-4 mt-lg-0">
          <div>
            <ul class="no-inline-links">
              <li><a href="https://winnipeg.ca/francais/interhom/contact/default.stm">Suivez-nous!</a></li>
            </ul>
          </div>
          <div class="social-links">
            <a href="https://twitter.com/cityofwinnipeg" aria-label="Suivez-nous sur Twitter">
            <span class="fab fa-twitter" aria-hidden="true"></span>
            </a>
            <a href="https://www.facebook.com/cityofwinnipeg" aria-label="Aimez-nous sur Facebook">
            <span class="fab fa-facebook-f" aria-hidden="true"></span>
            </a>
            <a href="https://www.youtube.com/user/thecityofwinnipeg" aria-label="Visionnez nos vid&#233;os sur YouTube">
            <span class="fab fa-youtube" aria-hidden="true"></span>
            </a>
            <a href="https://www.instagram.com/thecityofwinnipeg/" aria-label="Instagram">
            <span class="fab fa-instagram" aria-hidden="true"></span>
            </a>
            <a href="https://winnipeg.ca/francais/interhom/RSS/default.stm" aria-label="Fils RSS">
            <span class="far fa-rss" aria-hidden="true"></span>
            </a>
            <a href="https://winnipeg.ca/francais/WpgMail/subscribe_all.stm" aria-label="S&#8217;inscrire aux bulletins &#233;lectroniques">
            <span class="far fa-envelope" aria-hidden="true"></span>
            </a>
          </div>
        </div>
      </div>
      <div class="row justify-content-between mt-4">
        <div class="col-md-7">
          <h2 class="h6">Reconnaissance territoriale</h2>
          <p class="small">Winnipeg est situé sur le territoire visé par le Traité n&#186; 1, le berceau et territoire traditionnel des peuples anishinaabe (ojibwé), ininew (cri) et dakota, et sur les terres ancestrales nationales des Métis de la Rivière-Rouge. Notre eau potable provient de la Première Nation Shoal Lake, n&#186; 40, qui est située sur le territoire visé par le Traité n&#186; 3.</p>
        </div>
        <div class="col-md-4">
          <div class="small">&copy;1996-<script>document.write(new Date().getFullYear())</script>, Ville de Winnipeg</div>
          <div class="conditions small">Toute personne qui navigue sur ce site consent &#224; en respecter les <a href="https://winnipeg.ca/francais/interhom/conditions/conditions-of-use.stm">conditions d&#8217;utilisation</a>.</div>
        </div>
      </div>
    </div>
  </footer>

The universal footer is intended for use on all third party products and services that might have their own global footer and global components (product logo, navigation, etc.).

©1996-, City of Winnipeg
Optional text here
<footer class="universal-footer" style="background-image: url(/designsystem/assets/img/footer-bg.png);">
  <div class="container-fluid">
    <div class="clearfix">
      <div class="float-left small">&copy;1996-<script>document.write(new Date().getFullYear())</script>, City of Winnipeg</div>
      <div class="float-right small">Optional text here</div>
    </div>
  </div>
</footer>