troubleshootingflipbookonline toolstips

Why WordPress Strips Your Flipbook Iframe and How to Fix It

You paste an embed code, hit Update, and the flipbook is gone. This article explains exactly why WordPress strips iframes, which roles, editors and plugins cause it, and the safe, step-by-step fixes that make your flipbook display reliably again.

Why WordPress Strips Your Flipbook Iframe and How to Fix It
Cristian Da Conceicao
Founder of Flipbooks AI

You paste the embed code from Flipbooks AI into your WordPress page, press Update, and the flipbook is simply gone. The editor shows a blank gap, or the code you pasted has turned into plain text, or half of it has vanished. Nothing is broken on the flipbook side. WordPress is doing what it was designed to do: filtering HTML it does not trust. Once you know which filter is firing, the fix usually takes five minutes.

This article walks through every common cause, from user roles to security plugins, and gives you a clear order in which to test them. You will also see how to pick an embed method that survives future edits, plus a checklist you can reuse on every client site.

Why WordPress Removes Iframes

WordPress treats any post content as potentially hostile. An iframe loads a whole other web page inside yours, so it is one of the riskiest tags an author can add. To protect the site, WordPress runs content through a sanitizer called KSES before saving it to the database. KSES keeps a list of allowed tags and attributes. Anything outside the list is deleted silently, with no warning and no error message.

Designer looking at a blank embed block in the page editor

The important detail is that KSES does not run for everyone. It depends on who is saving the post. That is why the same embed code works on one site and fails on another, or works for you but fails for your teammate.

The unfiltered_html Capability

WordPress gives the unfiltered_html capability to Administrators and Editors on a normal single site installation. Users with that capability skip KSES, so their iframes are saved untouched. Authors and Contributors do not have it, so their iframes are stripped.

On WordPress Multisite, only Super Admins have unfiltered_html. A regular site Administrator on a network does not. This single fact explains a huge share of "my iframe disappears" support threads.

What the Sanitizer Actually Does

When the filter runs, it does one of three things:

  • Deletes the whole iframe tag, leaving an empty paragraph.
  • Removes specific attributes such as allowfullscreen, style or sandbox, so the flipbook loads but looks broken.
  • Escapes the tag so it displays as visible text on the page.

💡 Check the saved result by switching the editor to the code view. What you see there is what the database kept, not what you pasted.

Quick Diagnosis Table

Before changing anything, match your symptom to the likely cause. This saves a lot of random clicking.

SymptomMost Likely CauseFirst Fix to Try
Iframe vanishes after savingYour role lacks unfiltered_htmlLog in as Administrator
Works for admin, fails for authorKSES filtering for lower rolesUse a shortcode or block
Iframe shows as plain textPasted into a Paragraph or visual tabUse a Custom HTML block
Flipbook loads but no fullscreenAttributes strippedRe-add allowfullscreen in code view
Blank box on the live page onlySecurity plugin or CSP headerCheck plugin and header settings
Fails only on MultisiteNot a Super AdminAsk the network admin

Fix 1: Use a Custom HTML Block

The most common mistake is pasting an iframe into a regular Paragraph block. Gutenberg then treats the code as text to format. The correct container is the Custom HTML block.

Developer reviewing the WordPress admin settings on a large monitor

  1. Open the page in the block editor.
  2. Click the plus icon and search for Custom HTML.
  3. Paste the full embed code from your flipbook.
  4. Click Preview inside the block to confirm it renders.
  5. Update the page and view it in a private browser window.

⚠️ If the page still shows nothing after saving, your role is probably being filtered. Move on to Fix 2.

Classic Editor Users

If your site uses the Classic Editor, switch from the Visual tab to the Text tab before pasting. The Visual tab runs TinyMCE, which rewrites or removes tags it does not recognize. Paste in the Text tab, save, and avoid switching back to Visual afterwards, because that switch can strip the code again.

Fix 2: Check the User Role

If the iframe disappears for some people and not for others, compare their roles. Here is what each default role can do.

RoleHas unfiltered_html (Single Site)Has unfiltered_html (Multisite)Iframe Survives?
AdministratorYesNoSingle site: yes
EditorYesNoSingle site: yes
AuthorNoNoUsually stripped
ContributorNoNoStripped
Super AdminNot applicableYesYes

The simplest solution is to have an Administrator add the embed once, then let the Authors edit the surrounding text. The saved iframe stays intact as long as nobody edits that specific block with a filtered account.

💡 Never hand out Administrator access just to fix an embed. Use a safer option from the next sections instead.

Fix 3: Wrap the Embed in a Shortcode

Shortcodes are the cleanest answer for teams. A shortcode is a short piece of text such as [flipbook id="123"] that WordPress expands into full HTML when the page loads. Because the HTML is generated on the server, KSES never sees the iframe tag in the saved content.

Designer sketching a page with an embedded box on a desk

Add this to your child theme's functions.php file or, better, to a small custom plugin:

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>';
} );

Now any author can type [flipbook url="https://your-flipbook-link" height="650"] and the iframe appears on the live page. The code escapes the URL, so you keep the safety WordPress intended.

Why This Beats Raw HTML

  • Role independent: every user, even Contributors, can place it.
  • Central control: change the iframe attributes once and every page updates.
  • Safer: the output is built from sanitized values.
  • Cleaner content: the editor shows one short line instead of a long code block.

Fix 4: Allow Iframes with a Code Filter

If you must keep raw iframes in post content for lower roles, you can extend the allowed tag list. This is a targeted exception, not a full removal of the filter.

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 );

