Si vous souhaitez faire un site web en une page (« site one-page »), vous aurez certainement besoin de savoir créer une ancre.
A quoi sert une ancre sur WordPress ?
Une ancre a pour objectif de faire un lien au sein d’une même page. Par exemple dans un site one-pageUn site one page est un site web qui présente l'ensemble de son contenu sur une seule page web, plutôt que sur plusieu... More, le menu principal peut mener aux différentes parties de votre page.
Voici l’exemple d’un site de restaurant où le menu est composé de 4 items :
Ajouter des ancres dans sa page
Identifier les sections clés où faire les liens
Pour pouvoir faire des liens comme dans l’exemple ci-dessous, chaque partie de votre menu doit correspondre à une sectionUne section est une division d'une page qui peut contenir plusieurs modules. Les sections permettent de structurer les p... More dans Divi. Si votre site présente votre activité d’indépendant, vous pourrez par exemple avoir les sections suivantes :
- Présentation
- Prestations
- Nos clients
- Nous contacter
Ajouter des identifiants aux sections de Divi
Une fois ces sections définies, ajouter un nom à chacune un « ID CSS » dans chacune des sections avancées de votre page.
Allez dans les paramètres de la sectionUne section est une division d'une page qui peut contenir plusieurs modules. Les sections permettent de structurer les p... More > Avancé > ID et classes CSSLes CSS, ou feuilles de style en cascade, sont des fichiers qui contrôlent l'apparence d'un site web. Même si Divi pos... More > ID CSSLes CSS, ou feuilles de style en cascade, sont des fichiers qui contrôlent l'apparence d'un site web. Même si Divi pos... More
Attention, chaque ID ajoutée doit être unique. Deux ID sur une même page ne peuvent porter le même nom. En effet, si le point A doit aller vers le point B mais qu’il y a deux B possibles, le lien ne pourra fonctionner.
Paramétrer son menu principal dans le tableau de bord de WordPress
Une fois vos sections identifiées avec vos id distincts, retournez dans votre dashboard WordPressWordPress est un système de gestion de contenu (CMS) open source qui permet aux utilisateurs de créer et de gérer fac... More afin de paramétrer le menu principal. Pour cela, rendez-vous dans la partie apparence puis menus. C’est ici que vous allez reporter chaque ancre renseignée dans l’étape précédente.
Ajouter des liens personnalisés pour naviguer facilement
Dans un menu WordPressWordPress est un système de gestion de contenu (CMS) open source qui permet aux utilisateurs de créer et de gérer fac... More classique, on ajoute des pages dans notre menu. Dans le cas des ancres, nous utilisons l’item « liens personnalisés ».
Renseigner son ancre grâce au sélecteur ID
Une fois le texte du lien choisi, ajouté votre ID précédé de /#
Finaliser le menu WordPress pour une navigation optimisée
Ajoutez chacune des ancres au menu principal de WordPressWordPress est un système de gestion de contenu (CMS) open source qui permet aux utilisateurs de créer et de gérer fac... More et testez ensuite. Si vous avez des pages annexes à insérer au menu, vous pouvez également les ajouter de façon classique avec la sectionUne section est une division d'une page qui peut contenir plusieurs modules. Les sections permettent de structurer les p... More « pages ».
Enrichir son menu
Vous souhaitez ajouter des effets particuliers à votre menu avec facilité ? Le plugin Divi Pixel peut vous aider à ajouter :
- un bouton d’appel à l’action
- des icônes de réseaux sociaux
- des effets au survol pour personnaliser votre header
Découvrez toutes les fonctionnalités du plugin en cliquant sur la bannière ci-dessous (lien affilié).
