Sélection de la langue

Gouvernement du Canada / Government of Canada

Recherche

Menu GCWeb

Statut
Stable
Type
Fonctionnalité du site Canada.ca
Dernière révision
2022-05-26

Objectif

Menu principal afin de naviguer les diverses sections de Canada.ca.

Example pratique

Comment mettre en œuvre

Doit être utilisé accompagné de la version 2.0 de l'entête.

Évaluation et rapport

Il n'y a pas d'évaluation ni de rapport disponible pour ce composant.

API (version 2.0)

Classe CSS Gabarit Rendu visuel Schéma
Version 1.0 Version 2.0 Version 1.0 n.d.

Classe CSS (v1.0)

gcweb-menu

Avant et après

Version 2.0

Liste des changements depuis la version 1.0 : Suppression du <div class="container">.

<nav class="gcweb-menu" typeof="SiteNavigationElement">
			<h2 class="wb-inv">{{ i18nText-menu }}</h2>
			<button type="button" aria-haspopup="true" aria-expanded="false">{{ i18nText-menuBtn }} <span class="expicon glyphicon glyphicon-chevron-down"></span></button>
			<ul role="menu" aria-orientation="vertical" data-ajax-replace="{{ i18nText-menuAjax }}">
		{%- if i18nText-lang == "fr" -%}
				...
		{%- elsif i18nText-lang == "en" -%}
				...
		{%- endif -%}
			</ul>
		</nav>

Version 1.0 (obsolète)

La version 1.0 du menu est obsolète mais toujours supportée.

<nav class="gcweb-menu" typeof="SiteNavigationElement">
			<div class="container">
				<h2 class="wb-inv">{{ i18nText-menu }}</h2>
				<button type="button" aria-haspopup="true" aria-expanded="false">{{ i18nText-menuBtn }} <span class="expicon glyphicon glyphicon-chevron-down"></span></button>
				<ul role="menu" aria-orientation="vertical" data-ajax-replace="{{ i18nText-menuAjax }}">
		{%- if i18nText-lang == "fr" -%}
					...
		{%- elsif i18nText-lang == "en" -%}
					...
		{%- endif -%}
				</ul>
			</div>
		</nav>

Exemple pratique

Version 1.0 de l'entête et du menu GCWeb

Détails de la page

Date de modification :