Hey,
first include following files in the head section (before the closing head tag which looks like </head>):
<!-- ########## CSS Files ########## -->
<!-- Screen CSS -->
<link rel="stylesheet" href="http://my-website.com/aviaslider/style.css" type="text/css" media="screen" />
<!-- ########## end css ########## -->
<!-- JAVASCRIPT GOES HERE -->
<script type='text/javascript' src='http://my-website.com/aviaslider/js/jquery.js'></script>
<script type='text/javascript' src='http://my-website.com/aviaslider/js/jquery.aviaSlider.min.js'></script>
<script type='text/javascript'>
jQuery(document).ready(function(){
// here you can see the slide options
jQuery('#aviaslider').aviaSlider();
});
</script>
And in the body section, add following code to display the slideshow/images:
<ul id="aviaslider">
<li><a href="http://my-website.com/images/slides/1.jpg" title=""><img src="http://my-website.com/images/slides/1.jpg" alt="" /></a></li>
<li><a href="http://my-website.com/images/slides/2.jpg" title=""><img src="http://my-website.com/images/slides/2.jpg" alt="" /></a></li>
<li><a href="http://my-website.com/images/slides/3.jpg" title=""><img src="http://my-website.com/images/slides/3.jpg" alt="" /></a></li>
<li><a href="http://my-website.com/images/slides/4.jpg" title=""><img src="http://my-website.com/images/slides/4.jpg" alt="" /></a></li>
</ul>
Obviously you need to adjust the url to the images and the slideshow css/js files.