Open Service in a Pop Up Window

It is fairly easy to open Bravenet services in a popup window provided that you are prepared to modify the copy/paste code that the Bravenet site supplies to you. For example, the Bravenet Votecaster service on the Australian Model Railway web site has copy/paste code supplied as follows:

<div class="centre"><p>
<a href="http://pub47.bravenet.com/vote/vote.php?usernum=3978287778&cpv=1">
<img src="http://images.bravenet.com/pub/vote.gif" border="0" width="100" height="35" /></a>
<a href="http://www.bravenet.com/">
<img src="http://images.bravenet.com/pub/votebutt.gif" border="0" width="100" height="35" /></a>
</div>

It doesn't really matter which service you want to open up as a pop up window, the important thing is to find the actual address of your service. The address of the AMRA votecaster service is shown in bold in the above copy/paste code and all of the Bravenet service addresses look similar to this. If you intend to use the Bravenet supplied image for the link then you will also need that part of the code (shown in bold italic).

The next step is to change the code so as to open the service in a pop up window. We'll use a Javascript call to specify the size and appearance of the window while still supplying code that will open the service in a new window even when our visitor isn't using Javascript. The new code looks like this:

<a href="http://pub47.bravenet.com/vote/vote.php?usernum=3978287778&cpv=1"
onclick="window.open('http://pub47.bravenet.com/vote/vote.php?usernum=3978287778&cpv=1', 'bnetservice', 'toolbar=0,scrollbars=1,location=0,directories=0,status=0, menubar=0,resizable=1,width=620,height=460,top=10,left=10');return false;"
><img src="http://images.bravenet.com/pub/vote.gif" border="0" width="100" height="35" /></a>

Note that everything between "onclick=" and "return false" needs to be on the one line.

The onclick statement opens our nice pop up window when the visitor has Javascript enabled. The href and target statements do the same when our visitor has it disabled or is using a browser that doesn't support Javascript. The return false at the end of the onclick stops the href from being actioned if the onclick is processed so as to stop the window popping up twice. The address of the service needs to be substituted in both of the spots that are shown in bold. Whether you use the supplied image within the link as shown in this code or substitute something of your own is up to you. The actual width, height, top, and left, values that you specify for the initial window position and size are also up to you however if you are using the free version of the service with advertising, you may get a horizontal scrollbar if you set the width less than 810 (although if you set it over 620 it may roll off the right of the page at lower resolutions so it's probably better to get the horizontal scrollbar). The code I have given here allows the visitor to make the new browser window larger if their screen resolution allows for it.

That takes care of making the link a pop up.

Some service are designed to allow them to open on a separate window while others are not. For those that are you (eg, Forum) should find an option in the General Settings to allow the "Back to Site" link to close the window . For those that are not (eg. Votecaster)you can get rid of the "Back to Site" link at the bottom of the service by leaving the Home Page URL field for the service blank.

 

This article written by Stephen Chapman, Felgall Pty Ltd.

go to top

FaceBook Follow
Twitter Follow
Donate