Remarque : même si nos guides les plus populaires ont été traduits en français, certains guides sont uniquement disponibles en anglais.
Utilisation de la zone d'Injection de Code

Vous pouvez ajouter du code et des scripts personnalisés à votre site à l'aide de la zone Code Injection (Injection de Code) dans Advanced Settings (Paramètres Avancés).

L’injection de code est une fonctionnalité Premium disponible avec les forfaits Entreprise et Commerce.

Regarder une vidéo

Avant de commencer

  • Si vous ajoutez du code à la zone Injection de Code, nous pourrions vous demander de le désactiver lors de l'édition de votre site. Pour en savoir plus, rendez-vous sur Désactivation des scripts en mode Aperçu.
  • Pour ajouter du code JavaScript à un champ d'Injection de Code, entourez le code avec des tags <script></script>.
  • Nous vous recommandons d’ajouter du code CSS à l’Éditeur CSS Personnalisé et non à un champ d’Injection de Code. Si vous l'ajoutez à un champ d'Injection de Code, entourez le code avec des tags <style></ style>.

Quand utiliser la zone d'Injection de Code

Utilisez l’injection de code pour ajouter du code HTML et des scripts afin d’améliorer certaines parties de votre site. Il peut s’agir par exemple de services de chat en direct, de la vérification de domaine pour des services personnalisés de messagerie électronique ou d’outils d’analyse et de statistiques pour votre site.

La zone d'Injection de Code n'est pas conçue pour ajouter du contenu ou des styles. Pour ajouter du contenu à votre site, rendez-vous sur Créer une page. Pour ajouter du code CSS personnalisé aux styles, utilisez l'Éditeur CSS personnalisé.

Étape 1 - Ouvrir la zone d'Injection de Code

Dans le Menu Principal, cliquez sur Settings (Paramètres), puis sur Advanced (Avancé) et enfin sur Code Injection (Injection de Code).

Étape 2 - Ajouter du code HTML

Ajoutez un code HTML ou des scripts valides dans les champs Injection de code correspondant aux éléments suivants : en-tête, pied de page, page de verrouillage ou page de confirmation.

Le code ajouté ici est injecté dans le tag <head> sur chaque page de votre site.

Screen_Shot_2019-01-16_at_1.01.09_PM.png

Le code ajouté ici est injecté avant le tag de clôture <body> sur chaque page de votre site.

Screen_Shot_2019-01-16_at_1.01.25_PM.png

Remarque : la zone Pied de Page est définie par votre template.

Page de verrouillage

L'écran verrouillé s'affiche lorsqu'une page ou un site est protégé(e) par un mot de passe de site  ou de page.Le code injecté ici s'affiche au-dessus du champ Mot de Passe de l'écran verrouillé.

Bien qu'il soit possible d'ajouter du code dans ce champ, nous vous recommandons d'utiliser plutôt le panneau Écran de verrouillage pour créer votre page de verrouillage. Vous pourrez ainsi notamment ajouter une image d'arrière-plan ou un diaporama, ajuster le style des polices ou incorporer votre logo.

Screen_Shot_2019-01-16_at_1.01.32_PM.png

Page de confirmation de commande

Le code ajouté ici est injecté dans la page de confirmation de commande s'affichant après le paiement d'un client, ce qui constitue une solution bien adaptée pour ajouter des programmes tiers de suivi et d'affiliation à votre boutique.

Six balises vous permettent d'insérer des informations client spécifiques :

  • {orderId} – L'identifiant unique de la commande confirmée
  • {orderSubtotal} – Le sous-total de la commande confirmée
  • {orderSubtotalCents} – Le sous-total de la commande confirmée, en cents
  • {orderGrandTotal} – Le montant global de la commande confirmée
  • {orderGrandTotalCents} – Le montant global de la commande confirmée, en cents
  • {customerEmailAddress} – L'adresse email du client ayant été saisie dans le champ « Informations de Facturation »

Screen_Shot_2019-01-16_at_1.01.40_PM.png

Étape 3 - Enregistrer

Après l'ajout de votre code, cliquez sur Save (Sauvegarder).

5.png

Injection de Code sur une page spécifique

Vous pouvez également injecter du code dans une page spécifique :

  1. Ouvrez la page lorsque vous êtes dans la section Pages.
  2. Survolez la zone de contenu avec votre souris.
  3. Cliquez sur Settings (Paramètres).
  4. Dans la fenêtre Page Settings (Paramètres de Pages), cliquez sur Advanced (Options Avancées) dans le coin supérieur droit.

Page Header Code Injection (Injection de Code dans un En-tête de Page) ajoute du code au tag <head> de cette page. Il ne s'affichera pas sur les pages d'accueil Index.

Dans les Paramètres de la Page Blog, la zone Post Blog Item Code Injection (Injection de code après l'Article de Blog) vous permet d'ajouter du code à chaque article de blog.

  • Cette zone apparaîtra au-dessus ou au dessous du contenu de l'article en fonction de votre template.
  • Dans les modèles qui disposent de la page Blog en grille/empilée, le code s’affiche sur la page de destination du blog et non dans chaque billet.
Remarque : un chargement Ajax peut empêcher du code CSS ajouté à un champ d'Injection de Code de se charger correctement. Ajoutez plutôt du code CSS à l'l’Éditeur CSS.

Screen_Shot_2019-01-16_at_1.02.57_PM.png

Remarque : ajouter ou modifier du code sur votre site constitue une modification avancée. Nous vous recommandons fortement de posséder des connaissances en codage pour utiliser la section d'Injection de Code. Bien que nous ne soyons pas en mesure de vous assister à ce sujet, de nombreuses ressources susceptibles de vous orienter dans la bonne direction sont à votre disposition.

Cet article vous a-t-il été utile ?
Utilisateurs qui ont trouvé cela utile : 111 sur 264
Utilisation de la zone d'Injection de Code