There are a bunch of questions from readers that what is WordPress iFrame? How do I embed an iFrame in WordPress? What does the use of WordPress iFrame? I am going to answer all of your questions and also show you how to embed WordPress iFrame with and without using a plugin.
What is an iFrame in WordPress?
The iFrame is an HTML tag that is used to display content from any other website on your WordPress site. It is like a window that attracts visitors to interact with another website content that is hosted somewhere else. Using WordPress iFrame you can easily embed videos without downloading and uploading them on your website.
Pros & Cons of Using an iFrame in WordPress?
There are several pros and cons of using WordPress iFrame. It would be good to be aware of both of the pros and cons of using iFrame in WordPress.
Pros
- iFrame in WordPress helps you to embed visual content easily.
- Using WordPress iFrames you can easily display multiple ads.
- It’s the simplest way to display content from an external resource anywhere on your WordPress site.
- It’s secure as the users don’t have access to the main content’s code.
Cons
- It will slow down the web page.
- It gives you security threats if it has been linked with any malicious websites.
- Not all devices support WordPress iFrame.
- It’s not a good option for search engine optimization.
Now let’s discuss how to embed WordPress iFrame now.
Embed WordPress iFrame Using a Plugin
The simple and best way to use iFrames in WordPress is by using a plugin. There are several plugins available but here I am using an Advanced iFrame plugin.
To install the Advanced iFrame plugin, simply go to your WordPress dashboard and then go to Plugins → Add New and search for WordPress Advanced iFrame plugin.
Once you installed the plugin and activated it, go to the Advanced iFrame tab from the left side menu and click on the settings tab from the top.
You can easily define the layout, such as height, width, border, and scrolling behavior of your WordPress iFrame from here.
Update the settings and click generate a shortcode for the updated settings button.
Copy the generated code and paste it inside any of your website pages you wish to embed this iFrame.
You can also change the width and height as per your requirements inside the shortcode.
After adding this shortcode inside any of your website page it looks like this.
I have successfully embedded iFrame to my WordPress site using the Advanced WordPress iFrame plugin.
[advanced_iFrame use_shortcode_attributes_only="true" src="https://wpitech.com" width="100%" height="600" id="advanced_iFrame" ]
I have embedded my own blog using WordPress iFrame as an example.
Embed WordPress iFrame Without Using a Plugin
You don’t have to put a large code to add an iFrame in WordPress. It is a simple HTML code that is used to add iFrame in WordPress.
<iFrame src=”your_webpage_url”>
However, you can also add additional parameters to adjust the desired width and height.
<iFrame src="https://wpitech.com/" width= “100%” height="200px" frameborder="1" scrolling="yes" align="right"></iFrame>
In the above code I have defined the width and height. I have also added a scrolling option for visitors to easily scroll the web page. I have set the container to right align as you can adjust it accordingly to “right:, “left”, “top”, or “bottom”.