光线CMS系统，如何显示幻灯片，有一些朋友用的是光线CMS系统，会发现后台的幻灯片添加了，出不来，那我的站也是这样的，我就自己制作了一个幻灯片效果今天特别分享出来给大家。先看看我的效果：
红色部分就是我制作的幻灯片部分，这个图片只是我测试的图片。
先下载资源包，[点击这里下载资源包]，然后解压。
幻灯片的大小是800x280.
将to_template_floder文件夹中的所有文件复制到模板文件夹中（我的是在templete/Default目录下），将jquery.js复制到/views/js/目录下覆盖。
然后将以下代码复制到模板文件夹下/Home/index.html 中的适当位置。例如<include file="header" />代码之后：
<!--slide-->
<link rel="stylesheet" type="text/css" href="{$tplpath}slide.css" />
<script src="{$tplpath}slide.js"></script>
<script>
$(function(){
$('#slides').slides({
preload: true,
preloadImage: '{$tplpath}images/loading.gif',
play: 5000,
pause: 2500,
hoverPause: true,
animationStart: function(current){
$('.caption').animate({
bottom:-35
},100);
if (window.console && console.log) {
// example return of current slide number
console.log('animationStart on slide: ', current);
};
},
animationComplete: function(current){
$('.caption').animate({
bottom:0
},200);
if (window.console && console.log) {
// example return of current slide number
console.log('animationComplete on slide: ', current);
};
},
slidesLoaded: function() {
$('.caption').animate({
bottom:0
},200);
}
});
});
</script>
<div class="box" style="background:#e5e5e5;">
<div id="container">
<div id="example">
<img src="{$tplpath}images/new-ribbon.png" width="112" height="112" id="ribbon">
<div id="slides">
<div class="slides_container">
<gxcms name="slide" limit="4" order="oid asc">
<div class="slide">
<a href="{$slide.link}" title="{$slide.title}" target="_blank"><img src="{$slide.picurl}" alt="{$slide.title}"></a>
<div class="caption" style="bottom:0">
<p><span class="slide_title">{$slide.title}</span>{$slide.content|get_replace_html=0,100}</p>
</div>
</div>
</gxcms>
</div>
<a href="#" class="prev"><img src="{$tplpath}images/arrow-prev.png" width="24" height="42" alt="Arrow Prev"></a>
<a href="#" class="next"><img src="{$tplpath}images/arrow-next.png" width="24" height="42" alt="Arrow Next"></a>
</div>
<img src="{$tplpath}images/frame.png" width="900" height="330" alt="Example Frame" id="frame">
</div>
</div>
</div>
<!--end.slide-->
这样就行了，DEMO演示站点击[健身舞]查看。