Vous collez un code d’intégration, cliquez sur Mettre à jour, et le flipbook a disparu. Cet article explique précisément pourquoi WordPress supprime les iframes, quels rôles, éditeurs et extensions en sont à l’origine, et les correctifs sûrs, étape par étape, pour que votre flipbook s’affiche de nouveau de façon fiable.
Vous collez le code d’intégration de Flipbooks AI dans votre page WordPress, appuyez sur Mettre à jour, et le flipbook a tout simplement disparu. L’éditeur affiche un espace vide, ou le code collé s’est transformé en texte brut, ou une partie a disparu. Rien ne cloche côté flipbook. WordPress fait ce pour quoi il a été conçu : filtrer le HTML auquel il ne fait pas confiance. Une fois que vous savez quel filtre se déclenche, la correction prend généralement cinq minutes.
Cet article passe en revue chaque cause courante, des rôles utilisateurs aux extensions de sécurité, et propose un ordre clair pour les tester. Vous verrez aussi comment choisir une méthode d’intégration qui résiste aux modifications ultérieures, ainsi qu’une liste de contrôle réutilisable sur chaque site client.
WordPress considère tout contenu d’article comme potentiellement hostile. Une iframe charge une page web entière à l’intérieur de la vôtre, ce qui en fait l’une des balises les plus risquées qu’un auteur puisse ajouter. Pour protéger le site, WordPress fait passer le contenu par un assainisseur appelé KSES avant de l’enregistrer dans la base de données. KSES tient une liste de balises et d’attributs autorisés. Tout ce qui n’y figure pas est supprimé silencieusement, sans avertissement ni message d’erreur.
Le point important est que KSES ne s’applique pas à tout le monde. Cela dépend de la personne qui enregistre l’article. C’est pourquoi le même code d’intégration fonctionne sur un site et échoue sur un autre, ou fonctionne pour vous mais échoue pour votre coéquipier.
WordPress accorde la capacité unfiltered_html aux administrateurs et aux éditeurs sur une installation standard à site unique. Les utilisateurs disposant de cette capacité contournent KSES, donc leurs iframes sont enregistrées telles quelles. Les auteurs et les contributeurs ne l’ont pas, donc leurs iframes sont supprimées.
Sur WordPress Multisite, seuls les Super Admins possèdent unfiltered_html. Un administrateur de site ordinaire, dans un réseau, ne l’a pas. Ce seul fait explique une grande part des fils de discussion d’assistance du type « mon iframe disparaît ».
Lorsque le filtre s’exécute, il fait l’une de trois choses :
allowfullscreen, style ou sandbox, de sorte que le flipbook se charge mais paraît cassé.💡 Vérifiez le résultat enregistré en passant l’éditeur en affichage code. Ce que vous y voyez est ce que la base de données a conservé, et non ce que vous avez collé.
Avant de modifier quoi que ce soit, associez votre symptôme à la cause probable. Cela vous évite de cliquer au hasard.
| Symptôme | Cause la plus probable | Premier correctif à essayer |
|---|---|---|
| L’iframe disparaît après l’enregistrement | Votre rôle n’a pas unfiltered_html | Se connecter en tant qu’administrateur |
| Fonctionne pour l’admin, échoue pour l’auteur | Filtrage KSES pour les rôles inférieurs | Utiliser un shortcode ou un bloc |
| L’iframe s’affiche comme texte brut | Collée dans un paragraphe ou un onglet visuel | Utiliser un bloc HTML personnalisé |
| Le flipbook se charge sans plein écran | Attributs supprimés | Rajouter allowfullscreen en affichage code |
| Boîte vide sur la page en ligne uniquement | Extension de sécurité ou en-tête CSP | Vérifier les réglages de l’extension et de l’en-tête |
| Échoue seulement sur Multisite | Pas un Super Admin | Demander à l’administrateur du réseau |
L’erreur la plus fréquente consiste à coller une iframe dans un bloc Paragraphe classique. Gutenberg traite alors le code comme du texte à mettre en forme. Le bon conteneur est le bloc HTML personnalisé.
⚠️ Si la page reste vide après l’enregistrement, votre rôle est probablement filtré. Passez au correctif 2.
Si votre site utilise l’éditeur classique, passez de l’onglet Visuel à l’onglet Texte avant de coller le code. L’onglet Visuel utilise TinyMCE, qui réécrit ou supprime les balises qu’il ne reconnaît pas. Collez dans l’onglet Texte, enregistrez, et évitez ensuite de repasser à Visuel, car ce changement peut à nouveau effacer le code.
Si l’iframe disparaît pour certaines personnes et non pour d’autres, comparez leurs rôles. Voici ce que chaque rôle par défaut peut faire.
| Rôle | Possède unfiltered_html (site unique) | Possède unfiltered_html (Multisite) | L’iframe survit ? |
|---|---|---|---|
| Administrateur | Oui | Non | Site unique : oui |
| Éditeur | Oui | Non | Site unique : oui |
| Auteur | Non | Non | Généralement supprimée |
| Contributeur | Non | Non | Supprimée |
| Super Admin | Sans objet | Oui | Oui |
La solution la plus simple consiste à demander à un administrateur d’ajouter l’intégration une fois, puis à laisser les auteurs modifier le texte autour. L’iframe enregistrée reste intacte tant que personne ne modifie ce bloc précis avec un compte filtré.
💡 Ne donnez jamais l’accès administrateur uniquement pour réparer une intégration. Utilisez plutôt une option plus sûre, présentée dans les sections suivantes.
Les shortcodes sont la réponse la plus propre pour les équipes. Un shortcode est un court texte, tel que [flipbook id="123"], que WordPress développe en code HTML complet au chargement de la page. Comme ce HTML est généré côté serveur, KSES ne voit jamais la balise iframe dans le contenu enregistré.
Ajoutez ceci au fichier functions.php de votre thème enfant ou, mieux, dans une petite extension personnalisée :
add_shortcode( 'flipbook', function ( $atts ) {
$atts = shortcode_atts( array(
'url' => '',
'height' => '600',
), $atts );
if ( empty( $atts['url'] ) ) {
return '';
}
$url = esc_url( $atts['url'] );
$height = intval( $atts['height'] );
return '<iframe src="' . $url . '" width="100%" height="' . $height . '" frameborder="0" allowfullscreen loading="lazy"></iframe>';
} );
Désormais, n’importe quel auteur peut saisir [flipbook url="https://your-flipbook-link" height="650"] et l’iframe apparaît sur la page en ligne. Le code échappe l’URL, vous conservez ainsi la protection voulue par WordPress.
Si vous devez absolument conserver des iframes brutes dans le contenu pour les rôles inférieurs, vous pouvez étendre la liste des balises autorisées. Il s’agit d’une exception ciblée, et non d’une suppression complète du filtre.
add_filter( 'wp_kses_allowed_html', function ( $tags, $context ) {
if ( 'post' === $context ) {
$tags['iframe'] = array(
'src' => true,
'width' => true,
'height' => true,
'frameborder' => true,
'allowfullscreen' => true,
'loading' => true,
'title' => true,
);
}
return $tags;
}, 10, 2 );
⚠️ Cela permet à chaque rôle disposant du droit de modifier les articles d’insérer n’importe quelle iframe provenant de n’importe quel domaine. Sur un site avec de nombreux auteurs, limitez-le en vérifiant l’hôte
srcou privilégiez l’approche par shortcode.
Si vous ne pouvez pas modifier le code, une extension qui fournit un bloc ou un shortcode iframe avec une liste de domaines autorisés fait le même travail, avec un écran de réglages.
Parfois, l’iframe est enregistrée parfaitement et ne s’affiche tout de même pas. Le problème vient alors du navigateur, et non de l’éditeur.
Les extensions de pare-feu et de renforcement peuvent supprimer ou bloquer les iframes d’elles-mêmes. Les déclencheurs courants sont :
Désactivez une extension à la fois, videz le cache et testez de nouveau. Si le flipbook réapparaît, ouvrez les réglages de cette extension et ajoutez le domaine du flipbook à la liste blanche.
Un en-tête Content-Security-Policy avec une règle frame-src ou default-src indique aux navigateurs quels domaines peuvent apparaître dans des cadres. Si le domaine de votre flipbook n’y figure pas, le navigateur affiche une boîte vide alors que le HTML est correct. Ouvrez la console de développement du navigateur et recherchez un message qui mentionne « Refused to frame ». Ajoutez le domaine du flipbook à la règle frame-src sur votre serveur ou dans votre extension de sécurité.
| Où se produit le blocage | Comment le repérer | Où le corriger |
|---|---|---|
| Filtre KSES de WordPress | Balise absente en affichage code | Rôle, shortcode ou filtre |
| Éditeur (TinyMCE) | Le code change après un changement d’onglet | Utiliser l’onglet Texte ou le bloc HTML personnalisé |
| Extension de sécurité | Balise enregistrée mais vide sur la page | Liste blanche de l’extension |
| En-tête CSP | La console indique Refused to frame | En-tête du serveur ou de l’extension |
| Couche de cache | Ancienne page après modification | Purger le cache |
Tous les cas ne nécessitent pas une iframe. Elementor, Divi, Beaver Builder et d’autres constructeurs proposent un widget HTML ou Intégration qui gère le code brut sans KSES, car le constructeur enregistre le contenu dans son propre format. Si votre site en utilise déjà un, placez le flipbook dans ce widget.
Pour une solution rapide, reliez un bouton ou une image de couverture bien présentée directement à l’URL publique du flipbook. Les lecteurs profitent de l’expérience complète de la page, et vous évitez tous les filtres mentionnés plus haut.
Voici la procédure complète, du PDF à la page en ligne. Elle prend environ dix minutes la première fois.
Les flipbooks n’ont aucun filigrane, s’adaptent à tous les écrans et proposent une personnalisation de la marque sur chaque offre. Les statistiques, la génération de prospects et les téléchargements hors ligne font partie de l’offre Professional. Consultez donc les tarifs si vous en avez besoin.
| Méthode | Compétence requise | Résiste aux changements de rôle | Idéal pour |
|---|---|---|---|
| Bloc HTML personnalisé | Faible | Non | Pages isolées créées par des administrateurs |
| Shortcode | Moyenne | Oui | Équipes et nombreuses pages |
| Filtre KSES | Moyenne | Oui | Sites avec des auteurs de confiance |
| Widget de constructeur de pages | Faible | Généralement | Sites Elementor ou Divi |
| Bouton à lien direct | Aucune | Oui | Option rapide et à l’abri des filtres |
Un restaurant publie sa carte sous forme de flipbook avec le Créateur de flipbook de carte de restaurant. Le propriétaire est éditeur, donc un bloc HTML personnalisé convient. L’assistante marketing à temps partiel est auteure ; elle utilise donc le shortcode lorsqu’elle met à jour les pages de saison.
Une agence immobilière publie ses biens avec le Créateur de brochures immobilières. Les agents sont auteurs sur le site de l’entreprise, et leurs iframes ne cessaient de disparaître. Le passage à un shortcode commun a réglé le problème pour toute l’équipe.
Une équipe marketing sur Multisite a constaté que même les administrateurs de site perdaient leurs intégrations. L’administrateur du réseau a ajouté une autorisation d’iframe filtrée, limitée au domaine du flipbook, et le problème a cessé.
Une fois l’iframe stable, consacrez deux minutes à la présentation.
✅ Testez sur un vrai téléphone. La plupart des lecteurs ouvriront votre flipbook sur mobile, et une largeur fixe en pixels peut provoquer un défilement horizontal.
Conservez une version en texte brut de votre code d’intégration dans un endroit sûr. Si un filtre endommage la version enregistrée, vous pourrez la recoller en quelques secondes.
Parcourez cette liste à chaque fois :
Une iframe qui disparaît relève presque toujours d’un problème d’autorisations, et non d’un problème de flipbook. Vérifiez le type de bloc, puis le rôle de l’utilisateur, puis les extensions et les en-têtes, dans cet ordre.
Prêt à transformer votre prochain PDF en publication propre et intégrable ? Commencez gratuitement sur Flipbooks AI, parcourez tous les outils pour flipbooks pour trouver le modèle adapté, ou comparez les offres et tarifs pour choisir les fonctionnalités dont votre site a besoin.
Choisissez votre langue
