Ancre Elementor : Les 2 méthodes les plus faciles

Photo de profil de Cédric Chevillard

Cédric Chevillard ✌️

Je crée des sites web sur-mesure, pensés pour booster votre activité.

Elementor est devenu un incontournable pour ceux qui veulent créer un site WordPress sans se prendre la tête avec du code.

Mais au-delà de la mise en page, il y a des petites astuces qui peuvent vraiment faire la différence, comme l’utilisation des ancres Elementor.

Vous savez, ces liens qui permettent de naviguer directement vers une section spécifique de votre page en un clic ?

C’est non seulement pratique pour vos visiteurs, mais aussi un vrai plus pour améliorer l’expérience utilisateur de votre site.

Il existe deux méthodes principales pour ajouter des ancres avec Elementor : en utilisant le module « Ancre de menu » et en ajoutant un ID directement à un élément.

Si vous souhaitez des conseils personnalisés ou une assistance en direct par visio, vous pouvez consulter un expert Elementor pour vous accompagner.

Note : Pour l’exemple, je vais vous montrer comment ajouter un lien cliquable sur du texte. Cependant, vous pouvez obtenir le même résultat en utilisant un module bouton ou tout autre module Elementor qui permet d’ajouter un lien.

Méthode 1 : Utiliser le module Elementor « Ancre de menu »

  1. Ouvrir Elementor :
    • Rendez-vous sur votre tableau de bord WordPress.
    • Créez une nouvelle page ou modifiez une page existante en cliquant sur le bouton « Modifier avec Elementor ».
  2. Ajouter le module Ancre de menu :
    • Dans le panneau des modules d’Elementor, situé à gauche, recherchez le module « Ancre de menu ».
    • Faites glisser ce module et déposez-le à l’endroit souhaité sur votre page, que ce soit au-dessus d’un titre, d’un paragraphe ou de tout autre élément.
  3. Configurer l’ancre :
    Dans le panneau de configuration de l’ancre, sous « Nom de l’ancre », entrez un identifiant unique. Par exemple, pour une section de témoignages, vous pourriez saisir « temoignages ».
Interface de l'extension WordPress Elementor avec le focus sur le module "Ancre de menu"
Ajout du module « Ancre de menu » pour créer mon ancre.
  1. Créer le lien d’ancrage :
    • Sélectionnez le texte que vous souhaitez transformer en lien.
    • Cliquez sur l’icône de lien dans la barre d’outils qui apparaît.
    • Dans le champ URL, saisissez le symbole « # » suivi du nom de l’ancre que vous avez défini (par exemple, « #temoignages »).
    • Cliquez sur l’icône « Appliquer » pour valider et créer le lien.
Ajout d'un lien dans le module éditeur de texte d'Elementor vers une ancre précise
Exemple de lien cliquable vers le module « Ancre de menu ».

Méthode 2 : Ajouter un ID directement à un module Elementor

Le principe reste le même, mais au lieu d’insérer le module « Ancre de menu » d’Elementor, nous allons directement ajouter une ancre à l’élément de votre choix.

  1. Sélectionner l’élément à ancrer :
    Cliquez sur l’élément auquel vous souhaitez ajouter une ancre, comme une section, un en-tête ou une colonne.
  2. Ajouter un ID :
    • Dans le panneau de configuration de l’élément, allez dans l’onglet « Avancé ».
    • Dans le champ « ID CSS », saisissez un identifiant unique pour cet élément. Par exemple, si vous créez une ancre pour une section de services, vous pourriez entrer « services ».
Ajout d"un id CSS à un module Titre d'Elementor pour y mettre une ancre
Exemple de lien cliquable vers le module « Titre ».

Les avantages de mettre en place des ancres Elementor

L’utilisation d’ancres dans Elementor offre plusieurs avantages clés pour améliorer la navigation et l’expérience utilisateur sur votre site.

  1. Navigation simplifiée :
    Les ancres permettent aux visiteurs de se déplacer rapidement vers des sections spécifiques de votre page en un seul clic, sans avoir à faire défiler toute la page. Cela est particulièrement utile sur les pages longues ou les pages à contenu dense, comme les pages de FAQ, de services ou de témoignages.
  2. Amélioration de l’expérience utilisateur :
    En facilitant l’accès direct à l’information recherchée, vous améliorez l’expérience utilisateur. Les visiteurs trouvent plus rapidement ce qu’ils cherchent, ce qui peut augmenter leur satisfaction et les inciter à rester plus longtemps sur votre site.
  3. Optimisation pour le SEO :
    Les ancres internes sont également bénéfiques pour le référencement et font partie des bases du SEO. Elles permettent aux moteurs de recherche de mieux comprendre la structure de votre contenu et d’indexer les différentes sections de manière plus efficace. Cela peut conduire à une meilleure visibilité dans les résultats de recherche.
  4. Call-to-Action plus efficaces :
    Les ancres peuvent également être utilisées pour rendre vos appels à l’action (CTA) plus percutants. Par exemple, un bouton « En savoir plus » peut directement mener l’utilisateur à une section détaillée sur un produit ou service, augmentant ainsi les chances de conversion.
  5. Facilité de mise en place :
    Avec Elementor, créer des ancres est simple et ne nécessite pas de compétences techniques avancées. En quelques clics, vous pouvez ajouter des ancres à n’importe quelle section de votre page, ce qui en fait un outil accessible pour tous les niveaux d’utilisateurs.

