como ago una galeria

<link rel="stylesheet" media="all" type="text/css" href="http://img44.xooimage.com/files/3/3/4/photoslide-ef1969.css" /> <script src="http://img4.xooimage.com/files/a/9/3/jquery-b17397.js" type="text/javascript"></script> <script src="http://img26.xooimage.com/files/7/9/a/photo-slide-ef1953.js" type="text/javascript"></script> <div id="broder"> <div id="slide">          <img id="loading" src="photo-slide/loading.gif" _fcksavedurl="photo-slide/loading.gif" alt="" />          <a id="p1" href="#url" _fcksavedurl="#url"><img src='URL IMAGEN 1' _fcksavedurl='URL IMAGEN 1' /></a>          <a id="p2" href="#url" _fcksavedurl="#url"><img src='URL IMAGEN 2' _fcksavedurl='URL IMAGEN 2' /></a>          <a id="p3" href="#url" _fcksavedurl="#url"><img src='URL IMAGEN 3' _fcksavedurl='URL IMAGEN 3' /></a>          <a id="p4" href="#url" _fcksavedurl="#url"><img src='URL IMAGEN 4' _fcksavedurl='URL IMAGEN 4' /></a>          <a id="p5" href="#url" _fcksavedurl="#url"><img src='URL IMAGEN 5' _fcksavedurl='URL IMAGEN 5' /></a>       </div> <div id="previous"><b>Anterior</b></div> <div id="next"><b>Siguiente</b></div> <div id="buttons">          <div id="b1"><b>1</b></div>          <div id="b2"><b>2</b></div>          <div id="b3"><b>3</b></div>          <div id="b4"><b>4</b></div>          <div id="b5"><b>5</b></div> </div> </script> 

<script type="text/javascript" src="http://cssplantillas.co.cc/up/files/a_ligthbox.js"></script> <style type="text/css"> #lightbox{background-color:#eee;padding: 10px;font-family:verdana; border-bottom: 2px solid #666;border-right: 2px solid #666;} #lightboxDetails{font-size:0.8em;padding-top:0.4em;}    #lightboxCaption{float:left;} #keyboardMsg{float:right;} #closeButton{top:5px;right:5px;} #lightbox img{border:none;clear: both;}  #overlay img{border:none;} #overlay{background-image: url(http://cssplantillas.netau.net/ap/archivos/542e10db84.png); } * html #overlay{background-color: #333;background-color: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="overlay.png", sizingMethod="scale");} </style> <!-- Editar solo esto --> <a href="URL DE LA IMAGEN GRANDE" _fcksavedurl="URL DE LA IMAGEN GRANDE" rel="lightbox" title="COMENTARIO DE LA IMAGEN"> <img src="URL DE LA IMAGEN PEQUEÑA" _fcksavedurl="URL DE LA IMAGEN PEQUEÑA" /></a>

<style type="text/css"> #simplegallery1{position: relative;visibility: hidden;border: 4px solid #383838;} #simplegallery1 .gallerydesctext{text-align: center;padding: 2px 5px;font:12px verdana;} </style> <script type="text/javascript" src="http://cssplantillas.netau.net/ap/files/jquery-1.2.6.pack.js"></script> <script type="text/javascript" src="http://cssplantillas.netau.net/ap/files/simplegallery.js">
</script> <script type="text/javascript">
var mygallery=new simpleGallery({
wrapperid: "simplegallery1",
dimensions: [500, 375],
imagearray: [
["URL DE TU IMAGEN", "LINK'S DE LA IMAGEN", "", "COMENTARIO DE LA IMAGEN"],
["URL DE TU IMAGEN", "LINK'S DE LA IMAGEN", "", "COMENTARIO DE LA IMAGEN"],
["URL DE TU IMAGEN", "LINK'S DE LA IMAGEN", "", "COMENTARIO DE LA IMAGEN"]
],
autoplay: [true, 2500, 2],
persist: false,
fadeduration: 500,
oninit:function(){
},
onslide:function(curslide, i){
}
})
</script> <div id="simplegallery1"></div>