Skip to content
Related Articles

Related Articles

How to embed iFrame in WordPress ?

View Discussion
Improve Article
Save Article
Like Article
  • Last Updated : 26 Nov, 2021

An Iframe is a method of embedding a web page into the content of another page. This is accomplished through the use of HTML elements, the URL of the external website, and parameters for how the window should look on your website.

How to use iframes in WordPress: There are several ways to construct an Iframe, just as there are numerous instances in which you would wish to utilize one. We will go through one of the most frequent ways to add Iframe to your WordPress site.

Manually adding iFrames to WordPress Page:

Adding an Iframe to a page requires only one line of code. The opening and closing HTML elements, as well as the URL of the webpage, are required.

 

Syntax:

<iframe src="example.com"></iframe>

Steps to embed in WordPress Page:

Step 1: Go to the page where you want the iframe to appear.

Step 2: Click on add(+) block button and select HTML from the popup.

Step 3: Insert the Iframe tag in the editor for the page you want to embed.

Note: There are a handful of limits to the source URL to be aware of. To begin, Iframes may only show content from sites that utilize the same Hypertext Transfer Protocol (HTTP) as yours. To put it another way, if your site is HTTPS, you can only embed information from other HTTPS sites. Similarly, if you use HTTP, you may only include URLs that utilize HTTP as well.

Step 4: To save your progress and publish the page, click the “Publish” button.                             

Step 5. Your page should now look something like the following screen.

More about the Iframe tag:

If you are able to employ this strategy, keep in mind that you may also change your Iframes to fit your website’s demands. The Iframe parameters come into play. The following are a few of the most common ones.

  • Allow: With this parameter, you may specify whether your Iframe should have certain default behaviours or features.
  • Height: The height parameter sets the pixel size of the Iframe window on your web page.
  • Width: This option allows you to choose the Iframe’s width in pixels.

For instance, the Iframe with a window size of 1080 pixels by 720 pixels, full-screen viewing enabled, and set to download after the rest of the webpage is as follows.

<iframe src=”https://example.com” width=”1080″ height=”720″ allow=”fullscreen”></iframe>

Summary: It’s critical to keep your website running smoothly while still staying on the right side of the law. Not only do Iframes allow you to share other people’s material ethically, but they will also allow you to show video and audio files without having to store them on your own website.

My Personal Notes arrow_drop_up
Recommended Articles
Page :

Start Your Coding Journey Now!