Iframe in WP page - need help

by bwh1
19 replies
  • WEB DESIGN
  • |
Hey Warriors

I try to include a 600px x 400px Iframe into my WP page.

Tried 2 plugins (advanced Iframe and another) which don't work at all.

I tried the common HTML code

<iframe src="http://qbuniversity.org" width="600px" height="400px">...</iframe>
but all I get is a tiny iframe thumb.

What am I doing wrong here?

G.
#iframe #page
  • Profile picture of the author 3Knikkers
    The problem here is that WordPress tries to parse coding and tags. As a result, "<iframe src='yadda yadda' etc.></iframe> " is converted to "<iframe src='yadda yadda' etc. />" and the rest of the page doesn't load properly. The fix seems to be to turn off 'rich text editing' and insert: "< br /></iframe>"


    Or you can use the Shortcode Generator Plugin
    Signature

    A responsive web is a better web

    {{ DiscussionBoard.errors[7185902].message }}
  • Profile picture of the author Huy Phan
    Did you try to enter the codes via HTML editor on the page/post where you're trying to insert the iframe code?

    Also, on another note, i would strongly suggest you avoid using iframe, because in web design it's a very out-of-date-technique.
    {{ DiscussionBoard.errors[7186202].message }}
  • Profile picture of the author Mr Bill
    I use iFrames on my wordpress site to display a custom iPhone simulator. iFrames have their uses and that is one of them. I also use the Youtube iframe code to display youtube clips. In fact I even have an iframe inside an iframe and it works fine.

    You need this plug in --> Iframe and your iframes will work fine on any wordpress blog.
    {{ DiscussionBoard.errors[7189749].message }}
  • Profile picture of the author bagedi
    Originally Posted by bwh1 View Post

    Hey Warriors

    I try to include a 600px x 400px Iframe into my WP page.

    Tried 2 plugins (advanced Iframe and another) which don't work at all.

    I tried the common HTML code



    but all I get is a tiny iframe thumb.

    What am I doing wrong here?

    G.
    <iframe name="iframe_a" src="YourDomainName.com" frameborder="0" width="960" height="1400"></iframe> try that ... for me that work i frame many links in this way they look like my pages load fast and the link is http://MyDomain.com
    Signature
    Get paid to generate leads and put new distributors into your business. Become the hunted instead of the hunter.Free Video Series! Build your business even if you are on a tight budget. Get tons of traffic.
    {{ DiscussionBoard.errors[7199660].message }}
  • Profile picture of the author Mr Bill
    I've provided the solution above. Wordpress handles iframes differently and you need that plug in I linked to.
    {{ DiscussionBoard.errors[7200497].message }}
    • Profile picture of the author bwh1
      Originally Posted by Mr Bill View Post

      I've provided the solution above. Wordpress handles iframes differently and you need that plug in I linked to.
      Hi Bill

      well thank you in first place for the help.

      I've tried that plugin before I posted here without success and did now another upload to try it out with the same result.

      All I get is a thumbnail version of the Iframe, it doesn't recon my spec of the size.

      Have to say that the page is a DRAFT in my WP site, don't know if that makes a difference as I preview the site only, as it's not published.


      G.
      Signature

      Affiliates Wanted! Make anywhere from 42,- to $72 in commissions. Simply Recommend the Best QuickBooks Pro Video Course available at Clickbank.

      {{ DiscussionBoard.errors[7200928].message }}
  • Profile picture of the author Mr Bill
    What is the exact iframe code you are using? Paste it here. Are you using < > tag ends or []?
    {{ DiscussionBoard.errors[7200937].message }}
    • Profile picture of the author bwh1
      Originally Posted by Mr Bill View Post

      What is the exact iframe code you are using? Paste it here. Are you using < > tag ends or []?
      I used both, the <> as a HTML code and after I uploaded the plugin as shortcode using the [] tags.

      By the way, I found an plugin "Advanced IFrame" which gives greater customization features.

      BOTH do work and showing an Iframe with the page I want, but only in a size some like 20x20 px. I even can scroll that so had the chance to check what it displays.

      So right now, the problem is that the IFrame doesn't recon my

      width="600" height ="400" tag.

      I tried using it this way and once adding px after the size, and I tried width="100%" just to see if it changes some - same result.

      I use PROFIT THEME in this case, maybe that has some to do with it?

      G.
      Signature

      Affiliates Wanted! Make anywhere from 42,- to $72 in commissions. Simply Recommend the Best QuickBooks Pro Video Course available at Clickbank.

      {{ DiscussionBoard.errors[7204202].message }}
  • Profile picture of the author Mr Bill
    Ok, try styling the dimensions. Like this...

    [iframe name="frame" id="frame" style="height: 489px; width: 327px;" src="insertyourURLhere" frameborder="0" marginwidth="0" scrolling="no" align="middle"]

    This is exactly what is working on my page here
    {{ DiscussionBoard.errors[7205120].message }}
    • Profile picture of the author bwh1
      Originally Posted by Mr Bill View Post

      Ok, try styling the dimensions. Like this...

      [iframe name="frame" id="frame" style="height: 489px; width: 327px;" src="insertyourURLhere" frameborder="0" marginwidth="0" scrolling="no" align="middle"]

      This is exactly what is working on my page here
      UR D' Man Bill

      That WORKED exactly as supposed, great man.

      Many thanks

      G.
      Signature

      Affiliates Wanted! Make anywhere from 42,- to $72 in commissions. Simply Recommend the Best QuickBooks Pro Video Course available at Clickbank.

      {{ DiscussionBoard.errors[7206262].message }}
    • Profile picture of the author syedqurat
      this same code working on my website too.

      Originally Posted by Mr Bill View Post

      Ok, try styling the dimensions. Like this...

      [iframe name="frame" id="frame" style="height: 489px; width: 327px;" src="insertyourURLhere" frameborder="0" marginwidth="0" scrolling="no" align="middle"]

      This is exactly what is working on my page here
      Signature
      NS Layout Website Design & SEO Services
      WORDPRESS | DRUPAL | JOOMLA | MAGENTO | PHP | HTML | CSS |
      {{ DiscussionBoard.errors[7288844].message }}
  • Profile picture of the author Mr Bill
    Cool. You're welcome.
    {{ DiscussionBoard.errors[7208227].message }}
  • Profile picture of the author bwh1
    Mr Bill

    there is a small problem you maybe have a answer too.

    The Iframe works in Chrome and IE, but NOT in FireFox 8-(

    Any idea what I can do against it?

    Could I include some in the code to make this work in FF as it does in the other browsers?

    Another idea is adding a link above the Iframe telling people which using FF and won't see the Iframe to click at the link.

    A a small window would pop up in about 300x400 with the same content in it then the Iframe shows. I already saw such stuff for disclaimers and TOS etc.

    Would that be difficult to do in WP?

    Again, many thanks
    Signature

    Affiliates Wanted! Make anywhere from 42,- to $72 in commissions. Simply Recommend the Best QuickBooks Pro Video Course available at Clickbank.

    {{ DiscussionBoard.errors[7286160].message }}
  • Profile picture of the author Mr Bill
    I just tested it in Firefox 16.0.1 and it works fine. FF8 was released only around a year ago so I'm not sure why it's not working for you. All I can suggest is that you allow Firefox to upgrade itself to the latest version and see if that gets it working for you.
    {{ DiscussionBoard.errors[7286171].message }}
    • Profile picture of the author bwh1
      Originally Posted by Mr Bill View Post

      I just tested it in Firefox 16.0.1 and it works fine. FF8 was released only around a year ago so I'm not sure why it's not working for you. All I can suggest is that you allow Firefox to upgrade itself to the latest version and see if that gets it working for you.
      LOL, that 8-( was my sad face, not related to Firefox.

      So you could see the Iframe in FF, strange (but good).

      Me and my partner couldn't see it.

      I just downloaded FF yesterday to test it, had only Chrome and IE on my laptop.

      A browser test also didn't showed me much as they don't display til down that part of the page.

      Will have to ask a few others to check that out.

      G.

      Bill, the second link in your sig is not working, just to let you know.
      Signature

      Affiliates Wanted! Make anywhere from 42,- to $72 in commissions. Simply Recommend the Best QuickBooks Pro Video Course available at Clickbank.

      {{ DiscussionBoard.errors[7288699].message }}
  • Profile picture of the author jutipum
    [DELETED]
    {{ DiscussionBoard.errors[7286280].message }}
  • Profile picture of the author webpeon
    I'm not sure whats happening here... Ive always just inserted iframes directly into the pages html editor..

    <iframe src="http://astore.amazon.com/maditedevelo-20" width="796px" height="1000px" frameborder="0" scrolling="yes"></iframe>

    I am using this exact code on this WP page and I'm pretty sure its cross browser compatible.
    Signature
    Web 2 Mobile
    The Future of The Web
    {{ DiscussionBoard.errors[7289959].message }}
    • Profile picture of the author bwh1
      Originally Posted by webpeon View Post

      I'm not sure whats happening here... Ive always just inserted iframes directly into the pages html editor..

      <iframe src="http://astore.amazon.com/maditedevelo-20" width="796px" height="1000px" frameborder="0" scrolling="yes"></iframe>

      I am using this exact code on this WP page and I'm pretty sure its cross browser compatible.
      That code just gave some some kind of a thumbnail IFrame with scroll feature.

      And I used 2 plugins which should make it work.

      Only Mr. Bill's code worked, finally.

      WP editor is cutting out some part of the default code, I understood based on security settings.

      Actually very weird that your code works the way you posted above.

      G.
      Signature

      Affiliates Wanted! Make anywhere from 42,- to $72 in commissions. Simply Recommend the Best QuickBooks Pro Video Course available at Clickbank.

      {{ DiscussionBoard.errors[7290463].message }}
      • Profile picture of the author igl0w
        [DELETED]
        {{ DiscussionBoard.errors[7290554].message }}
      • Profile picture of the author webpeon
        Originally Posted by bwh1 View Post

        That code just gave some some kind of a thumbnail IFrame with scroll feature.

        And I used 2 plugins which should make it work.

        Only Mr. Bill's code worked, finally.

        WP editor is cutting out some part of the default code, I understood based on security settings.

        Actually very weird that your code works the way you posted above.

        G.
        I am wondering if it is because I also use another plugin 'allow html in categories' or something named that, its possible its also over-riding the security you mention on pages
        Signature
        Web 2 Mobile
        The Future of The Web
        {{ DiscussionBoard.errors[7295548].message }}

Trending Topics