How Do I Make a Link Open in a Pop-Up Window?
Q: How do I make a link open in a pop-up window?
A: To do this, you’ll want to use a little bit of javascript code and that will make a link open in a pop-up window in a size you can specify. This is useful when you want your reader to stay on the web page they are viewing, but to easily view extra information complimentary to the information on the main page. Warning: These instructions seem a bit complicated, but work through it slowly, it’s easier than you think.
Here’s how to create the pop-up window
1. Create a Bookmark / Named Anchor
In FrontPage it’s called a “bookmark”, but it is also referred to as a “named anchor”. A named anchor is basically a link that goes to a specific area on a page. For example, if you have a long page and you want to create a menu to allow people to jump to the part of the page they want to read, you’d used named anchors.
For our purposes, you want to create a named anchor to ensure the visitor stays in the exact same place on the main page when they click the link that will open the new pop-up window. Simply create a bookmark right at the place where you want to make that link. If you skip this part and you test out your link later, you’ll see that it will scroll the visitor back up to the top of the main page every time they click the pop-up window link.
Many web page editors can do this for you with their WYSIWG features. For example, in FrontPage, all you do is go to the place on the page where you are going to create the pop-up link and choose: “Insert Bookmark” and then name the bookmark whatever you’d like.
Once you’ve created the bookmark, the link to the URL to link to that part of the page is the usual page name like: mysite.com/info.html and you simply add a number sign (#) and then the name of the named anchor you created. If I called my named anchor “copy”, this is what the link would like this:
http://www.mysite.com/info.html#copy
You’ll need that info for the next step, which actually creating the link to open the information in a javascript pop-up.
2. Create your link
In the above code:
- The first link is a bookmark/named anchor on your page. It’s the place you want your reader to stay on the main page when they click the link.
- The next link is the page you want to open in that javascript pop-up.
- The word “Info” in quotation marks is just a description of the window. Put whatever you want there, but ensure there are no spaces in the name or the link will not work in some versions of Internet Explorer.
- Where it says “scrollbars=yes”, you can change it to “no” if you want. Choose no if the whole page they need to see is viewable in that small window that pops up. If they need to scroll to read more info, keep it at “yes”.
- Where it says “resizable=no”, you can also change it to yes. If it says yes, they can make the window open up to full-size. Generally speaking, if you have a reason to open a small window, you probably don’t want them to leave the main page, so allowing them open the window into full-size probably defeats the purpose. In most cases, keep this as a no.
- Finally, choose the width and height of the window in pixels. Simply change the number to what you need. You’ll definitely want the width to be as wide as the page you’re opening in a new window (Hint! Make that page narrower than the main page, so that it doesn’t overtake the main page you want them to stay on). If the page isn’t very long, you can make the height the length of the page. If it is long, don’t make the window as long, but allow scrollbars, so they can scroll to the read all the information
And that’s it! You’ve created a link that opens in a pop-up window.




