iFrame, You can frame, We all can frame...

I've been dappling with very basic html embed codes and trying out how to embed a webpage inside of another webpage on this blog and my Weebly portfolio site. This is a nifty trick to use when you want more of a wow-factor visually.  Seeing the webpage can be more effective to showcase a website than merely hyper-linking to it or including an embedded RSS feed list. For additional easy HTML codes, check out this printable HTML Cheat Sheet for Bloggers. If you have another way of embedding a web page inside of a webpage, please share!

Insert an Object

To embed a webpage inside of a webpage, try using this code, swapping out the specific web address where "example" is shown. The numbers for width and height can also be adjusted to make the frame larger.

<object data=http://www.example.com width=”650″ height=”500″> <embed src=http://www.example.com width=”650″ height=”500″> </embed></object>

After adding the specific web address, open the HTML editor on your site, figure out where you want the frame to be, and paste it in.  I will toggle back and forth between the HTML editor and the Compose view, adjusting the height and width as needed.  With more experience, I am sure I will learn what the optimal numbers are, but for now, this trial and error approach works.

iFrame Generator

Another option is to use an online iFrame generator that creates the code for you. Copy/paste or type in your specifications and... WHA-LA! ... the iFrame code is generated for you! Simply copy/paste the code into the HTML editor as shown above.

<iframe src="https://blog.edmodo.com/2014/04/10/animal-tales-brody-certified-therapy-dog-and-leader-of-the-paws-pack/" style="border:0px #000000 solid;" name="Edmodo Blog Guest Post" scrolling="yes" frameborder="1" marginheight="px" marginwidth="0px" height="600px" width="668px"></iframe>

Here is what it looks like once the code is pasted in to the HTML editor.