How to Insert Another Website Inside a Web Pageby James Robert
Web developers sometimes find it necessary or desirable to include content from one website within another. This is helpful if you wish to showcase multiple websites within a single page. Using an HTML tag called "iframe" (short for inline frame) allows you to import one (or more) full website to a webpage, and then specify criteria for how those imported sites are displayed. Inline frames are widely used, supported by most web browsers and easy to implement.
Create a backup of any file that you plan to edit.
Open the HTML or PHP file in which you would like to include the external website, using either a Web- design suite such as Dreamweaver or a text editor such as Notepad.
Find the location, in the raw code of the primary Website, that you would like the external Website to appear.
Paste the following code into that location, replacing the text inside parentheses with your desired values. (Do not use the parentheses.) Replace the "width" and "height" attributes with your desired width and height, keeping in mind that width and height can be specified either as percentages (100%, 50%, etc) or pixels (100px, 50px, etc). <iframe src ="(the url of the website you'd like to import)" width="100%" height="100%"> <p>(A message to display if the user's browser does not support iframes.)</p> </iframe>
Add any of the following optional attributes to the iframe tag, replacing the text inside parentheses with your desired values. (Do not include parentheses.) These attributes are not necessary for the iframe to display or function, but including any number of them will give you more control over how that iframe is displayed. frameborder="(1)" -- This attribute controls whether or not there is a border around the iframe. The numerical value represents the border's thickness. marginheight="(1px)" and marginwidth="(1px)" -- These attributes specify the iframe's top/bottom and left/right margins, respectively. Margin, which is stated in pixels, is the amount of space between the outside of the iframe and the containing element. scrolling="(yes)" -- This attribute controls whether or not a scroll bar will appear beside an iframe. This attribute can be set as "yes" (always displays a scroll bar), "no" (never displays a scroll bar) or "auto" (may display a scroll bar, depending on certain criteria). If you set this attribute's value to "no," the iframe's content will be limited to whatever fits inside the specified height and width.
Save the edited file.
Upload the edited file to your Web server or Web host, replacing the original file.
Items you will need
Click here to provide feedback on this article