Placing a pop-out text box on your website is an effective way to display information to visitors without them opening a new Web page. You can use a pop-out text box on your website to display text that is relevant to the content of the main page -- for example, many websites use pop-out text boxes to display terms and conditions or more details about an advertised product. You can display a pop-out text box on your website by creating a new page for the pop-out and inserting a line of HTML code on the main content page.
- Skill level:
Other People Are Reading
Launch your regular website design program or text editor tool. Windows-based computers ship with the Microsoft WordPad and Notepad text editor applications.
Click "File" on the main menu, then click "Open" and open the Web page from which you want to display the pop-out text box.
Copy the following code and paste it into the header section of the Web page. The header section comprises all the code between the "<head>" tag and the "</head>" tag:
function popup(mylink, windowname)
if (! window.focus)return true;
if (typeof(mylink) == 'string')
window.open(href, windowname, 'width=300,height=150,scrollbars=no');
Select and highlight the height and width instructions in the pasted code. Change these attributes to configure the pop-out text box to your preferred display size. In the above example, the pop-out window has a screen depth of 150 pixels and a screen width of 300 pixels.
Scroll to the location on the page where you want to display the hotlink to the pop-out box. This is the link that the visitor clicks to open and display the pop-out text box.
Copy and paste the following HTML code into the insertion location:
<A HREF="popout.html" onClick="return popup(this, 'description')">Click Popout</A>
Highlight and change "description" to your own label for the pop-out box. This is for your own use to help you identify the code for the pop-out box and it will not display to your visitors.
Highlight and replace "popout.html" with the correct name of the Web page you created to contain the text in the pop-out box. Change the "Click Popout" link text to your own link text -- for example, "Click for more product details."
Click "File" on the main menu, then select "Save" to save the Web page. Upload the page and the pop-out box page to your Web host's server.
Tips and warnings
- You can also include images, graphics or multimedia content in a pop-out box. If you display images or graphics, ensure the box is large enough to accommodate the size of the image.
- 20 of the funniest online reviews ever
- 14 Biggest lies people tell in online dating sites
- Hilarious things Google thinks you're trying to search for