zen-cart网站,模版,采集,二次开发

首页 » ZenCart » ZenCart教程 » 阅读文章

ZenCart产品页多图片展示效果

2011-07-23 11:41 261748 56 发表评论
标签:


这里介绍的zencart产品多图展示效果,就是利用lightbox,jqzoom,然后调整css来实现图片放大镜,多图切换,图片lightbox弹出层效果。

效果图一、

效果图二、

下载

安装方法:

1.(更正)默认模板classic改名为你自己的模板名,(ps:压缩包中忘记将classic改为YOUR_TEMPLATE了)

2.后台导入install_JQLightBox.sql和install_JQZoom.sql

3.后台开启lightbox和zoom

4.includes\templates\YOUR_TEMPLATE\templates\tpl_product_info_display.php删除原主图和细节图显示的代码,然后适当位置加入tpl_product_info_display_ADD.php内容。

5.以下添加到css

.pimages{
border: 1px solid #D9D9D9;
width:350px;
padding:2px;
}
.pimages p{
text-align:center;
}
.additionalImages{
border: 1px solid #D9D9D9;
padding:2px;
margin:0 2px;}
相关日志:

评论 共56条 (RSS 2.0) 发表评论

  1. xiami 说道:

    老大,安装上面装了,可是都没有反应啊,能否具体告诉我一下呢,,

  2. xiami 说道:

    谢谢啊,,我再试试,,

  3. seo=ceo 说道:

    老大 跟你上面第一幅图的效果一样 下面的小图怎么让他排成一行呢 有没有插件实现呢!!

    • E-zencart 说道:

      排成一行是css控制的,后台把细节图每行显示个数调大,然后css控制,安装包里我都调整好了的

      • seo=ceo 说道:

        十分谢谢!!

      • 瘦脸 说道:

        4.includes\templates\YOUR_TEMPLATE\templates\tpl_product_info_display.php删除原主图和细节图显示的代码,然后适当位置加入tpl_product_info_display_ADD.php内容。

        这个适当位置在哪里?

        我的模板显示图片的是:

        get_template_dir(‘/tpl_modules_main_product_image.php’,DIR_WS_TEMPLATE, $current_page_base,’templates’). ‘/tpl_modules_main_product_image.php’);
        ?>

        那个怎么加阿?

        • E-zencart 说道:

          适当位置,就是你随便加,然后前台看效果,位置不满意在移动。

  4. 说道:

    不能切换图片???是什么原因??

  5. linyame 说道:

    提示语法错误,怎么办

  6. linyame 说道:

    急死我了啦。

  7. linyame 说道:

    谢谢,可以了。
    跟原来自带的冲突了。

  8. lsj 说道:

    安装了主图可以放大,但是图片不能切换,怎样调整css来实现多图切换?

    • E-zencart 说道:

      后台开启lightbox和zoom后,图片的切换,是鼠标放在要显示的图片上实现的,放在要显示的图片上时,此图会切换到中图的位置上

  9. shorgan 说道:

    用倒是能用 不过产品图片变形了 要怎么修改??

    • E-zencart 说道:

      图片变形是由于设置的宽高不是按比例缩放的造成的,检查下css只设置宽或高的大小

  10. xiaokun 说道:

    楼主,你好,这个插件我装好了,可以用,效果也非常不错的,首先非常感谢楼主提供的这款插件。
    现在,我想修改个功能:图片切换的时候不要进行主图与小图的切换,而是所有的图片在下面显示,当鼠标移到那个图片上,就显示哪个图片,麻烦楼主指点怎么修改,非常感谢!!!

    • E-zencart 说道:

      去懒人图库之类的网站找类似的代码,整合到zencart里喽

      • xiaokun 说道:

        我去懒人图库找了的,貌似没找到相关的JS代码,有劳楼主帮忙一下,找到链接给我一下,非常感谢

  11. xiaokun 说道:

    我就是想在你这个插件的基础上修改的,切换的功能是通过什么原理实现的,具体的代码在哪边,我想修改的,但是代码找不到 :razz:

  12. sekindy 说道:

    :cry: 装上去很顺利,效果也能显示,但是跟支付页面有冲突了,选择运费后,总价格不能自动调整,提交付款后不跳转到支付页面,为什么呀

  13. sunny 说道:

    为什么我主图跟多图不能切换?

    • E-zencart 说道:

      在全新zencart上调试,排除你自己的模板问题。在检查js是否全部加载了,加载的顺序

  14. css 说道:

    5.以下添加到css

    查看源代码打印帮助1 .pimages{

    2 border: 1px solid #D9D9D9;

    3 width:350px;

    4 padding:2px;

    5 }

    6 .pimages p{

    7 text-align:center;

    8 }

    9 .additionalImages{

    10 border: 1px solid #D9D9D9;

    11 padding:2px;

    12 margin:0 2px;}
    楼主这个CSS加到哪里?我是菜鸟,麻烦详细一点,谢谢了~!

    • css 说道:

      楼主不用了,我已经弄好了,只是图片都要上传到/image 目录下,上传目录选择:main directory,这样才能正常显示,非常感谢楼主!

      • css 说道:

        好像上传图片的默认目录是large, :?: :?: :?:

        • E-zencart 说道:

          可以看到这里http://www.ezencart.com/pages/589.html 看看,图片调用的原理,由于这个里要实现大中小图的切换,所有3份图片必须都有。

  15. css 说道:

    这个不适用于zencart1.3.9插件版吧?

    • E-zencart 说道:

      中文插件版没有测试,应该也是可以的。

      • css 说道:

        中文插件版的Lite系列模板测试了不行,没有插件版的原始模板测试可以用,不知楼主是否能制作一个插件版的模块? :???:

        • E-zencart 说道:

          你可以找类似效果,集成到zencart,这种js效果网上还是比较多的。

          • css 说道:

            楼主你好!请问首页header_bg.jpg 这个图片下面的空白怎么去掉?我在css里面找了半天都找不到在哪里修改

  16. abc 说道:

    这个插件如果加上细节图滚动插件时,lihgtbox会显示重复的细节图,就是原本5张细节图,Lihgtbox会显示10张图,请问楼主这个怎么修改呢?

  17. 123q1q1q 说道:

    老大好,这个插件很好用,
    1)好像本身集成了 CJloader的功能,在html_header.php吧?
    2)但是,当我要再装个 fast and easy checkout 时,要预先需要装个 CJLOADER 模块, 这下就有冲突了。
    问题出现于,我装了jqlight + jqzoom + 新装的cjloader,
    在 html_header.php,中
    原先的 有cjloader 功能的语句
    那新的 这个语句 还要吗?

    感觉要的话 ,就会出现 产品详细页的大图 鼠标第一次挪到大图上的话 放大出来的将是一闪的图片,再即变成空白的了, 挪出来再挪上去,就好好的

    这该怎么办?

    • E-zencart 说道:

      装fast and easy checkout时,不装CJLOADER 模块试试看能不能拿共用喽

  18. kale888 说道:

    老大我安装完成 怎么后台没有显示 让我开启的lightbox和zoom 啊,还有我下载下来的文件,没有哪个文件的名字是.YOUR_TEMPLATE 可让我改的, 倒是有classic 的文件夹。

  19. yahoogoogle 说道:

    楼主~鼠标移动到细节图他会自动更换主图。我想静止掉细节图这样的功能。请问在哪个文件修改?如何修改?

  20. polly 说道:

    你好,为什么我安装的有问题呢? 就是点击页面进去,鼠标移到主图上可实现放大,但我要切换细节图的时候,他就一直在加载,显示不出来,非得手动刷新才能正常,像我这种情况是什么原因造成的呢? :?: 求帮忙,谢谢先

  21. polly 说道:

    就是主图和细节图可正常切换,但鼠标移上去就是不能放大,没反应,点击的话就一直在加载。。。

  22. polly 说道:

    我刚又试了下,发现点击页面进去,鼠标移到主图的时候是现实空白的,然后主图和细节图切换下后,只能放大主图,细节图都不能放大?不知是什么原因

    • E-zencart 说道:

      (更正)默认模板classic改名为你自己的模板名,(ps:压缩包中忘记将classic改为YOUR_TEMPLATE了)
      用默认模板测试成功,你先排除你自己模板的问题,图片大中小图齐全,测试

  23. polly 说道:

    你好,我刚刚试了下,默认模版也是正常的,我觉得不是模板的问题,好像是根目录inages那个文件夹下的问题,我想问我的产品图片要怎么放啊?或者命名有什么要求,我目前的命名是这样的:001.jpg, 001_1.jpg, 001_2.jpg

    • E-zencart 说道:

      默认模板是正常的,说明插件时没问题了,剩下就要从自己的网站上着原因了

  24. momo 说道:

    大神,我的安装上去了,但是在弹出的大图中,一直点击,点到最后一张的时候会跳转到主页去,不会留在当前的页面上 这个是什么原因呀?

    • E-zencart 说道:

      测试了,大图到最后一张,在点击右边的时候,是关闭弹出层的,没有跳转

  25. momomo 说道:

    后台开启lightbox和zoom ? 这个是哪儿开启呀,我找不到

  26. paullee 说道:

    什么时候开发1.5版本的

发表评论

  • 
  • 插入代码

联系我 Contact Me

回到页首