While writing an article recently, I noticed that WordPress has problem in inserting / displaying an Iframe element in its pages. When I inserted an Iframe in the HTML code of that article, it did not show up in that page on the Tech Superb website. So, I examined the code and tried it using different tricks. Ultimately, I succeeded in my effort but in the process I found that WordPress has a little bug in its dashboard which did not allow the Iframe element to be shown on a web page. I am describing here that little trick to insert / display an Iframe element in a WordPress site. But before that let me point out as to what Iframe is. Iframe is basically an HTML tag that stands for “inline frame” and it allows displaying of another document or web page within a given web page.
For example, have a look at the following Iframe element that shows the Wikipedia’s home page within this web page:
In fact, the trick is very simple. Login to your WordPress dashboard. Click on the “HTML” tab of the Edit Post interface (as shown in the figure below) and insert the code for the Iframe tag. Now, without shifting to the “Visual” mode by clicking on the “Visual” tab of the Edit Post interface, directly publish the post by clicking on “Update Post” or Publish button in the right sidebar.
Please remember that after inserting the Iframe code in the HTML mode of the interface, if you shift to the Visual mode, the Iframe code will disappear and the Iframe object will not be shown. Moreover, thereafter, even if you go back to the HTML mode of the interface, you’ll find that the Iframe code is no more available there! It has disappeared!!
Therefore, as I mentioned above, insert the Iframe code in the HTML code of your page by displaying the HTML mode in the interface on your WordPress dashboard, and then directly publish your post from there while the Iframe code is still visible. Don’t shift to the Visual mode of the Edit Post interface if you’re using an Iframe in your page.
It appears that the Visual mode of the WordPress dashboard interface somehow removes the Iframe code. It appears to be a bug. May be that it does not recognize Iframe tag. Anyway, the above little trick will help you to display the Iframe element correctly on your WordPress website / blog. And, as an illustration, you can see an Iframe element in this page itself that shows the Wikipedia’s home page within this page (see image above). Let me point out that I’m using the WordPress 2.8.5 version at the time of this writing.
Did you like this article? To get all such articles from Tech Superb directly:
Related Articles:
If you would like to make a comment, please fill out the form below.
This is really nice information, i was not knowing that it can be displayed in iframe.
nice post. thanks.
Thanks for this information. It greatly helped me out. I was having the same issue on one our clients Wordpress sites. This is the first time I had this problem. It’s strange because we install maps on most of our clients sites using Wordpress and it has always worked fine before.