Et les inconvénients de cette pratique

Bien que l’utilisation d’ancres dans Elementor présente de nombreux avantages, il est également important de considérer certains inconvénients potentiels pour s’assurer qu’ils conviennent à vos objectifs spécifiques.

  1. Impact sur le design mobile :
    L’utilisation d’ancres peut parfois poser des problèmes sur les appareils mobiles. Par exemple, en raison de la taille réduite des écrans, le positionnement exact de l’ancre peut ne pas correspondre parfaitement à ce qui est visible sur un écran de bureau. Cela peut entraîner une expérience utilisateur incohérente, où l’ancre ne mène pas précisément à la section souhaitée.
  2. Confusion pour les utilisateurs :
    Si les ancres ne sont pas utilisées de manière intuitive, elles peuvent semer la confusion chez les utilisateurs. Par exemple, un utilisateur peut ne pas comprendre pourquoi un clic sur un lien le mène à une section spécifique plutôt qu’à une autre. Il est donc crucial de s’assurer que les liens d’ancrage sont clairs et logiquement associés aux sections correspondantes.
  3. Problèmes de chargement de page :
    Dans certains cas, les ancres peuvent causer des problèmes si une page met du temps à se charger. Si la section ciblée par l’ancre n’est pas encore complètement chargée lorsque l’utilisateur clique sur le lien, cela peut créer une mauvaise expérience, voire faire croire que le lien ne fonctionne pas.
  4. Complexité dans la gestion de contenu :
    Si votre site évolue fréquemment, avec des sections ajoutées ou réorganisées, la gestion des ancres peut devenir complexe. Chaque modification de contenu nécessite une vérification pour s’assurer que les ancres mènent toujours aux bons endroits, ce qui peut être chronophage, surtout pour les sites avec beaucoup de contenu.
  5. Accessibilité et SEO :
    Bien que les ancres puissent améliorer le SEO, une mauvaise utilisation peut aussi nuire à l’accessibilité. Les utilisateurs de lecteurs d’écran, par exemple, peuvent trouver difficile de naviguer avec des ancres si elles ne sont pas bien implémentées. De plus, si vous abusez des ancres, cela peut diluer leur efficacité SEO, en particulier si plusieurs ancres pointent vers des sections qui ne sont pas particulièrement distinctes ou importantes.

Conclusion

L’intégration d’ancres dans vos pages Elementor est un excellent moyen d’améliorer la navigation et l’expérience utilisateur sur votre site.

Grâce à leur simplicité de mise en place, vous pouvez guider vos visiteurs directement vers les informations clés, tout en optimisant votre SEO, comme c’est le cas avec l’obfuscation de lien.

Cependant, il est crucial de bien planifier leur utilisation pour éviter les pièges potentiels, notamment sur les appareils mobiles ou lors de la gestion de contenu évolutif.

En pesant soigneusement les avantages et les inconvénients, vous pouvez tirer le meilleur parti des ancres Elementor, tout en créant une expérience utilisateur fluide et engageante.

Et si vous êtes intéressé par l’utilisation d’ancres dans un contexte plus large, comme avec d’autres constructeurs de pages ou directement dans WordPress, je vous invite à explorer notre article sur les ancres WordPress en général ou prendre contact directement avec un Webmaster WordPress.

Vous y découvrirez des conseils supplémentaires pour maximiser l’efficacité de cette technique sur l’ensemble de votre site.

Mes autres articles

Infographie de l'article augmenter les ventes en ligne

Comment augmenter les ventes en ligne avec BEntrepreneur ? avec 1 étude de cas

Beaucoup d’utilisateurs de BEntrepreneur ont vu leurs ventes en ligne augmenter de manière significative.  Les études montrent des améliorations dans les taux de conversion et...

Infographie de l'article "espace insécable html"

Espace insécable en html

Lorsqu’on crée des pages web, chaque détail compte pour assurer une mise en page fluide et agréable. L’un de ces détails souvent négligés, mais pourtant...

Infographie de l'article Rétroplanning Site Internet

Retroplanning de site internet, les étapes clés

Lorsqu’on se lance dans la création d’un site internet, la planification est cruciale pour garantir la réussite du projet. C’est là qu’intervient le rétroplanning. Il...

Besoin d'un coup de main ? 👇