Intégrer des éléments HTML dans la boutique

de Gwen Sahmoune, 11.03.20



Flux de médias sociaux, boîtes de discussion, lecteurs de musique et autres – avec des éléments HTML, vous pouvez ajouter de nombreuses fonctions à votre boutique ePages Now.

Chaque site web – y compris votre boutique en ligne – est constitué de code HTML. Le HTML est un langage de balisage qui est principalement utilisé pour créer des sites web. Depuis peu, il vous est possible d’ajouter votre propre code HTML aux pages de contenu et de catégories de votre boutique. Cela vous offre d’innombrables possibilités d’intégrer de nouvelles fonctions et de nouveaux éléments.

Le principe est très simple : rendez-vous dans l’éditeur dans la zone d’administration de votre boutique et sélectionnez la page sur laquelle vous souhaitez insérer un élément HTML. Pour ce faire, vous devez faire glisser le nouvel élément de contenu « HTML personnalisé » sur la page. Vous pouvez ensuite insérer votre propre code HTML.

Dans la plupart des cas, vous n’écrirez probablement pas votre propre code, mais vous accéderez plutôt à un code tiers existant.

Nous avons établi une liste de fonctions possibles que vous pouvez désormais utiliser pour votre boutique.

Le code HTML inséré peut avoir un impact négatif sur le design et la fonctionnalité de votre boutique et affecter également le design responsive de votre boutique, ce qui peut entraîner des erreurs d’affichage sur les appareils mobiles. Vous apportez des changements à vos propres risques. Pour le HTML personnalisé et son impact potentiel sur votre boutique, le fournisseur de votre boutique ne fournit pas de SAV, veuillez donc examiner attentivement votre boutique après avoir effectué des modifications. Veuillez également noter que les mises à jour appliquées automatiquement affecteront le code de programmation de votre boutique. Par conséquent, vérifiez régulièrement si le code HTML que vous avez saisi remplit toujours son rôle et s’il affecte la conception ou la fonctionnalité après la mise à jour.

Ajouter son propre code HTML

  • Plus d’éléments : vous avez plus de possibilités concernant l’affichage des couleurs, des polices, des boutons, etc.
  • Iframes : grâce à l’intégration d’iframes, vous pouvez afficher dans la boutique n’importe quel autre contenu du web. Vous trouverez plus d’informations ici.
  • Points d’ancrage : vous pouvez ainsi définir un marqueur de saut, que vous pouvez ensuite relier. Cela permet à un utilisateur de se rendre exactement au bon endroit sur la page lorsque le lien est appelé. Vous trouverez plus d’informations ici.
  • Affichage des images : vous disposez de possibilités de conception étendues en ce qui concerne les images. Par exemple, il est possible d’afficher plus d’images les unes à côté des autres que ce qui est possible avec le logiciel de votre boutique par défaut.
  • Les médias sociaux : Facebook, Twitter et autres offrent leur propre code pour l’intégration des profils et des messages.

Elfsight : un site web, des tas de widgets

Le site web Elfsight vous propose des dizaines d’applications que vous pouvez intégrer dans votre boutique via un HTML personnalisé. Avec la version gratuite d’Elfsight, chaque application peut être affichée 200 fois par mois dans votre boutique et le logo Elfsight reste visible. Pour seulement 5 dollars par mois, le logo disparaît et les applications sont affichées 10 000 fois par mois – pour les petites boutiques, cela suffit généralement.

Pour presque chaque application, il existe de nombreuses options de paramétrage.

Certaines applications Elfsight peuvent ne pas être montrées à tous les visiteurs de la boutique. Cela peut se produire, par exemple, si un visiteur a spécifié que seuls les cookies nécessaires au fonctionnement de la boutique sont placés sur son appareil. Utilisez donc toujours Elfsight de manière à ce qu’il n’affecte pas le fonctionnement de la boutique au cas où des éléments ne seraient pas chargés. Vous devez donc toujours insérer les éléments pertinents pour la commande avec les éléments de contenu dans l’éditeur.

Les médias sociaux

  • Instagram : afficher les posts à partir d’Instagram en spécifiant les noms d’utilisateur ou les hashtags.
  • Facebook : les messages, vidéos ou photos peuvent être affichés à partir de Facebook.
  • Twitter : en plus d’afficher un profil Twitter, vous pouvez également afficher des tweets individuels.
  • Pinterest : avec Elfsight, vous pouvez afficher des profils, des tableaux ou des épingles.
  • YouTube : dans l’éditeur de votre boutique, vous pouvez intégrer par défaut des vidéos YouTube individuelles. Elfsight propose une galerie YouTube qui affiche plusieurs vidéos à partir d’un seul compte YouTube.

Éléments de conception

  • Pricing table : avec cette application, vous pouvez créer un tableau pour comparer les produits, par exemple. Dressez la liste des caractéristiques de produits similaires, ce qui permettra à vos clients de voir rapidement les différences entre eux.
  • Testimonials slider: afficher les témoignages des clients.
  • Team Showcase : avec cette application, il est possible de présenter votre équipe d’une manière attrayante.

Autres contenus

  • Click to call : Une petite boîte sera intégrée dans votre boutique, que vos clients pourront utiliser pour vous contacter par téléphone, sur Facebook ou WhatsApp.
  • Audio player : Vos visiteurs peuvent écouter des fichiers audio tels que de la musique ou des podcasts via un lecteur audio.
  • Weather: Grâce à l’application météo, vous pouvez montrer à vos clients le temps qu’il fait à un endroit préalablement défini.
  • File embed: Vous souhaitez fournir des fichiers à vos clients ? Il suffit de les intégrer via l’application correspondante.
  • Reviews d’Amazon, Google, Facebook, etc : Afficher les évaluations des utilisateurs, par exemple à partir de votre page Facebook.
  • PDF embed : Les fichiers PDF peuvent être affichés directement sur une page de la boutique.
  • Event calendar : Les événements sont clairement affichés.
  • Restaurant menu : si vous gérez un restaurant ou un café, par exemple, vous pouvez intégrer un menu attrayant dans la boutique.

Pour insérer votre propre code HTML

  1. Dans la zone d’administration de votre boutique, sélectionnez Éditeur dans le menu principal.
  2. Une liste des pages de votre boutique est maintenant affichée dans la barre latérale sous Pages. Sélectionnez la page que vous souhaitez modifier.
  3. Sélectionnez les éléments de contenu.
  4. Dans la colonne de gauche, sélectionnez l’élément de contenu HTML personnalisé et, en maintenant le bouton gauche de la souris enfoncé, faites glisser l’élément à l’endroit souhaité dans votre boutique sur la droite. Les zones bleues vous indiquent où vous pouvez insérer l’élément.
  5. Sélectionnez Ajouter HTML.
  6. Entrez le code HTML que vous voulez ajouter à la page.
  7. Sélectionnez Sauvegarder.
  8. Sélectionnez Afficher votre boutique et vérifiez si les modifications s’affichent correctement ou s’il y a des problèmes d’affichage de votre boutique.

A propos de l‘auteur


est Marketing Manager chez ePages.

Post similaire


Commentaires


Pas de commentaires

Partagez votre opinion


*Champ obligatoire

Laisser un commentaire

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