Find the Hot Potatoes source folder, and copy the hp6navbar.ht_ file into your custom source folder.

Open the file in your text editor. You'll see a <div> tag containing three separate blocks of code, one for each button on the navigation bar. The third one looks like this:

[inclNextEx]
<button class="NavButton"
[...]
onclick="location='[strNextExURL]'; return false;">[strNextExCaption]</button>
[/inclNextEx]

For our custom button, we're going to copy some of this code, to create a new button, then modify it. We don't need the include instructions, so ignore them; just copy the <button> tag (<button ... </button>), and paste it between the last [/inclNextEx] and the closing </div> tag at the end of the file.

The last few lines of your file should look like this:

[/inclNextEx]

<button class="NavButton" onfocus="NavBtnOver(this)" onblur="NavBtnOut(this)" onmouseover="NavBtnOver(this)" onmouseout="NavBtnOut(this)" onmousedown="NavBtnDown(this)" onmouseup="NavBtnOut(this)" onclick="location='[strNextExURL]'; return false;">[strNextExCaption]</button>

</div>

The next thing to do is to comment our changes. Add a comment before and after your new code like this:

<!-- MDH_Custom: new button added to navigation bar. -->

<button class="NavButton"
[...]
onclick="location='[strNextExURL]'; return false;">[strNextExCaption]</button>

<!-- MDH_Custom: end of new button. -->

</div>

Next, we need to change the caption of the button to its new caption. Right now, the caption is a placeholder ([strNextExCaption]). Change this to "HotPot".

Finally, we need to add the URL the button will go to. At the moment, that's another placeholder ([strNextExURL]). Change it to this:

http://web.uvic.ca/hrd/hotpot/

Make sure you don't remove the single quotes surrounding the URL.

Now your code should look like this:

<button class="NavButton" onfocus="NavBtnOver(this)" onblur="NavBtnOut(this)" onmouseover="NavBtnOver(this)" onmouseout="NavBtnOut(this)" onmousedown="NavBtnDown(this)" onmouseup="NavBtnOut(this)" onclick="location='http://web.uvic.ca/hrd/hotpot/'; return false;">HotPot</button>

Save the file, then create an exercise in JQuiz and view it in your browser. Here's an example.