As you have very customized template plugin couldn't apply it's js and css file by it self so you need to add them manually !
openup themes/your theme/template.html
add this code before </head> tag
<link rel="stylesheet" href="plugins/highslide/include/highslide.css" type="text/css">
<script type="text/javascript" src="plugins/highslide/highslide.js"></script>
<style type="text/css">
.highslide {
cursor: url('plugins/highslide/graphics/zoomin.cur'), pointer;
outline: none;
}
.highslide-image {
cursor: pointer; /* opera */
cursor: url('plugins/highslide/graphics/zoomout.cur'), pointer;
border: 2px solid white;
}
.highslide-loading {
display: block;
color: white;
font-style: 'MS Sans Serif';
font-size: 9px;
font-weight: bold;
text-transform: uppercase;
text-decoration: none;
padding: 3px;
opacity: 0.60; /* w3c */
filter: alpha(opacity=60); /* ie */
border-top: 1px solid white;
border-bottom: 1px solid white;
background-color: black;
padding-left: 22px;
background-image: url('plugins/highslide/graphics/loader.gif');
background-repeat: no-repeat;
background-position: 3px 1px;
}
</style><script type="text/javascript">
hs.cpghs_graphicsDir = 'plugins/highslide/graphics/';
hs.cpghs_loadingText = 'Loading...';
hs.cpghs_loadingTitle = 'Click to cancel';
hs.cpghs_restoreTitle = 'Click to restore thumbnail';
hs.cpghs_outlineType = 'rounded-white';
window.onload = function() {
hs.cpghs_preloadImages();
}
</script>
and then add this to your body tag
onload="init();"
and after that, right after body tag put this div
<div id="highslide-container"></div>
I don't have my test bed so please test it and confirm ....