iframe height not working on wordpress page

i’m having a problem with wordpress and iFrame.

I’m trying to frame an application and the height isn’t working. I change the height yet it stays the same height and I cannot figure it out. I’ve tried numerous plugins, but will not help either.

Read More

The width works fine, but the heigh is just staying small, you have to scroll which bothers me and potential clients as well.

It worked on my old wordpress theme, but now i’m using a new one called Mana.

Sadly, I don’t have enough reputation points to post a picture to show you. I cannot fix this for the life of me. Its with any application really. Videos work fine though. I’ve been trying to solve this for weeks. I’ve had no luck with anything, any help will be appreciated. The iFrame code is below as well. Also, the width works fine, its just the height. I’m pretty sure its the theme, but theres really no support for it so this is my last resort.

<iframe src="http://www.example.com/application" height="2000" width="750" frameborder="0"></iframe>

Related posts

Leave a Reply

3 comments

  1. You can try this, as shown below. I am using an !important on height.

    <iframe src="http://www.example.com/application" style="width:750px; height:2000px !important;" frameborder="0"></iframe>
    
  2. WordPress enforces a minimum and maximum height protection on iframe tags in the wp-includes/js/wp-embed.js file. The minimum and maximum height specified are respectively 200px and 1000px.

    A modification to the iframe CSS or height property will not affect the height as it will be overwritten automatically.

    This is enforced in the following code snippet (wp-includes/js/wp-embed.js) :

    /* Resize the iframe on request. */
    if ( 'height' === data.message ) {
        height = parseInt( data.value, 10 );
    
        if ( height > 1000 ) {
            height = 1000;
        } else if ( ~~height < 200 ) {
            height = 200;
        }
    
        source.height = height;
    }
    

    I wrote an article including the JavaScript solution to bypass wordpress iframe height limit

    https://medium.com/@wlarch/overwrite-and-bypass-wordpress-iframe-height-dimension-limit-using-javascript-9d5035c89e37

  3. What happens if you do like this?

    <iframe src="http://www.example.com/application" style="height:2000px; width:750px;" frameborder="0"></iframe>