What is an iFrame ? How to add it in your website ?

Inline frames are generally called as an iFrame in HTML language. A webmaster can insert a document inside another document using the iFrame tag. Usually, most of the Youtube videos are embedded using this technique. Not only for videos, but iFrame can also be used to embed a webpage inside another webpage too.



Just for an example, the following is an iFrame of GeekyBrains mobile website. So when you visit GeekyBrains from your mobile or tablet you will get the same look as below.


How to add an iFrame to your website?

Consider you are writing a blog and you want to show your favorite website right inside your blog post. Then using an iFrame can give your readers a better visual experience.
Add the following code to your blog by editing the HTML of your post. I am giving the code to above iFrame i.e. GeekyBrains mobile website. You can replace the URL (marked in Yellow color) of your desired website in the below code and add an iFrame to your blog.

<iframe frameborder="1" height="1230px" marginheight="0px" marginwidth="0px" name="" scrolling="no" src="http://geekybrains.com/?m=1" style="border: 0px #FFFFFF none;" width="468px"></iframe>

But if you are looking for a higher search engine ranking, avoid using iFrames unnecessarily. The search bots will confuse with iFrames as it contains a complete webpage inside another webpage. Usually, the search engine bots will follow an order of HTML elements (like head, style then body elements etc), If your webpages do not follow this order it may cause some damage to your blog or website.