
在magento的首页往往有如上图的图片切换效果,英文叫“silder show”或者“gallery”,中文可能叫“画廊”“图片切换”。今天我们来给magento的首页添加一个基于jquery的silder。过程如下,代码包在文章最后面下载。
此silder show来自:www.hellothemes.com 的hellomini模板
1.将代码包解压缩,将silder文件夹上传至:skin/frontend/default/你的模板文件夹/ 。图片在silder/images文件中,如果要换成别的图,请将其替换掉。
2.由于要在magento中使用jquery,考虑到js的兼容,所以本silder show的jquery js加载要放在prototype的前面,打开你的模板文件:app/design/frontend/default/你的模板文件夹/template/page/html/head.phtml 找到 <?php echo $this->getCssJsHtml() ?> 在其上面添加如下代码(注意:是在它的上面一行添加),然后保存。
<script type="text/javascript" src="<?php echo $this->getSkinUrl('silder/js/jquery.js') ?>" ></script> <script type="text/javascript" src="<?php echo $this->getSkinUrl('silder/js/slider.js') ?>" ></script> <script type="text/javascript"> jQuery(document).ready(function(){ jQuery("#slider").easySlider({ auto: true, continuous: true }); }); </script>