Comment ajouter un lien d'ancrage dans Elementor (Guide étape par étape)
Publié: 2022-02-18Cherchez-vous le moyen le plus simple d'ajouter des liens d'ancrage à vos pages de destination ? Eh bien, vous vous rapprochez d'une solution viable.
La création de pages Web devient plus intelligente et plus flexible avec un constructeur de pages par glisser-déposer comme Elementor. Ainsi, lorsqu'il s'agit de créer des balises d'ancrage, Elementor est bien plus pratique que n'importe quel plugin WordPress similaire.
Par conséquent, dans ce tutoriel étape par étape, nous vous montrerons comment configurer des liens d'ancrage dans Elementor afin que vous puissiez faire défiler jusqu'à une section spécifique de votre page après avoir cliqué sur un bouton/lien. Cela rendra vos pages Web plus conviviales et plus converties. Continue de lire.
Comment fonctionne le lien d'ancrage dans vos pages Web
Que fait une ancre pour un navire ? Il aide le navire à flotter dans une surface d'eau spécifique. Gardez-le à l'abri des rejets. Par conséquent, il peut tourner autour de l'ancre dans n'importe quelle direction dans les limites de la manille de l'ancre.
La même chose se produit avec les liens d'ancrage. Lorsque les visiteurs cliquent sur votre balise d'ancrage, elle les dirige vers une section spécifique de votre page de destination. Pas à une autre page, pas à une section différente.
Des liens d'ancrage sont nécessaires. En cliquant sur une balise d'ancrage, votre visiteur peut accéder à une certaine partie de votre page Web en un instant. Le processus permet de gagner du temps et peut inspirer les visiteurs à effectuer les actions souhaitées. De plus, cela les maintient sur la même page.
Cependant, passons au processus de création d'une ancre avec Elementor.
Comment ajouter une ancre dans Elementor Page Builder (3 étapes faciles)
Si vous avez déjà installé Elementor sur votre site Web, vous êtes toujours prêt à commencer à créer les balises d'ancrage. Cependant, si vous ne connaissez pas la méthode d'installation, obtenez de l'aide de notre guide sur l'installation d'Elementor.
Eh bien, suivons les étapes pour ajouter une ancre dans Elementor.
Étape 1 : Sélectionnez la page dans Elementor Editor
Connectez-vous à votre site WordPress. Accédez à la page sur laquelle vous souhaitez ajouter des liens d'ancrage. Dans la barre de menu du haut, cliquez sur "Modifier avec Elementor". Votre page Web sera ouverte à la personnalisation dans l'éditeur Elementor.
Étape 2 : Recherchez l'ancre de menu pour ajouter une balise d'ancre
Après avoir choisi de modifier votre page avec Elementor, vous serez redirigé vers la page ci-dessus. C'est l'éditeur Elementor. Dans la barre latérale gauche, tapez uniquement "ancre". Par conséquent, vous trouverez le widget Ancre de menu. Cela vous aidera à créer le lien d'ancrage souhaité.
Étape 3 : Commencer à ajouter un lien d'ancrage avec le widget d'ancrage de menu
Ce que vous devez faire est de faire glisser et déposer l'ancre de menu dans les sections de votre page où vous souhaitez ajouter une balise d'ancrage.
Par exemple, vous souhaitez ajouter une ancre dans votre section de tarification. Voici ce que vous devriez faire.
Faites défiler jusqu'à la section de tarification de votre page dans l'éditeur. Faites glisser le widget Menu Anchor et déposez-le au-dessus de la tarification.
Maintenant que vous avez fait glisser le widget au-dessus de votre section sélectionnée, vous devez écrire le nom de cette section dans la zone de contenu du widget.
D'où. écrivez le nom comme "Prix" dans le champ ID, car vous voulez que vos visiteurs sautent dans les prix.
Maintenant, quel élément ou texte devriez-vous choisir de lier ? C'est votre souhait. Sélectionnez un texte d'ancrage ou un onglet, ou même choisissez un élément de votre menu WordPress pour rediriger les visiteurs.
Cependant, nous avons sélectionné ici le bouton de démarrage afin que vous puissiez le comprendre facilement.
Alors, faites défiler jusqu'à votre page. Cliquez sur le bouton "Commencer". Vous verrez le lien du bouton dans le lien rempli. Ici, effacez le lien du bouton et mettez votre lien d'ancrage avec un hashtag, tout comme "#prices" (car votre ancre est la section des prix). Maintenant, appuyez sur "Enregistrer".
Par conséquent, visitez à nouveau votre page de destination. Cliquez sur votre bouton Ancre. Vous passerez immédiatement à la tarification.
Comment ajouter une ancre dans Elemntor avec le menu WordPress
C'est encore plus facile que le processus précédent. Pour ajouter une ancre dans un menu WordPress, vous devez d'abord créer l'ancre.
Par exemple, vous souhaitez créer une ancre dans votre section FAQ. Alors, allons dans votre section FAQ. Faites glisser le widget « Ancre de menu » au-dessus.
Mettez le mot "faq" dans le champ ID. Et enregistrez-le.
Allez ensuite dans votre menu WordPress. Cliquez sur le lien personnalisé.
Dans le champ URL, écrivez "#faq" et mettez le nom du texte du lien comme "FAQ". Cliquez ensuite sur "Ajouter au menu. Et enfin, appuyez sur "Enregistrer le menu".
Revenez maintenant à votre page de destination. Appuyez sur la FAQ à partir de votre menu. Vous serez rapidement redirigé vers votre section FAQ.
FAQ sur l'ajout d'un lien d'ancrage dans Elementor
Ici, nous avons répondu à une question courante concernant l'ajout d'un lien d'ancrage dans le site Elementor.
1. Qu'est-ce qu'un lien d'ancrage ?
Un lien d'ancrage est un type de lien de page qui vous amène à un endroit spécifique sur la même page.
2. Comment créer un lien vers une partie spécifique d'une page dans Elementor ?
Étape 1 : Cliquez sur Modifier la section .
Étape 2 : Accédez à la zone Avancé .
Étape 3 : Ajoutez un ID CSS comme ( First ) à la section.
Étape 4 : Sélectionnez le bouton ou le texte que vous utilisez comme ancre.
Étape 4 : Accédez à la zone Contenu du bouton ou du texte.
Étape 5 : Insérez l' ID CSS dans la section Lien comme ( #First ).
3. Comment ajouter manuellement des liens d'ancrage dans WordPress ?
Pour ce faire, vous devez ajouter deux éléments à un texte d'ancrage.
1. Choisissez un bloc et créez un lien d'ancrage avec le signe (#) juste avant le texte d'ancrage.
2. Sélectionnez un bloc puis allez dans l'onglet Avancé des paramètres du bloc.
3. Et collez le texte que vous avez ajouté comme lien d'ancrage sans ajouter le (#)
4. Comment ajouter manuellement des liens d'ancrage en HTML ?
Étape 1 : Vous devez ajouter le lien d'ancrage avec un préfixe (#) à l'aide de la balise d'ancrage HTML .
Étape 2 : Vous devez ajouter l' attribut ID à la balise HTML où vous souhaitez ajouter le lien d'ancrage. Faites en sorte que l'attribut ID commence sans le préfixe (#) .
5. Comment ajouter un lien vers une image dans Elementor ?
Tout d'abord : sélectionnez l'image dans laquelle vous souhaitez insérer un lien.
Deuxièmement : accédez à la zone Contenu de cette image.
Troisièmement : recherchez l'option Lien et sélectionnez- le Lien->Personnalisé .
Quatrième : Insérez votre lien personnalisé.
Dernières pensées
Donc, c'est tout ce dont vous avez besoin pour créer un lien d'ancrage si vous avez Elementor. Par conséquent, rappelez-vous quelques conseils clés. Vous ne pouvez tout simplement pas ajouter des liens d'ancrage au hasard. C'est un excellent outil pour augmenter la réponse des utilisateurs à vos pages Web. Vous devez donc savoir quelles sections sont les plus importantes pour vous. Ensuite, sélectionnez également le texte d'ancrage parfait qui correspond à votre ancre.
Par conséquent, Elementor est ouvert aux outils tiers. Vous pouvez intégrer le widget Happy Addons pour apporter plus de puissance à votre conception Web avec Elementor. Vous pouvez commencer gratuitement.
Eh bien, dis-nous maintenant. Trouvez-vous plus facile d'ajouter des liens d'ancrage dans Elementor ?