Browse Sequences in WebHelp Topics

Streamer text

To add text links, create a Master Page with a header of footer. Add the following script to the header and footer.

1. Open your master page and select the header or footer.
2. Click Insert > HTML > Advanced > Script
3. Paste the script above in the Source tab and click OK.

var sForward = canGo(true);
var sBackward = canGo(false);

//Text links
if(sBackward == true)
 document.write('<a href="javascript:void(0);" onclick="onPrev();">Previous Topic</a>&nbsp;');
if(sForward == true)
 document.write('<a href="javascript:void(0);" onclick="onNext();">Next Topic</a>');

Image links

If you prefer to use image links, you have a few more steps to take. If you simply let the script add an image, the path to the image only works for topics in your project root. Therefore you need the path to the project root so your images will display in all topics.

To get this working, you must first add the images as baggage files to your project. With the following script, you can then add the images to every page. Simply add the script in the header of footer of your master page. This example assumes that your images are in the directory images.

Set the filename and path for the active and inactive images in the variables backsrc and forwardsrc.

1. Create a folder images in your project.
2. Add the four files as baggage files in the folder images.
3. Open your master page and select the header or footer.
4. Click Insert > HTML > Advanced > Script
5. Paste the code from below in the Source tab and click OK.

var avenueid = 'avenueimgholder';
document.write('<div id="'+avenueid+'"></div>');
if(gsStartPage == "") {
    setTimeout('createImageLinks()', 500);
} else {
    createImageLinks();
}

function createImageLinks() {
    var sForward = canGo(true);
    var sBackward = canGo(false);
    var sRelPath = _getRelativePath(document.location.toString(), gsStartPage);//Get root path
    
    var noclick = "void(0)";
    //Image links
    if(sBackward == true) {
            backsrc = sRelPath+'/images/prev.png';
            backclick = "onPrev()";
    } else {
            backsrc = sRelPath+'/images/prev_inactive.png';
            backclick = noclick;
    }

    if(sForward == true) {
            forwardsrc = sRelPath+'/images/next.png';
            forwardclick = "onNext()";
    } else {
            forwardsrc = sRelPath+'/images/next_inactive.png';
            forwardclick = noclick;
    }
    
    var html = "";
    html+='<img src="'+backsrc+'" alt="Previous topic" title="Previous topic" onclick="'+backclick+'" style="cursor: pointer"/>';
    html+='<img src="'+forwardsrc+'" alt="Next topic" title="Next topic" onclick="'+forwardclick+'" style="cursor: pointer"/>';
    
    var holder = document.getElementById(avenueid);
    holder.innerHTML = html;
}