⚠️ This lets every role with post editing rights insert any iframe from any domain. On a site with many authors, restrict it by checking the src host or prefer the shortcode approach.

If you cannot edit code, a plugin that provides an iframe block or shortcode with a domain allowlist does the same job with a settings screen.

Fix 5: Look at Security Plugins and Headers

Sometimes the iframe is saved perfectly and still does not show. That points to the browser, not the editor.

Business owner checking her website menu page on a tablet

Security and Optimization Plugins

Firewall and hardening plugins can strip or block iframes on their own. Common triggers include:

  • Content filtering or "sanitize post content" options.
  • Lazy load or minify features that rewrite iframe attributes.
  • Cache plugins serving an older version of the page.

Disable one plugin at a time, clear the cache, and test again. If the flipbook returns, open that plugin's settings and whitelist the flipbook domain.

Content Security Policy Headers

A Content-Security-Policy header with a frame-src or default-src rule tells browsers which domains may appear in frames. If your flipbook domain is not listed, the browser shows a blank box even though the HTML is fine. Open the browser developer console and look for a message that mentions "Refused to frame". Add the flipbook domain to the frame-src rule on your server or security plugin.

Where the Block HappensHow to Spot ItWhere to Fix It
WordPress KSESTag missing in code viewRole, shortcode or filter
Editor (TinyMCE)Code changes after tab switchUse Text tab or Custom HTML
Security pluginTag saved but blank on pagePlugin whitelist
CSP headerConsole says Refused to frameServer or plugin header
Cache layerOld page after editPurge cache

Not every case needs an iframe. Elementor, Divi, Beaver Builder and similar builders include an HTML or Embed widget that handles raw code without KSES, because the builder stores the content in its own format. If your site already uses one, drop the flipbook into that widget.

For a quick alternative, link a good-looking button or cover image straight to the flipbook's public URL. Readers get the full page experience and you avoid every filter mentioned above.

Woman editing a website page from a cafe table

How to Embed a Flipbook the Right Way

Here is the full process, from PDF to a live page. It takes about ten minutes the first time.

  1. Create your account at Flipbooks AI.
  2. Upload your PDF with the PDF to Flipbook Converter. Pages are converted automatically and keep their quality.
  3. Customize the look: add your logo, pick colors, choose the page turn effect, and add video or audio where useful.
  4. Set sharing options: enable a password if the content is private, or keep it public for marketing material.
  5. Copy the embed code from the share menu. The Embed Flipbook on Website tool explains the options.
  6. Paste it into a Custom HTML block or your shortcode, then update the page.
  7. Test on mobile and desktop in a private window.

Flipbooks have no watermarks, are mobile responsive, and support custom branding on every plan. Analytics, lead generation and offline downloads are part of the Professional plan, so check pricing if you need them.

Embed Methods Compared

MethodSkill NeededSurvives Role ChangesBest For
Custom HTML blockLowNoSingle pages by admins
ShortcodeMediumYesTeams and many pages
KSES filterMediumYesSites with trusted authors
Page builder widgetLowUsuallyElementor or Divi sites
Direct link buttonNoneYesQuick, filter-proof option

Real Examples

A restaurant adds its menu as a flipbook using the Restaurant Menu Creator. The owner is an Editor, so a Custom HTML block works. The part-time marketing assistant is an Author, so she uses the shortcode when updating seasonal pages.

Real estate agent reviewing a brochure next to her agency website

A real estate agency publishes listings with the Real Estate Brochure Creator. Agents are Authors on the company site, and their iframes kept disappearing. Moving to one shared shortcode solved it for the whole team.

A marketing team on Multisite found that even site Administrators lost their embeds. The network admin added a filtered iframe allowance restricted to the flipbook domain, and the problem stopped.

Make Your Embed Look Good

Once the iframe stays put, spend two minutes on presentation.

  • Set a sensible height: 600 to 800 pixels works for most page layouts.
  • Use 100% width so the flipbook fills the content column.
  • Add loading="lazy" so the page loads faster.
  • Keep allowfullscreen so readers can expand the flipbook.
  • Add a descriptive title attribute for accessibility.

Hands holding a phone showing a magazine style publication on a web page

✅ Test on a real phone. Most readers will open your flipbook on mobile, and a fixed pixel width can cause sideways scrolling.

5 Mistakes That Bring It Back

  1. Switching between Visual and Text tabs after pasting in the Classic Editor.
  2. Letting an Author edit a block that contains a raw iframe.
  3. Using a page builder import that resets the content.
  4. Forgetting to purge cache after changes.
  5. Pasting a code snippet with curly quotes copied from a document, which breaks the attributes.

Keep a plain text version of your embed code in a safe place. If a filter damages the saved version, you can paste it again in seconds.

Final Checklist Before You Publish

Run through this list every time:

  • The page uses a Custom HTML block, shortcode or builder widget.
  • The code view shows the iframe, not an empty block.
  • The live page loads the flipbook in a private window.
  • The browser console shows no frame errors.
  • Cache is purged and mobile layout is tested.

Developer celebrating a flipbook displaying correctly on a finished page

Ready to Publish Your Flipbook?

A disappearing iframe is almost always a permissions issue, not a flipbook issue. Check the block type, check the user role, then check plugins and headers, in that order.

Ready to turn your next PDF into a clean, embeddable publication? Get started for free on Flipbooks AI, browse all flipbook tools to find the right template, or compare pricing plans to pick the features your site needs.

Share this article