Recherche
<gcds-search>

Autres noms : barre de recherche, boîte de recherche sur le site, champ de recherche.

Le composant recherche est un espace où entrer des mots-clés pour chercher des renseignements pertinents.

• Requis sur Canada.ca

• GitHub
• Figma

Créer un composant recherche

Utilisez le composant recherche pour aider les gens à trouver des renseignements à l'aide de mots-clés.

• Placez le composant recherche dans l'en-tête sous la bascule de langue et alignez-le sur la signature du gouvernement du Canada.
• Assurez-vous que l'en-tête est réactif afin que le composant recherche apparaisse sous la signature et la bascule de langue sur les appareils mobiles.

Codage et accessibilité du composant recherche

Configurer le composant recherche pour chercher du contenu sur Canada.ca

• Utilisez le composant recherche pour effectuer une recherche globale sur Canada.ca. Par défaut, le composant est configuré pour effectuer une recherche sur Canada.ca.
• Optez de limiter la recherche à un domaine spécifique à un organisme ou un programme.

Optez pour la modification du point de terminaison de la recherche pour les applications ou sites transactionnels

• Optez pour la modification du point de terminaison de la recherche pour une application ou un site transactionnel lorsque le fait de quitter le site interromprait la tâche ou le flux de travail d'une personne.
• Utilisez la méthode de requête HTTP par défaut GET du composant, ou bien utilisez POST au besoin en définissant l'attribut method.
• Définissez l'attribut action sur un point de terminaison de votre choix et définissez l'attribut placeholder (message-guide) pour refléter l'étendue de la recherche. Le message-guide du champ de recherche remplira également le texte de l'étiquette.

Obtenez votre code

Générez une version du composant dont vous avez besoin en sélectionnant les propriétés de code correspondantes ou explorez les possibilités en choisissant différentes valeurs de code.

1. Choisissez des valeurs de code pour obtenir l'élément que vous voulez.

2. Obtenez le code et intégrez-le dans votre environnement.

3. Ajoutez tout contenu nécessaire au composant (comme le texte du libellé).

Remarque : Conformément à la pratique courante, le générateur de code utilise l'anglais pour tous les éléments de code.