SVG Lien du Menu

Fonctionnalités

SVG Lien du Menu

Ce tutoriel s'applique à la version la plus récente du Phantom Thème. Veillez à mettre à jour votre thème en suivant le tutoriel vidéo disponible sur votre Espace Client.

Master +

1°) Télécharger son svg / Faire son svg

Tout d'abord avant de pouvoir afficher un svg (image vectorielle) à côté de votre lien, il faut le créer ou l'obtenir ! 

Pour cela 3 choix s'offrent à vous :

Attention : votre balise <svg> dans votre fichier doit obligatoirement contenir la ligne suivante : 

xmlns="http://www.w3.org/2000/svg"

2°) Mettre son svg sur sa boutique

Une fois votre svg acquis, renommez-le exactement comme le titre du lien sur lequel vous souhaitez le placer en format url:

  • Les espaces deviennent des tirets
  • Pas d'accents
  • Pas de caractères spéciaux

Exemple :

  • Avis Clients > avis-clients.svg
  • Collections > collections.svg
  • Été 2021 > ete-2021.svg

Une fois votre fichier correctement renommé, importez-le dans les fichiers de votre boutique. Pour cela, rendez-vous dans les Paramètres de votre boutique, puis dans Fichiers, et cliquez ensuite sur le bouton Téléverser des fichiers afin de placer votre/vos svg(s).

Exemple avec un lien Bagues :

3°) Paramétrez le lien

Rendez-vous dans la navigation de votre boutique, puis sur le menu principal de votre site.

Trouvez le lien concerné, ici le lien Bagues et rajoutez à la fin de celui #svg (si vous avez également #nofollow en référence à ce tutoriel, les deux sont cumulables)

Le #svg sera alors supprimé sans être lu par google. Cela permet d'indiquer quels liens doivent obtenir un svg placé à leur gauche.

Une fois cette manipulation faite et en s'étant assuré que l'option Afficher un fichier svg à côté d'un lien dans les paramètres Menu soit cochée.

Une fois tout ce tutoriel suivit, vous obtiendrez le résultat suivant :

Il faut noter que le svg prendre la couleur du lien, que ce soit la couleur de base, au survol, ou dans le menu mobile.