AX - Navigation
Aperçu
AX - Navigation est un composant Experience Cloud qui affiche une barre de navigation personnalisable avec des liens et des menus sur les pages des sites Experience.
Utilisez-le pour créer des structures de navigation personnalisées au-delà de la navigation standard d'Experience Cloud — comme des menus secondaires, une navigation contextuelle ou des groupes de liens spécifiques à une action. Configurez les éléments de menu, le style, les menus déroulants et les destinations des liens dans Experience Builder, sans code.
Parfait pour la navigation personnalisée des pages, les menus contextuels, les liens d'actions rapides, ou partout où votre portail a besoin d'une navigation au-delà de l'en-tête de site par défaut.
Ce composant utilise des emplacements pour une personnalisation avancée, ce qui le rend idéal pour les sites LWR. Les sites Aura ne prennent pas en charge ce niveau de personnalisation.
Le composant Avonni Navigation est conçu avec une plus grande flexibilité à l'esprit. Contrairement à la navigation standard de Salesforce, il permet des structures de menus plus complexes. Vous pouvez créer des menus à plusieurs niveaux — pensez-y comme des couches ou des étapes. Par exemple, vous pouvez avoir des éléments principaux (niveau 1), des sous-éléments sous ceux-ci (niveau 2), et même des sous-sous-éléments (niveau 3). Cette approche en couches facilite l'organisation et la présentation d'une grande quantité d'informations de manière structurée et accessible.
De plus, Avonni offre une gamme plus large d'options de style. Cela vous permet de personnaliser de près l'apparence de votre menu de navigation pour l'aligner sur le style de votre marque. Vous avez bien plus que des options de couleur principale et de police. Avonni permet une personnalisation plus poussée, vous permettant de créer une expérience de navigation visuellement attrayante qui semble être une extension naturelle de votre marque.
Propriétés
Orientation
Choisissez entre « horizontal » pour une barre de navigation traditionnelle en haut ou « vertical » pour une navigation de type barre latérale.
Afficher le logo du site
Activez pour afficher le logo du site dans le composant de navigation.
Fixé en haut
Activez pour conserver la barre de navigation en haut de la fenêtre d'affichage lorsque les utilisateurs font défiler la page.
Activer le menu mobile
Activez un menu optimisé pour mobile pour une meilleure navigation sur les petits écrans.
Ouvrir le menu au survol
Configurez les menus déroulants pour qu'ils s'ouvrent lorsque l'utilisateur survole un élément du menu, au lieu d'exiger un clic.
Ombré
Ajoutez un léger effet d'ombrage à la barre de navigation pour donner de la profondeur visuelle.
Afficher la petite flèche du menu déroulant
Affiche un petit graphique en forme de flèche pointant vers l'élément du menu lorsque son menu déroulant est ouvert.
Afficher l'indicateur d'élément
Activez pour afficher des indicateurs visuels signalant qu'il y a plus de contenu sous un élément de menu.
Source de données manuelle : Utilisez ceci pour créer votre structure de navigation, en définissant chaque élément et ses propriétés.
Libellé
Choisissez entre « horizontal » pour une barre de navigation traditionnelle en haut ou « vertical » pour une navigation de type barre latérale.
Description
Activez pour afficher le logo du site dans le composant de navigation.
Balise
Activez pour conserver la barre de navigation en haut de la fenêtre d'affichage lorsque les utilisateurs font défiler la page.
Info-bulle
Activez un menu optimisé pour mobile pour une meilleure navigation sur les petits écrans.
Variante d'avatar
Configurez les menus déroulants pour qu'ils s'ouvrent lorsque l'utilisateur survole un élément du menu, au lieu d'exiger un clic.
Nom de l'icône de l'avatar
Ajoutez un léger effet d'ombrage à la barre de navigation pour donner de la profondeur visuelle.
Taille de l'icône de l'avatar
Affiche un petit graphique en forme de flèche pointant vers l'élément du menu lorsque son menu déroulant est ouvert.
Source de l'image de l'avatar
Activez pour afficher des indicateurs visuels signalant qu'il y a plus de contenu sous un élément de menu.
Libellé des sous-éléments et sous-sous-éléments
Le texte affiché pour le sous-élément.
Lien vers des sous-éléments et sous-sous-éléments
L'URL ou la page du site vers laquelle le sous-élément renvoie.
Cela peut être imbriqué davantage en « sous-sous-éléments » avec les mêmes paramètres pour un niveau de profondeur supplémentaire
Paramètres généraux de navigation
Taille
Personnalisez les dimensions globales du menu de navigation.
Couleur d’arrière-plan
Définissez la couleur d'arrière-plan pour correspondre au thème de votre site.
Largeur maximale du logo du site
Définissez la largeur maximale du logo du site pour assurer une image de marque cohérente.
Taille/couleur de la bordure inférieure
Personnalisez la taille et la couleur de la bordure inférieure pour un rendu distinctif.
Paramètres des éléments de navigation
Largeur de l'élément, largeur min./max.
Spécifiez les dimensions de largeur pour chaque élément de navigation.
Couleur d'arrière-plan de l'élément
Définissez différentes couleurs d'arrière-plan pour les états actif et au survol.
Libellé de l'élément
Options de personnalisation étendues pour le texte du libellé, notamment la couleur, la taille de police, la famille, le poids et l'ombre, avec des paramètres distincts pour les états actif et au survol.
Description de l'élément
Personnalisez la couleur du texte, la taille de police, la famille, le poids et l'ombre pour les descriptions des éléments.
Bordure de l’élément
Ajustez la taille et la couleur de la bordure avec des paramètres supplémentaires pour l'état actif.
Style des sous-éléments et du menu
Couleur d'arrière-plan du sous-élément (sélectionné)
Choisissez une couleur d'arrière-plan pour les sous-éléments sélectionnés.
Espacement des sous-éléments (bloc/en ligne)
Ajustez l'espacement autour des sous-éléments.
Libellé du sous-élément
Options pour personnaliser la couleur du texte, la taille de police, la famille, le poids et l'ombre, y compris les paramètres de l'état au survol.
Dimensions du menu
Définissez la taille du menu, avec des paramètres de largeur et de hauteur min./max.
Largeur de colonne du menu
Définissez la largeur des colonnes dans le menu.
Espacement du menu (bloc/en ligne)
Ajustez l'espacement dans le menu.
Bordure du menu
Personnalisez la couleur, la taille, le style et le rayon de la bordure du menu.
Icône du menu
Définissez les couleurs pour les états normal, actif et au survol.
Libellé du groupe / de la colonne du menu
Options étendues de personnalisation du texte pour les libellés de groupe et de colonne.
Style du menu tiroir
Couleur d'arrière-plan du tiroir
Paramètres différents pour l'élément ouvert et les couleurs d'arrière-plan secondaires.
Titre principal/secondaire du tiroir
Personnalisez la couleur du texte, la taille de police, la famille, le poids et l'ombre pour les titres principaux et secondaires.
Description secondaire du tiroir
Options pour la couleur du texte, la taille de police, la famille, le poids et l'ombre.
Style du tiroir mobile
Titre principal/secondaire du tiroir mobile
Options de personnalisation similaires à celles du tiroir de bureau, adaptées à l'affichage mobile.
Description secondaire du tiroir mobile
Ajustez la couleur du texte, la taille de police, la famille, le poids et l'ombre pour les descriptions dans le tiroir mobile.
Apparence du menu
La Variante de menu dans le composant Avonni Navigation pour Salesforce Experience Cloud détermine le style et le comportement globaux du menu.
Si votre source de données est définie sur manuelle et que votre menu inclut des sous-éléments, vous pouvez utiliser la 'Variante de menu' fonctionnalité.
Voici les significations typiques des variantes de menu :
Base
La base représente le style standard d'un menu de navigation. Il est simple, avec des éléments de menu généralement listés sur une ligne pour une orientation horizontale ou sur une colonne pour une orientation verticale. Cette variante est épurée et minimaliste, ce qui en fait un bon choix pour la plupart des sites où un aspect classique est recherché.
Tiroir
La tiroir La variante implique un menu qui glisse depuis le côté, à la manière d'un tiroir ouvert. Ce style est souvent utilisé pour les menus verticaux, en particulier dans les vues mobiles ou lorsque l'espace à l'écran est limité. Il permet de garder la navigation à l'écart et accessible via une icône de menu (souvent une icône « hamburger ») jusqu'à ce qu'elle soit nécessaire.
Colonnes
Avec les colonnes la variante affiche les menus déroulants en colonnes, permettant une disposition structurée à plusieurs niveaux à l'intérieur même du menu déroulant. C'est particulièrement utile pour organiser une navigation complexe comportant de nombreux éléments ou catégories, ce qui facilite la consultation des options par les utilisateurs.
Onglets
La onglets La variante convertit les éléments du menu de premier niveau en navigation par onglets. Ce style est souvent utilisé lorsque différentes sections d'un site doivent être délimitées et accessibles directement depuis la barre de navigation. Il offre une interface familière aux utilisateurs, similaire aux onglets d'un classeur ou d'un navigateur Web.
Chacune de ces variantes peut aider à définir l'expérience de navigation de votre site, il est donc important d'en choisir une qui s'aligne sur les principes de conception de votre site et améliore le parcours utilisateur.
Mis à jour
Ce contenu vous a-t-il été utile ?