以下のスクリプトをダウンロード

• jquery-1.7.1.min.js
• jquery.nivo.slider.js

HTMLのスライドショーを表示したい部分に以下を挿入

<div class="theme-default">
  <div id="slider" class="nivoSlider"> 
    <img src="/materias/画像ファイル" data-thumb="/materias/画像ファイル" alt=""> 
    <a href="任意のURL"><img src="/materias/画像ファイル" data-thumb="/materias/サムネイル画像" alt="" title="キャプション文字列"></a> 
    <img src="/materias/画像ファイル" data-thumb="/materias/サムネイル画像" alt="" data-transition="slideInLeft"> 
    <img src="/materias/画像ファイル" data-thumb="/materias/サムネイル画像" alt="" title="#htmlcaption"> 
  </div>
  <div id="htmlcaption" class="nivo-html-caption">キャプション文字列</div>
</div>

キャプションにリンクや装飾を含めたい場合は「title」タグに「#htmlcaption」を書き込み、DIV内で記載

HTMLの</body>タグの直前に以下を挿入

<script src="/js/jquery-1.7.1.min.js"></script> 
<script src="/js/jquery.nivo.slider.js"></script> 
<script>
  $(window).load(function() {
    $('#slider').nivoSlider();
  });
</script>

CSSに以下を追記

.theme-default .nivoSlider {
  position:relative;
  background:#fff url(/materials/loading.gif) no-repeat 50% 50%;
  margin-bottom:0px;
  -webkit-box-shadow: 0px 1px 5px 0px #4a4a4a;
  -moz-box-shadow: 0px 1px 5px 0px #4a4a4a;
  box-shadow: 0px 1px 5px 0px #4a4a4a;
}
.theme-default .nivoSlider img {
  position:absolute;
  top:0px;
  left:0px;
  display:none;
}
.theme-default .nivoSlider a {
  border:0;
  display:block;
}

.theme-default .nivo-controlNav {
  text-align: center;
  padding: 20px 0;
}
.theme-default .nivo-controlNav a {
  display:inline-block;
  width:22px;
  height:22px;
  background:url(../images/bullets.png) no-repeat;
  text-indent:-9999px;
  border:0;
  margin: 0 2px;
}
.theme-default .nivo-controlNav a.active {
  background-position:0 -22px;
}

.theme-default .nivo-directionNav a {
  display:block;
  width:30px;
  height:30px;
  background:url(../images/arrows.png) no-repeat;
  text-indent:-9999px;
  border:0;
}
.theme-default a.nivo-nextNav {
  background-position:-30px 0;
  right:15px;
}
.theme-default a.nivo-prevNav {
  left:15px;
}

.theme-default .nivo-caption {
    font-family: Helvetica, Arial, sans-serif;
}
.theme-default .nivo-caption a {
    color:#fff;
    border-bottom:1px dotted #fff;
}
.theme-default .nivo-caption a:hover {
    color:#fff;
}

.theme-default .nivo-controlNav.nivo-thumbs-enabled {
  width: 100%;
}
.theme-default .nivo-controlNav.nivo-thumbs-enabled a {
  width: auto;
  height: auto;
  background: none;
  margin-bottom: 5px;
}
.theme-default .nivo-controlNav.nivo-thumbs-enabled img {
  display: block;
  width: 120px;
  height: auto;
}
.nivoSlider {
  position:relative;
  width:700px;
  height:auto;
  overflow: hidden;
}
.nivoSlider img {
  position:absolute;
  top:0px;
  left:0px;
}
.nivo-main-image {
  display: block !important;
  position: relative !important; 
  width: 100% !important;
}

/* If an image is wrapped in a link */.nivoSlider a.nivo-imageLink {
  position:absolute;
  top:0px;
  left:0px;
  width:100%;
  height:100%;
  border:0;
  padding:0;
  margin:0;
  z-index:6;
  display:none;
}
/* The slices and boxes in the Slider */.nivo-slice {
  display:block;
  position:absolute;
  z-index:5;
  height:100%;
  top:0;
}
.nivo-box {
  display:block;
  position:absolute;
  z-index:5;
  overflow:hidden;
}
.nivo-box img { display:block; }

/* Caption styles */.nivo-caption {
  position:absolute;
  left:0px;
  bottom:0px;
  background:#000;
  color:#fff;
  width:100%;
  z-index:8;
  padding: 5px 10px;
  opacity: 0.8;
  overflow: hidden;
  display: none;
  -moz-opacity: 0.8;
  filter:alpha(opacity=8);
  -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */  -moz-box-sizing: border-box;    /* Firefox, other Gecko */  box-sizing: border-box;         /* Opera/IE 8+ */}
.nivo-caption p {
  padding:5px;
  margin:0;
}
.nivo-caption a {
  display:inline !important;
}
.nivo-html-caption {
    display:none;
}
/* Direction nav styles (e.g. Next & Prev) */.nivo-directionNav a {
  position:absolute;
  top:45%;
  z-index:9;
  cursor:pointer;
}
.nivo-prevNav {
  left:0px;
}
.nivo-nextNav {
  right:0px;
}
/* Control nav styles (e.g. 1,2,3...) */.nivo-controlNav {
  text-align:center;
  padding: 15px 0;
}
.nivo-controlNav a {
  cursor:pointer;
}
.nivo-controlNav a.active {
  font-weight:bold;
}