2

I have this iframe and JavaScript embedded in a post:

<iframe onload="fa_iframeresize.do(this);" src="https://example.com/calc.php?tp=dif&cl=beleggen&h=1&wf=19370&country=NL" scrolling="no" width="100%" style="padding:0px;margin:0px;border-width:0px;" frameborder="0">
</iframe>
<script type="text/javascript" src="//example.com/iframeResizeMe.min.js.gz"></script>

But whenever I go to the visual editor the HTML gets changed tiny bit in such a way that example.com's code can't handle it anymore:

<iframe style="padding: 0px; margin: 0px; border-width: 0px;" src="https://example.com/calc.php?tp=dif&amp;cl=beleggen&amp;h=1&amp;wf=19370&amp;country=NL" width="100%" frameborder="0" scrolling="no">
</iframe>
<script type="text/javascript" src="//example.com/iframeResizeMe.min.js.gz"></script>

Is there a way to keep the visual editor from changing a chunk HTML?

I tried the iframe extension but that didn't really handle it properly. I'd also like to avoid creating my own plugin for this.

Ideally I'd like e.g. <!-- NOREFORMAT --><iframe></iframe><script></script><!-- /NOREFORMAT -->.

  • 2
    Note that the only reason you're able to insert a raw iframe at all is because you're an administrator with the dangerous unfiltered_html capability. Use an iframe shortcode instead, and then enqueue a script that hooks on to the onLoad of all iframes instead of adding dangerous inline JS script attributes – Tom J Nowell Sep 18 '18 at 13:15
  • It is possible to allow iframe tag for the tinyMCE editor, see wordpress.stackexchange.com/a/3067/170 However I think you should create a plugin that add a shortcode to add this inside the content. SO you get a more valid content, easier to maintain if you will change this code or remove them from the content in the future. – bueltge Dec 12 '18 at 12:55
  • visit link see..wordpress.stackexchange.com/questions/243780/… – Ashvin Monpara Dec 14 '18 at 4:37
1
+50
    add_shortcode('custom_iframe_shortcode', 'build_iframe');
function build_iframe($atts) {
    $defaults = array(
        'source' => 'https://example.com/calc.php?tp=dif&cl=beleggen&h=1&wf=19370&country=NL',
        'script_source' => '//example.com/iframeResizeMe.min.js.gz'
    );
    $args = shortcode_atts($defaults, $atts);

    ob_start(); ?>
    <iframe onload="fa_iframeresize.do(this);" src="<?php echo $args['source']; ?>" scrolling="no" width="100%" style="padding:0px;margin:0px;border-width:0px;" frameborder="0">
    </iframe>
    <script type="text/javascript" src="<?php echo $args['script_source']; ?>"></script>
    <?php return ob_get_clean();
}

then call this like [build_iframe] or [build_iframe source="https://blah" script_source="https://blah/blah.js']

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.