Advanced Iframe ProiframeDonateGitHub
WordPress plugin: embed iframe into content.
Iframes are needed to embed video from youtube or to embed Google Map or just to embed content from external page.
WordPress removes iframe when you switch from "HTML" to "Visual" tab because of the security reasons.
So you can embed iframe code using this shortcode [iframe width="100%" height="480" src="http://player.vimeo.com/video/3261363"].
You also can use this shortcode to embed content via simple link: [embed_]http://www.youtube.com/watch?v=A3PDXmYoF5U[/embed] (without underscore '_')
shortcode is a WordPress core feature and based on oEmbed.
Parameters:
- src - source of the iframe
[iframe src="http://player.vimeo.com/video/819138"](by default src="http://player.vimeo.com/video/819138"); - width - width in pixels or in percents
[iframe width="100%" src="http://player.vimeo.com/video/819138"]or[iframe width="640" src="http://player.vimeo.com/video/819138"](by default width="100%"); - height - height in pixels
[iframe height="480" src="http://player.vimeo.com/video/819138"](by default height="480"); - scrolling - parameter
[iframe scrolling="yes"](by default scrolling="no"); - frameborder - parameter
[iframe frameborder="0"](by default frameborder="0"); - marginheight - parameter
[iframe marginheight="0"](removed by default); - marginwidth - parameter
[iframe marginwidth="0"](removed by default); - allowtransparency - allows to set transparency of the iframe
[iframe allowtransparency="true"](removed by default); - id - allows to add the id of the iframe
[iframe id="my-id"](removed by default); - class - allows to add the class of the iframe
[iframe class="my-class"](by default class="iframe-class"); - style - allows to add the css styles of the iframe
[iframe style="margin-left:-30px;"](removed by default); - same_height_as - allows to set the height of iframe same as target element
[iframe same_height_as="body"],[iframe same_height_as="div.sidebar"],[iframe same_height_as="div#content"]; (removed by default); - any_other_param - allows to add new parameter of the iframe
[iframe any_other_param="any_value"]; - any_other_empty_param - allows to add new empty parameter of the iframe (like "allowfullscreen" on youtube)
[iframe any_other_empty_param=""];
I'm trying to embed content from another directory on my domain into a WordPress page and it's not working. In fact, even your example [iframe src="http://www.youtube.com/embed/A3PDXmYoF5U" width="100%" height="480"] isn't working.
WP page on my site is here: http://seraph-labs.com/documentation/
Content I want embedded is here: http://seraph-labs.com/docs/index.htm
Code I'm using is: [iframe src="http://www.seraph-labs.com/docs/index.htm"]
If shortcode from example does not working than you should check if there is any other plugin that conflicts with iframe plugin or is there plugins that work with [iframe] shortcode too.
Hi, I have an html url embedded in the iframe but when I update the source html the iframe content does not refresh unless I call up the original url, refresh this and then the iframe content updates! This has to be done on all machines that view the page to work so it means updating the content is impossible! Is there anyway round this please?
Don't worry, all other computers will see the last updated html version.
Cached version will see only persons who visited the same page during short period of time (like you did) but this happens very rarely.
Thanks, the problem is that the client visited the updated page several times over a few days and it did not update, he kept refreshing and refreshing but to no avail so he had to go to the source page, refresh this to make it work and was concerned about other viewers. But thanks for your swift support.
Im trying to post my shop page on to my website but having many difficulties. What should I do?
http://moviespoilerspodcast.spreadshirt.com/
You should not use iframe, because iframe is build to create difficulties :)
Hello,
Nice plugin, just one question, how can I force it to open links in parent window instead of opening the page in the iframe area?
Thank you
Any help?
You may check out this solution.
thank you
Hi. I was wondering, can iFrame be used to embed video stream from an IP camera? Camera is using RTSP, can have its own WAN IP address, or a DynDNS address. Thanks in advance!
I don't know. You could try to embed video stream from IP Camera if you have url address of this stream.
Put that url into src param of iframe.
Please excuse my noobness, but what do i do with the iframe plugin then? do i need to copy it somewhere within the site?
Install and activate iframe plugin.
Then insert this shortcode into post or page content: [iframe width="100%" height="480" src="http://player.vimeo.com/video/3261363"]
But change the scr param with your url-address.
Did that. Didn't work. It seems i need to get to the manufacturer support for this one. Thanks for your help, anyways!
Solved. It seems the issue was with the camera after all. After i switched to a completely different one, it worked. Thanks for the help!
sorry for dumb question. What the "install" means? I am using IE-10 on Windows 7 and literally stuck by not understanding how to install it. Please help.
You should install Iframe plugin to your WordPress site and activate it.
Then you can insert [iframe src="http://www.youtube.com/embed/A3PDXmYoF5U" width="100%" height="480"] into page or post content when you edit some post or page.
I am trying to embed this video- http://financialpicture2.com/view/3839/20
Try this shortcode: [iframe src="http://financialpicture2.com/view/3839/20"]
Thank you it worked but how do I resize it?
You cannot resize that video, because it is on the another domain.
But you can resize the iframe:
[iframe src="http://financialpicture2.com/view/3839/20" width="100%" height="400"]
Im trying to embed a pinterest page on my site. Is this blocked? Thanks!
example
http://pinterest.com/chris
[iframe src="src="http://pinterest/chris"]]
You have an error in the shortcode.
Try this one:
[iframe src="http://pinterest.com/chris"]Hi there,
I'm using iframe to embed googledoc charts (http://thespysurfer.com/?page_id=2976)
Everything looks great except on Nexus 7 devices where the charts can be moved within the frame. Other Android & iOS devices are ok though, just Nexus 7.
Any idea?
Cheers!
Found the solution: update Chrome OS
I am trying to iFrame this URL http://63.246.128.80/a2billing/customer/ in one of my wordpress pages but it does not want to .. any help plz ? Thanks
Try this shortcode: [iframe src="src="http://63.246.128.80/a2billing/customer/"]
hello, ive set up an iframe with a pdf document for our intranet site.
in chrome my wordpress menu goes over the iframe windows perfect but for ie9 it falls behind it.
i tried differend z-indexes with both position relative and absolute without a resolve.... the content is within borders even if i set the width and height smaller it keeps bugging. is there any command of fix for this ?
sorry, but IMHO you will not fix it.
it is the problem of IE.
you may encourage users to use modern browsers, which updates more often than IE.
I have been trying to embed a page with a form into our corporate WordPress page. The resulting form works for most people. Not for others. It either submits and progresses to the success page or throws an error. I can reproduce the error in Chrome and Firefox on Mac. The frustrating thing is that the form works every time on the source page but not when embedded in an iframe on ours.
This could be made specially for disabled embedding on other sites.
The kicker is that the embedded form displays fine. It just errors on submit - and only from the Mac versions of Chrome and Firefox. All other platforms and browsers I have tested work fine. You can see it here: http://www.filetransporter.com/iframe-test/
Sorry, but I don't know what is the problem
It was worth a shot. I suspect it has to do with new security settings in those browsers.
I'm using Iframe, and working good with most pages.
Now I'm trying to get google.com/finance to display with Iframe on my site but not luck, any suggestions?
Thanks.
Google blocked iframe embedding via iframe for google.com/finance.
Google-finance return such headers:
x-content-type-options:nosniffx-frame-options:SAMEORIGIN
x-xss-protection:1; mode=block
I want to use the iframe and i want to make sure only partial of the website that i am getting the data is visible? Can you please expalin how i can do it?
e.g. I do not want the header of the source to be visible in my page.
IMHO it is not possible to do with iframe. You can embed only whole site via iframe.
I have two different website with two different iframe plug-ins (this iframe plugin on one and iframe preserver on the other) and on each, scheduled posts get stripped of the iframe when they post. I can go back in and add the iframe code and update the post, but I'm wondering if anyone else is having this problem.
I didn't met this problem on other sites.
Your sites are stripping the [iframe] shortcode? Or html iframe tag is stripped?
I am having trouble inserting a subdomain into the iframe
http://deepsouth.tuckerdev.co.uk/course/view.php?id=14
is it possible, am I missing something?
Thanks
http://deepsouth.tuckerdev.co.uk/ is not allowed to be used inside of the iframe because of header - X-Frame-Options:sameorigin
The author of the http://deepsouth.tuckerdev.co.uk/ blocked this feature on his site.
This header exists only on that subdomain. On other subdomains this header does not added.
can you embed two different pages in different iframes using this? (we want to embed our media player and facebook in one page)
you can embed two different pages using iframe
Hi, I'd like to embed only the leaderboard, not the whole page from the site europeantour.com. http://www.europeantour.com/europeantour/season=2012/tournamentid=2012092/leaderboard/index.html
Thanks in advance!
You can not embed only part of the page with iframe.
could you please explain the get_params_from_url feature with some detailed examples?! I do not understand it in all details ...
best greetings
Pascal
Example: page url (where you want to embed iframe) - site.com/?prm1=11,
shortcode of the iframe - [iframe src="embed.com" get_params_from_url="1"],
iframe src - embed.com?prm1=11
So iframe source url will have the get param from page url.
and if there are two get params like site.com/?prm1=11&ref=22 I have to set get_params_from_url="2" ?
get_params_from_url is boolean param, so if you want to enable it, just set get_params_from_url="1".
All params from page url will be passed to iframe src.
P.S. I tried to send a letter to your email and it failed.