I have been trying to use the Dynamic Javascript photo gallery within a page on my wordpress site.

This is the gallery I want - http://www.suzierthanyou.com/testportfolio.htm.

I've put the header stuff into header.php:

Code:
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="js/lightbox.js"></script>

Then I figured just put my gallery script into the page I'm writing.

Code:
<br>Uni Work<br>
<b>Lastminute.com Ad Campaign Posters</b> 3 Posters designed under the idea of 'Live Every LastMinute.com'. I came up with the slogan 'Get Away With It' & designed these three character themed posters.<br>

<a href="images/gallery/1.png" rel="lightbox[lastminute]" title="LASTMINUTE.COM"><img src="images/gallery/thumbnails/1.png" border="1"></a>
<a href="images/gallery/2.png" rel="lightbox[lastminute]" title="LASTMINUTE.COM"><img src="images/gallery/thumbnails/2.png" border="1"></a>
<a href="images/gallery/3.png" rel="lightbox[lastminute]" title="LASTMINUTE.COM"><img src="images/gallery/thumbnails/3.png" border="1"></a>
<br>
<b>NHS 5ADAY Poster/Website Design</b> Brief was to design a poster & website targeting students about the effects of unhealthy eating, encouraging a healthier lifestyle.<br>
<a href="images/gallery/12.jpg" rel="lightbox[5aday]" title="Get Stuffed Poster"><img src="images/gallery/thumbnails/12.png" border="1"></a>
<a href="images/gallery/13.jpg" rel="lightbox[5aday]" title="Get Stuffed Website"><img src="images/gallery/thumbnails/13.png" border="1"></a><br>
<b>Miscellaneous Other Work</b><br>
<a href="images/gallery/14.png" rel="lightbox" title="POLLYANNA WEBSITE"><img src="images/gallery/thumbnails/14.png" border="1"></a>
<a href="images/gallery/15.png" rel="lightbox" title="DESIGNBOARD"><img src="images/gallery/thumbnails/15.png" border="1"></a>
<a href="images/gallery/6.jpg" rel="lightbox" title="JUXTAPOSITION - COLLEGE"><img src="images/gallery/thumbnails/6.png" border="1"></a>
<a href="images/gallery/7.jpg" rel="lightbox" title="JUXTAPOSITION - COLLEGE"><img src="images/gallery/thumbnails/7.png" border="1"></a>

<p align="justify">
<b>One Collective Flyer Design</b> Flyer designed to promote a new society at University of Leeds. The logo was created already, I then created everything else.<br>
</p>
<a href="images/gallery/4.png" rel="lightbox[onecollective]" title="One Collective Flyer - Front"><img src="images/gallery/thumbnails/4.png" border="1"></a>
<a href="images/gallery/5.png" rel="lightbox[onecollective]" title="One Collective Flyer - Back"><img src="images/gallery/thumbnails/5.png" border="1"></a>
I've read that theres a couple more steps to take when within wordpress, but it doesn't make any sense to me. What else do I need to do?? Thanks in advance for any help x