Home » Support » Docs » Blocking iframes/embeded content

Blocking iframes/embeded content

Updated on

WP Full Picture’s iframe blocking was designed to work with Gutenberg editor. If your site uses a different one then image placeholder may not display as intended and will require a custom coded CSS fix.

To block the iframe simply add a “shortcode” block with [fp_block settings] before your iframe/embed and add another one with [/fp_block] after your iframe/embed.

Like that:

[fp_block settings] Gutenberg block with an iframe / embedded content [/fp_block]

Next, replace the word “settings” from the first shortcode with one or more elements listed below.

Require specific cookies

Add the codes below to require from the stite visitor to agree to specific types of cookies before the iframe is loaded.

  1. stats="1" – indicates that the content requires consent for statistical cookies
  2. market="1" – require consent for marketing cookies
  3. pers="1" – require consent for personalisation cookies

Show image placeholder until the iframe is loaded

You can display an image placeholder in place of an iframe before it loads. To do this add this code to the first shortcode image="image url".

You can also add a global placeholder (that will be loaded for all iframes) in the plugin settings.

iframe blocking image placeholder setting

And finally, If you use a global placeholder but you don’t want to use any for a particular iframe you can add image="0".

Please note that if you don’t provide any URL and you wrap

shortcode around an embed, then a blank space will be shown on your site where the content should be.

Change aspect ratio

The default aspect ratio of the iframe (and the placeholder) is 16×9! To change it you need to write in the first shortcode width="XXX" and height="YYY".

Load iframes lazily

Add lazy="1" to the first shortcode to load iframes lazily. It will make your site load quicker.

Responsiveness

WP Full Picture makes all iframes responsive so you don’t need to add responsiveness with your own code.

Final code

In the end everything may look like this [fp_block stats="1" lazy="1" width="1920" height="1080"]...

Please, rate this article

Like / Dislike
It's good that you like it. Click the button below to send us this info. Thanks :)