Vous pouvez ajouter du code personnalisé à différents endroits de votre site Web. Toutefois, si votre code provient d'une autre source, assurez-vous de savoir où le placer.
Si votre code doit en partie être inséré dans l'en-tête, consultez les instructions dédiées à l'en-tête dans cet article pour savoir comment faire.
Une fois que vous aurez déterminé où placer votre code, suivez ce tutoriel et consultez les références ci-dessous pour savoir comment l'ajouter à votre site.
Au niveau du site ou sur une page individuelle
En fonction de l'endroit où vous collez votre code, celui-ci apparaîtra soit au niveau du site (et donc sur toutes les pages), soit sur une page individuelle. Ce tutoriel vous indiquera si l'endroit où vous placez votre code modifiera l'ensemble du site ou simplement une page individuelle.
Placer du code à l'aide du widget HTML
Le HTML vous permet de placer facilement du code sur votre site. Pour ce faire, suivez les instructions ci-dessous.
- Ouvrez l'éditeur.
- Dans le panneau de gauche, cliquez sur Widgets.
- Recherchez le widget HTML.
- Faites glisser le HTML n'importe où sur votre site.
- Collez votre code.
- Et voilà !
Widget HTML au niveau du site et sur une page individuelle
En fonction de l'endroit où vous placez votre HTML, celui-ci apparaîtra soit sur toutes les pages de votre site, soit sur une page individuelle.
Si vous placez le HTML dans l'en-tête ou le pied de page, celui-ci apparaîtra simultanément sur toutes les pages du site. En effet, toutes les pages d'un même site partagent le même en-tête et pied de page.
Si vous placez le HTML ailleurs sur la page, celui-ci apparaîtra uniquement dans le corps de page.
Placer du code dans l'en-tête
Les applications de gestion du consentement ne sont pas en mesure d'empêcher l'exécution du code avant le consentement lorsque le code est placé dans l'en-tête HTML. En effet, Duda optimise la structure et l'ordre du chargement du contenu, en fonction des meilleures pratiques en matière de performances sur le site. Nous plaçons les scripts et les bannières CMP plus bas sur la page, afin d'améliorer les performances du contenu principal. C'est pourquoi il est recommandé de placer le code dans le corps du texte lorsqu'on utilise une application de gestion du consentement..
En-tête au niveau du site
Pour placer votre code dans l'en-tête qui apparaît sur tout le site, suivez les instructions ci-dessous.
- Ouvrez l'éditeur.
- Rendez-vous dans Paramètres dans le panneau de gauche.
- Cliquez sur Code HTML de l'en-tête.
- Collez votre code et cliquez sur Enregistrer.
En-tête sur une page individuelle
Pour placer le code dans l'en-tête qui apparaît sur une page individuelle, suivez les instructions ci-dessous.
- Dans le panneau latéral, cliquez sur Pages.
- Sur la page à laquelle vous souhaitez ajouter le code, cliquez sur l'icône des paramètres.
- Cliquez sur SEO.
- Faites défiler la page jusqu'au code HTML de l'en-tête.
- Collez votre code et cliquez sur Enregistrer.
Placer du code après le tag d'ouverture du corps
Pour le moment, aucune fonctionnalité ne permet de placer du code directement après le tag d'ouverture du corps. Vous pouvez toutefois coller un code directement dans le fichier body-end.html. Il existe deux façons de le faire : en mode développeur ou dans les paramètres.
Le mode développeur n'est pas disponible lorsque vous modifiez le site en mode Flex.
Pour coller le code directement dans le fichier body-end.html en mode développeur :
- Cliquez sur l'icône Mode développeur</> dans la barre supérieure.
- Cliquez sur Site HTML/CSS pour développer la sélection.
- Cliquez sur body-end.html.
- Collez votre code dans la dernière ligne.
- Cliquez sur Enregistrer et Terminé.
Pour coller le code directement dans le fichier body-end.html dans les paramètres :
Cliquez sur Paramètres dans le panneau de gauche.
Cliquez sur HTML de l'en-tête.
Collez votre code dans le champ HTML de fin du corps.
Cliquez sur Enregistrer.
Ajouter du code de suivi à un formulaire de contact
Pour ajouter du code de suivi à un formulaire de contact, suivez les instructions ci-dessous.
- Rendez-vous sur la page contenant votre formulaire de contact.
- Cliquez sur le formulaire de contact pour afficher les options.
- Cliquez sur Envoi.
- Cliquez sur Suivi.
- Collez votre code de suivi des conversions.
Ajouter du code à un widget
Pour ajouter du code à un , suivez les instructions ci-dessous.
- Recherchez la page sur laquelle se trouve votre .
- Effectuez un clic droit sur votre pour afficher le menu contextuel.
- Cliquez sur Modifier HTML/CSS.
- Modifiez ou ajoutez du code selon les besoins.
Remarques et dépannage
Toujours créer une sauvegarde
Nous vous recommandons de toujours créer une sauvegarde de votre site avant d'ajouter du code personnalisé. En effet, le code personnalisé est difficile à dépanner et peut interrompre le fonctionnement d'un site s'il n'est pas ajouté correctement.
Mon code disparaît lorsque je le place dans la section <head>
Ce problème survient souvent avec le code de suivi de pixel. En effet, la section <head> n'accepte pas les bouts de code contenant les éléments <head>, <iframe>, etc. Seuls les éléments <link>, <script> et <meta> sont acceptés.
Si votre code ne s'enregistre pas dans cette section, collez-le dans l'en-tête, là où se trouvent vos liens de navigation et vos logos.
Vous pouvez également le coller dans le fichier body-end.html comme l'explique le tutoriel ci-dessus.
Mon code ne fonctionne pas
Si vous avez du code qui ne fonctionne pas sur le site, il est probable que le code en question n'ait pas été correctement formaté ou qu'il ne soit pas compatible avec le HTTPS.
Si votre code inclut des liens (http:// ou //) et que votre site utilise le HTTPS ou que vous êtes dans l'aperçu, vous devrez remplacer ces éléments par https://. En effet, le code non compatible avec le HTTPS ne fonctionnera pas dans le cadre d'une connexion HTTPS (aperçu du site, éditeur, etc.).