Comment utiliser les liens « Ancre » dans Divi

par | Fév 10, 2018 | Aller + Loin avec Divi, Documentation | 0 commentaires

Les liens « Ancres » servent à naviguer directement vers un contenu spécifique dans la m^me page.

On s’en sert souvent sur un site qui a une seule page, et qui p

Le menu Mega va permettre à tes utilisateurs de voir plus de liens à la fois sans être obligé de descendre dans le bas de ta page. Tes utilisateurs vont avoir une vue d’ensemble de tes services.

L’avantage d’un Mega Menus c’est que lorsqu’on survole le lien dans le menu, celui-ci va se déplier et ainsi afficher les liens et sous-menus parents supplémentaires dans le menu déroulant.

Allez on arrête les grands discours, et on passe à la technique.

1ère possibilité : Lien Ancre sur le menu

Dans Apparence> Menus  :

  • sélectionne le menu auquel tu souhaite ajouter le lien « Ancre »
  • clique sur la liste déroulante Liens personnalisés sur la gauche.
  • Cherche le champ « URL » puis donne un nom à ton lien « #Ancre1 ». Attention, n’oublie pas de le précèder de « # » et  il doit être unique.
  • Ajoute le titre que tu souhaites afficher pour ton lien dans le champ Texte du lien , puis clique sur Ajouter au menu .

Tu verras alors le nouvel élément ajouté à ton menu avec l’URL comme ancre.

Comment mettre un lien ancre sur son menu

Ensuite, il va te falloir sélectionner la section, la ligne ou le module vers lequel tu souhaites faire défiler ton lien d’ « Ancre ». Clique sur l’ onglet Avancé et dans la section ID CSS tu vas remettre le nom de l’ ancre unique que tu as choisi mais attention sans le hash précédent ( # ).

Tutoriel pour mettre un lien ancre sur son menu avec DIVI

Ensuite, il va te falloir sélectionner la section, la ligne ou le module vers lequel tu souhaites faire défiler ton lien d’ « Ancre ». Clique sur l’ onglet Avancé et dans la section ID CSS tu vas remettre le nom de l’ ancre unique que tu as choisi mais attention sans le hash précédent ( # ).

2ère possibilité : Lien Ancre sur un bouton

Il te faut éditer le bouton que tu veux lier a une section par exemple.

Le principe est le quasi le même, il ne te faudra ajouter le nom unique de l’ancre au champ « Bouton URL » du bouton avec le hash précédent (#)

Comment mettre un lien "Ancre" sur sun bouton DIVI

Ensuite, tu ajoutes l’ancre au champ « CSS ID » dans l’onglet Avancé de la section, de la ligne ou du module vers lequel tu souhaites le lier.

Tuto pour mettre un lien ancre sur sun bouton DIVI

Maintenant, une fois que tu as enregistré et actualisé ta page, ton nouveau bouton sera lié à la section, la ligne ou le module que tu auras défini.

3ème possibilité : Lien Ancre sur une autre page

Les solutions qu’on vient de voir sont pour créer des liens vers du contenu sur la même page.  Maintenant, je vais t’expliquer comment créer un lien vers une ancre sur une autre page.

Dans ce cas seulement, il va te falloir ajouter le nom de la page avant l’ancre. Ainsi, sur ton bouton, ton élément de menu personnalisé ou ton lien texte, tu ajoutes ton ancre comme suit:

/ nom de page / #ancre1

plutôt que juste

#ancre1

Voilà, tu sais tout sur les ancres …

A toi de jouer !

0 commentaires

Soumettre un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *