Carrousel Elementor ajouter un lien d’ancrage diffĂ©rent aux images

Carrousel Elementor ajouter un lien d’ancrage diffĂ©rent aux images
4 mn de lecture

Vous avez créé un joli carrousel sous Elementor et maintenant vous aimeriez que chacune des images qui le compose ait un lien différent qui redirige vers une page ou une section de page ?

Oui, mais voilĂ , pas de chance, l’Image Carousel Widget n’autorise qu’un lien personnalisĂ© unique.

Alors, vous vous demandez sûrement comment faire. Eh bien, rassurez-vous, il existe une méthode simple pour arriver à vos fins.

Suivez le guide. 😉

Carrousel Elementor : lien diffĂ©rent pour chaque image vers d’autres pages

En tout premier lieu, installez et activez l’extension Piotnet Addons For Elementor en mettant le mot-clĂ© piotnet pour la recherche dans extensions/ajouter.

installation plugin Piotnet addons for elementor

Puis, dans l’Ă©cran qui s’affiche, Ă  moins d’avoir besoin des autres widgets, ne laissez que “Image Carousel Multiple Custom Urls” activĂ© et cliquez sur “save settings”.

Cela Ă©vitera que du code inutile vienne impacter les performances de votre site.😉

widget Image Carousel Multiple Custom Urls de Piotnet

Ceci Ă©tant fait, passons sans dĂ©lai Ă  l’intĂ©gration des diffĂ©rents liens pour chacune des images.

Enregistrement des liens personnalisés vers des pages pour chaque image du carrousel

Pour commencer, allez en mode Ă©dition Elementor sur la page qui contient votre carrousel.

Vous vous apercevrez alors que la mention “PAFE Image Carousel Multiple Custom Urls” est apparue.

Puis, indiquez les URL souhaitĂ©es pour chaque image dans l’ordre oĂč elles apparaissent dans le carrousel en les sĂ©parant par une virgule et sans aucun espace.

Par exemple, pour :

image 1= https://URLDeLaPageDuLien1

image2= https://URLDeLaPageDuLien2

image 3=https://URLDeLaPageDuLien3

Il faut indiquer :

https://URLDeLaPageDuLien1,https://URLDeLaPageDuLien2,https://URLDeLaPageDuLien3

À ce sujet, vous pouvez choisir des pages internes ou externes à votre site, cela fonctionnera tout aussi bien.

carrousel Elementor ajout-liens personnalisés vers pages

Enfin, mettez Ă  jour, revenez sur votre site, testez et “enjoy“.đŸ€©

Il est Ă  noter que de la mĂȘme maniĂšre, vous pouvez rediriger les images de votre carrousel vers des sections de page.

Alors, voyons tout de suite comment procéder.

Carrousel Elementor : lien différent pour chaque image vers une section de page du site

En fait, la manipulation Ă  faire sera exactement la mĂȘme, sauf qu’auparavant il vous faudra crĂ©er des ancres Ă  l’endroit de la page oĂč vous voulez atterrir.

Si vous ne savez pas comment faire, alors, n’hĂ©sitez pas Ă  consulter mon article : Comment faire un lien vers un endroit prĂ©cis d’une page WordPress ?

Ensuite, notez bien les URL des pages vers lesquelles vous voulez faire un lien ainsi que les id d’ancrage que vous avez spĂ©cifiĂ© pour faire un lien vers une section d’une autre page.

Enfin, renseignez les liens personnalisés dans votre carrousel en ajoutant simplement #votreid.

  • Image 1= https://URLDeLaPageDuLien1/#votreid1
  • Image 2= https://URLDeLaPageDuLien2/ #votreid2
  • Image 3=https://URLDeLaPageDuLien3 /#votreid3

Ce qui donne :

https://URLDeLaPageDuLien1/#votreid1,https://URLDeLaPageDuLien2/#votreid2,https://URLDeLaPageDuLien3/#votreid3

Pour terminer, si vous souhaitez faire des liens, vers une section dans la mĂȘme page que celle de votre carrousel, c’est possible, il suffit de ne renseigner que l’id : #votreid1,#votreid2,#votreid3. 😉

Finalement, ce n’est pas compliquĂ© que ça de faire un joli carrousel dans Elementor avec des images qui pointent lĂ  oĂč vous le souhaitez.

Qu’en pensez-vous ?

Soumettre un commentaire 💬

guest
2 Commentaires
Commentaires en ligne
Afficher tous les commentaires