网站开发 · 2025年4月23日

ECSHOP商品页加入购物车弹出仿淘宝效果

 在ECSHOP商品详情页点“加入购物车”,直接在当前页弹出一个漂亮的小窗口,

效果如下图:
ECSHOP商品页加入购物车弹出仿淘宝效果插图
此方法超级简单,不需要修改php程序,也不需要在ECSHOP模板页预设隐藏层,主要是修改 JS 文件 


1)

首先将下面四个图片下载到你网站的 /data/images/  下面

ECSHOP商品页加入购物车弹出仿淘宝效果插图1
ECSHOP商品页加入购物车弹出仿淘宝效果插图2

ECSHOP商品页加入购物车弹出仿淘宝效果插图3

ECSHOP商品页加入购物车弹出仿淘宝效果插图4

2)

以下修改以官方默认模板为例,打开 ECSHOP模板文件 /themes/default/goods.dwt 

<li class=”padd”>
      <a href=”javascript:addToCart({$goods.goods_id})”><img src=”images/bnt_cat.gif” /></a>

修改为

<li class=”padd” style=”position:relative;” id=”gwc”>
      <a href=”javascript:addToCart({$goods.goods_id})”><img src=”images/bnt_cat.gif” /></a> 

3)

下面修改ECSHOP语言包文件,打开 /languages/zh_cn/common.php 

找到

$_LANG[‘cart_info’]

将它的值修改为 
 

购物车共 %d 件商品,总计 %s

修改后是这个样子

$_LANG[‘cart_info’] = ‘购物车共 %d 件商品,总计 %s’;

4)

打开 /js/common.js 

找到 下图所示代码

 103          case ‘1’ :

 104            if (confirm(result.message)) location.href = cart_url;

 105            break;

 106          case ‘2’ :

 107            if (!confirm(result.message)) location.href = cart_url;

 108            break;

 109          case ‘3’ :

 110            location.href = cart_url;

 103          case ‘1’ :

 104            // if (confirm(result.message)) location.href = cart_url;

              openDIV_eshop(result.content);

 105            break;

 106          case ‘2’ :

 107           // if (!confirm(result.message)) location.href = cart_url;

              openDIV_eshop(result.content);

 108            break;

 109          case ‘3’ :

 110          //  location.href = cart_url;

              openDIV_eshop(result.content);