Créer des liens à l’intérieur d’une page avec DIVI

Il existe deux types de liens sur un site internet : les liens qui pointent vers une page différente de celle où se trouve l’internaute et les liens qui pointent vers un endroit précis de la page courante ou d’une autre page web. Ces derniers s’appellent des ancres nommées.

En HTML, pour créer une ancre, il faut donner un identifiant à la cible :

<div id="monidentifiant">...</div>

ou

<a name="monidentifiant" id="monidentifiant">

… et créer un lien vers #identifiant :

<a href="#monidentifiant">...</a>

Avec DIVI, voici comment attribuer un identifiant à une section, une ligne ou un module :

  1. 01Accédez à votre page ou à votre article et sélectionnez votre cible : une section (blocs bleus, violets ou oranges), une ligne (blocs verts) ou un module (blocs gris).
  2. 02Editez le bloc en cliquant sur l’icône qui représente une roue dentée puis cliquez sur l’onglet Avancé
  3. 03Déroulez la section ID et classes CSS et saisissez l’identifiant de votre choix dans le champ ID CSS : vous venez d’attribuer un identifiant à votre élément.

Créons maintenant le lien vers cette section :

  1. 04 Nous choisissons de positionner un bouton en haut de la page qui permettra d’accéder directement à la section en question.
  2. 05 Ajoutez un module Bouton à l’endroit de votre choix
  3. 06 Éditez le bouton en cliquant sur l’icône qui représente une roue dentée
  4. 07 Dans la section Lien (dans le premier onglet), renseignez l’identifiant que vous avez choisi d’attribuer à votre cible précédé du dièse #
Créer un lien vers une ancre nommée avec DIVI

Enregistrez votre travail et testez : au clic sur le bouton, vous devriez voir la fenêtre de votre navigateur se positionner à l’endroit précis sur lequel votre ancre a été positionnée.

Il est bien entendu possible d’intégrer un lien vers une ancre dans un menu de navigation ou dans un texte. Le lien aura toujours la forme #monidentifiant pour pointer vers l’élément que vous aurez nommé monidentifiant.
Si vous avez plusieurs ancres nommées dans une page, veillez à choisir des identifiants différents.

Un dernier conseil : choisissez des identifiants qui ont du sens (ça, c’est pour notre ami Google) : ainsi, vos ID pourrait être voirlesproduits, voirlesnouveautes, etc…