Des outils pour un site professionnel Au service de votre activité
Simple à intégrer • Utile au quotidien • Plus pro pour vos visiteurs
Ajouter un outil Scripts HTML dans WordPress sans vous compliquer la vie
Vous voulez intégrer un outil Scripts HTML dans WordPress ? Cette page vous montre où coller votre code d’intégration HTML selon votre cas : dans une page avec un bloc HTML personnalisé, ou avec un widget HTML si vous utilisez Elementor.
Objectif : coller le code au bon endroit, obtenir un affichage propre, et pouvoir le retirer facilement sans transformer votre site en chantier expérimental.
Ajouter un bloc “HTML personnalisé” dans WordPress (Gutenberg)
Vidéo en français : la méthode la plus simple pour coller un snippet HTML dans une page ou un article WordPress, via l’éditeur Gutenberg (bloc “HTML personnalisé”).
Insérer du code HTML dans une page WordPress (méthode simple)
Vidéo en français : intégrer du HTML dans WordPress pas à pas. Pratique si vous voulez juste coller un code et vérifier le rendu rapidement.
Insérer du code HTML dans Elementor (widget HTML)
Vidéo en français : où trouver le widget HTML, où coller votre snippet, et comment vérifier le rendu sur la page.
Elementor Pro : code global (Header / Footer) — propre et réversible
Vidéo en français : où modifier le Header / Footer avec Elementor Pro, et comment gérer un ajout global propre (sans doublons).
Erreurs fréquentes sur WordPress (et solutions rapides)
Sur WordPress, les soucis viennent souvent du bloc utilisé, d’un code ajouté au mauvais endroit, d’un doublon ou d’un cache qui affiche encore l’ancienne version.
L’outil ne s’affiche pas
Vérifiez que le code d’intégration est bien collé dans un bloc HTML personnalisé avec Gutenberg, ou dans un widget HTML si vous utilisez Elementor. Un bloc Paragraphe, Texte ou Contenu classique ne convient pas pour ce type d’intégration. Pensez aussi à mettre à jour ou publier la page après l’ajout du code.
L’outil s’affiche sur toutes les pages
Le code a probablement été ajouté dans un emplacement global, par exemple dans le header, le footer, le thème ou un outil d’injection de code. Pour cibler une seule page, collez le code uniquement dans la page concernée. Si vous utilisez Elementor Pro avec Custom Code, vérifiez les conditions d’affichage.
L’outil apparaît deux fois
Le code d’intégration est sûrement présent à deux endroits : dans la page et dans un emplacement global, ou dans deux blocs/widgets différents. Gardez une seule version du code à l’emplacement voulu.
Je ne vois pas les modifications
Vérifiez d’abord que la page a bien été mise à jour ou publiée.
Si le changement n’apparaît toujours pas, forcez le rechargement de la page :
sur PC avec Ctrl + F5 ou Ctrl + Maj + R,
sur Mac avec Cmd + Maj + R.
Si vous utilisez un plugin de cache ou d’optimisation WordPress, videz aussi son cache.
Erreurs fréquentes avec Elementor Pro (et solutions rapides)
Si l’outil ne s’affiche pas du premier coup, le problème vient souvent du widget utilisé, d’un code ajouté au mauvais endroit ou d’un affichage différent entre l’éditeur Elementor et la page publiée.
L’outil ne s’affiche pas
Vérifiez que le code d’intégration est bien collé dans un widget HTML. Dans Elementor, un widget Texte ou un bloc de contenu classique ne convient pas pour ce type d’intégration. Après l’ajout du code, mettez la page à jour puis testez le résultat sur la page publiée.
L’outil s’affiche sur plusieurs pages
Le code a peut-être été ajouté via Custom Code ou dans un template global. Dans ce cas, vérifiez les conditions d’affichage Elementor Pro pour limiter l’outil aux pages souhaitées.
L’outil apparaît deux fois
Le code d’intégration est probablement présent à deux endroits : dans un widget HTML et dans un code global, ou dans la page et dans un template. Gardez une seule version du code à l’emplacement voulu.
Rien ne change après modification
Vérifiez que la page a bien été mise à jour dans Elementor.
Si le changement n’apparaît toujours pas, forcez le rechargement de la page :
sur PC avec Ctrl + F5 ou Ctrl + Maj + R,
sur Mac avec Cmd + Maj + R, puis testez à nouveau.
Le rendu est différent entre l’éditeur et le site public
L’éditeur Elementor et la page publique ne sont pas toujours identiques. Pour vérifier le vrai rendu, ouvrez la page publiée depuis son adresse réelle, idéalement dans un autre navigateur ou une fenêtre privée.