Copier-coller ou import JSON : deux façons d’intégrer du HTML dans Elementor

Le convertisseur vous propose deux voies d’export. Elles produisent exactement les mêmes composants — la différence tient entièrement à la méthode de travail, à la portabilité et à ce que vous comptez faire du résultat ensuite.

Option A — Coller les données Elementor

Cliquez sur Copier les données Elementor, ouvrez la page cible dans Elementor, faites un clic droit sur une zone vide du canevas et choisissez « Coller depuis un autre site ». Les composants s’insèrent directement dans votre mise en page, à l’endroit où vous avez cliqué.

En coulisses, cela place dans votre presse-papiers des données JSON au format qu’utilise le copier-coller d’Elementor lui-même. C’est pourquoi il vous faut la variante « depuis un autre site » : le collage classique attend du contenu copié au sein de la même installation, alors que celle-ci accepte des données provenant d’ailleurs.

• Idéal pour : les insertions rapides, sur place — ajouter une section convertie dans une page que vous êtes déjà en train de modifier.
• Nécessite : l’éditeur Elementor ouvert sur le site cible, et l’accès au presse-papiers dans votre navigateur.
• Point de vigilance : les autorisations du presse-papiers. Certains navigateurs et certaines extensions de confidentialité bloquent l’écriture programmatique dans le presse-papiers ; si la copie échoue sans message, passez plutôt par le JSON.

Option B — Télécharger un modèle JSON

Cliquez sur Télécharger le modèle .json, puis, dans Elementor, ouvrez Modèles → Modèles enregistrés et choisissez Importer des modèles. Le résultat arrive sous forme de modèle que vous pouvez insérer sur n’importe quelle page, sur tout site où vous importez le fichier.

• Idéal pour : les pages entières, la réutilisation sur plusieurs sites, la transmission du travail à un collègue ou la conservation de versions dans votre propre espace de stockage.
• Nécessite : l’accès à la bibliothèque de modèles sur le site de destination.
• En bonus : le fichier est du JSON brut. Vous pouvez le placer sous contrôle de version, comparer deux exports ou archiver un design tel qu’il existait à une date donnée.

Lequel choisir ?

Une règle simple : collez pour les insertions ponctuelles, téléchargez pour tout ce que vous utiliserez plus d’une fois.

Vous récupérez une seule carte, une section hero ou une rangée de tarifs à déposer dans la page que vous construisez en ce moment ? Collez — deux clics et c’est fait. Vous migrez une page d’atterrissage complète, ou vous commencez à constituer une bibliothèque de blocs réutilisables dans laquelle vous puiserez pour vos futurs projets ? Téléchargez le JSON, donnez au fichier un nom explicite et rangez-le là où vous le retrouverez.

Il y a un troisième critère si vous travaillez avec des clients ou des collègues : un fichier JSON, cela s’envoie. Le contenu d’un presse-papiers, non.

Délimitez d’abord votre export

Quelle que soit la voie choisie, définissez la portée avant d’exporter. Dans la Carte de structure, l’icône de cible sur une ligne en fait la racine de copie, de sorte que seule cette sous-arborescence est exportée — c’est ainsi que vous évitez d’embarquer les conteneurs englobants extérieurs de la page, l’en-tête et le pied de page avec la section que vous vouliez réellement. L’icône en forme de croix exclut des lignes individuelles.

Bien régler ce point compte davantage pour la voie du collage, car les données collées atterrissent là où vous avez fait un clic droit, et une sélection trop large est pénible à défaire ensuite.

Quand le collage ne fonctionne pas

« J’ai collé et rien ne s’est passé » s’explique par une courte liste de causes, à peu près par ordre de probabilité :

• Mauvaise entrée de menu. La commande Coller classique attend du contenu copié au sein de la même installation. Les données converties exigent Coller depuis un autre site — même menu contextuel, une entrée plus bas. C’est la cause la plus fréquente, plus que toutes les autres réunies.
• L’écriture dans le presse-papiers a été bloquée. Certains navigateurs et extensions de confidentialité refusent l’accès programmatique au presse-papiers. Le convertisseur vous le signale quand cela se produit au lieu d’échouer sans rien dire — et le téléchargement JSON n’a aucunement besoin du presse-papiers ; c’est donc la solution de repli fiable.
• Quelque chose a écrasé le presse-papiers entre-temps. Copier quoi que ce soit d’autre — une URL, une capture d’écran — entre le clic sur Copier et le collage remplace les données. Recopiez et collez immédiatement.
• Le presse-papiers contient du code source, pas une page. Ce cas piège les personnes qui viennent de générateurs d’applications IA comme Lovable, v0 ou Bolt : ces outils produisent des projets React et JSX, et le code source de composants JSX n’est pas du HTML — le coller ici ne donne rien d’utile. Ce que lit le convertisseur, c’est la page rendue. Ouvrez l’aperçu de l’outil dans un navigateur, récupérez-y le HTML de la page, et il se convertit comme n’importe quelle autre page.

Après l’import

Les deux voies demandent la même courte passe de finition :

• Reliez à nouveau les boutons. Si vous avez exporté un bloc intérieur, un lien englobant a pu rester à l’extérieur, si bien qu’un bouton peut arriver sans son lien.
• Définissez les états de survol des boutons et des liens — ils ne peuvent pas être lus depuis une page statique et sont le signe le plus visible d’un import inachevé.
• Reliez les widgets Menu de navigation et Formulaire à de vraies sources WordPress. Un menu doit utiliser l’un de vos menus ; un formulaire doit avoir ses actions configurées sur votre site. Ni l’un ni l’autre ne peut être transféré.
• Remplissez les emplacements d’image, en vous aidant de la légende de chaque emplacement pour savoir quelle image va où.
• Vérifiez les trois vues d’appareil avant de considérer la page comme terminée.

Une remarque sur les versions d’Elementor

Le contenu collé ou importé est interprété par la version d’Elementor du site de destination. Si vous exportez depuis un site et importez dans un autre qui tourne sous une version plus ancienne, certains réglages récents de conteneur ou de grille risquent de ne pas être compris. Maintenir Elementor à jour sur le site de destination vous évite toute une catégorie de problèmes déroutants du type « pourtant, c’était correct quand je l’ai exporté ».