How to Embed an iFrame in WordPress


WordPress is easily the most versatile of all the “DIY” website building tools on the planet today, providing you with literally EVERYTHING you need to build a professional website from scratch without having the “heavy lifting” when it comes to the programming or the website coding.

Already responsible for hundreds of millions of websites all over the world, WordPress is about as close to a professional website in a box (so to speak) as you are going to get – and its flexibility makes it an attractive option for those that want to design and develop websites as well as those that are much more interested in just getting something professional up and running so they can their business online.

From time to time, however, it may be necessary to go outside the box with what WordPress is capable of and add your own special features. Adding an iFrame is part of this process, giving you the opportunity to open up another website (or pretty much any other online element, for that matter) inside of your own websites so that your visitors never have to leave your sites to access content.

All smart and savvy online business owners understand that the last thing you want to do is encourage your visitors that are so difficult to get to your website in the first place to leave for any reason whatsoever – even if it’s an important part of your conversion process. By bringing these outside elements into your website (through the use of an iFrame) you’re able to both provide them with the content that you are hoping to without ever pushing them off of website properties that you control.

At the same time, not everyone has proficient enough skills in HTML, PHP, and CSS to integrate an iFrame into your WordPress installation. For the most part, WordPress (again – surprise, surprise) provides you with all of the tools you need to get the job done. But you do need to know how to utilize these tools best.

Let’s dive right in!

Utilize the built-in WordPress “Embed” tools on every page and post to insert iFrames

The easiest way (by far) to get iFrames inserted into your webpages or your posts on WordPress is to simply utilize the built-in “Embed” tools that you’ll find in the WordPress page or post builder.

This tool is going to be right up near the top of the page when you are getting ready to add new content, and you’ll find it relatively simple and straightforward enough to utilize. On top of that, it is incredibly robust and flexible – even if it seems a little bit too simple on the surface.

All you have to do is click the “Embed” tool and you’ll be provided with a short code of HTML inserted directly into the block of text that you were editing for your page or your post. Simply fill out the information contained within this short code to delineate exactly what it is you want to embed (this is where the information in the address for your iFrame will go) and you are off to the races!

Obviously, you may have to do a little bit of tinkering to figure out exactly what size you’ll need your iFrames to be, as well as the best way to present your iFrames, but with a little bit of trial and error (and the beauty of the “Preview” feature of the WordPress CMS) you will be able to get things just the way you want them without your visitors having to see the work in progress, so to speak.

Take advantage of external WordPress plug-ins to better manage your iFrames

At the same time, there are other ways to utilize iFrames in your WordPress installation – especially if you don’t want them taking up the main body of your page or post content.

WordPress plug-ins are established to do pretty much anything and everything you can do on a website these days, and with literally millions of options to pick and choose from you’ll find it relatively easy to download an iFrame plug-in that allows you to leverage these resources in any and every way you see fit.

Like most quality WordPress plug-ins, the best options are 100% free and 100% open source and available directly on the WordPress “Plug-in Library”. However, some premium plug-in options are worthwhile and can be easier to use or more religiously updated and debugged, so you might want to go in that direction, too.

When using plug-ins to manage your iFrames, you’ll want to be sure that it’s easy enough to insert the important iFrame information pertaining to the size, presentation, and actual content that you are hoping to share with the iFrame itself. Some troubleshooting may be necessary to get the exact look and feel you are going for with this plug-in generated iFrame, but for the most part you shouldn’t have too terribly much to worry about!