Ecshop放大镜插件说明
附送修改的文件goods.dwt和goods_gallery1.lbi以及放大镜效果JS和CSS文件，对应位置都放好了,仅作参考，可以自行修改！不要直接覆盖你得网站模板，放大镜效果要根据你自己的网站模版进行修改的！！ecshop商品属性使用图片替换功能，支持颜色等任何属性替换成图片
Ecshop放大镜插件安装教程
1、将“直接替换的程序”里面的文件传到你网站相对应的目录下。
直接替换的程序包括文件：
admin/product_spec_pic.php admin/templates/product_spec_pic.htm admin/templates/product_spec_pic_info.htm admin/images/guigou_icon.png js/jscolor/arrow.gif js/jscolor/cross.gif js/jscolor/demo.html js/jscolor/hs.png js/jscolor/hv.png js/jscolor/jscolor.js languages/en_us/admin/product_spec_pic.php languages/zh_cn/admin/product_spec_pic.php languages/zh_tw/admin/product_spec_pic.php
2、将images文件夹传到你网站的模板文件夹下。以默认模板为例，就是传到themes/default文件夹下。这个要根据你现在使用的是哪套模板，就传到那个文件夹。当然也可以全部模板文件都放上。
3、打开admin/templates/goods_list.htm文件
找到：（大约在54行）
{if $specifications[$goods.goods_type] neq ''}<a href="goods.php?act=product_list&goods_id={$goods.goods_id}" title="{$lang.item_list}"><img src="images/icon_docs.gif" width="16" height="16" border="0" /></a>{else}<img src="images/empty.gif" width="16" height="16" border="0" />{/if}在它下面添加一行代码：
{if $specifications[$goods.goods_type] neq ''}<a href="product_spec_pic.php?act=list&goods_id={$goods.goods_id}" title="{$lang.specification_pic}"><img src="images/guigou_icon.png" width="16" height="16" border="0" /></a>{else}<img src="images/empty.gif" width="16" height="16" border="0" />{/if}4、打开根目录下includes/lib_goods.php文件
找到：
/**
* 获得商品的属性和规格
*
* @access public
* @param integer $goods_id
* @return array
*/
function get_goods_properties($goods_id)
{
/* 对属性进行重新排序和分组 */
$sql = "SELECT attr_group ".
"FROM " . $GLOBALS['ecs']->table('goods_type') . " AS gt, " . $GLOBALS['ecs']->table('goods') . " AS g ".
"WHERE g.goods_id='$goods_id' AND gt.cat_id=g.goods_type";
$grp = $GLOBALS['db']->getOne($sql);
if (!empty($grp))
{
$groups = explode("n", strtr($grp, "r", ''));
}
/* 获得商品的规格 */
$sql = "SELECT a.attr_id, a.attr_name, a.attr_group, a.is_linked, a.attr_type, ".
"g.goods_attr_id, g.attr_value, g.attr_price " .
'FROM ' . $GLOBALS['ecs']->table('goods_attr') . ' AS g ' .
'LEFT JOIN ' . $GLOBALS['ecs']->table('attribute') . ' AS a ON a.attr_id = g.attr_id ' .
"WHERE g.goods_id = '$goods_id' " .
'ORDER BY a.sort_order, g.attr_price, g.goods_attr_id';
$res = $GLOBALS['db']->getAll($sql);
$arr['pro'] = array(); // 属性
$arr['spe'] = array(); // 规格
$arr['lnk'] = array(); // 关联的属性
foreach ($res AS $row)
{
$row['attr_value'] = str_replace("n", '<br />', $row['attr_value']);
if ($row['attr_type'] == 0)
{
$group = (isset($groups[$row['attr_group']])) ? $groups[$row['attr_group']] : $GLOBALS['_LANG']['goods_attr'];
$arr['pro'][$group][$row['attr_id']]['name'] = $row['attr_name'];
$arr['pro'][$group][$row['attr_id']]['value'] = $row['attr_value'];
}
else
{
$arr['spe'][$row['attr_id']]['attr_type'] = $row['attr_type'];
$arr['spe'][$row['attr_id']]['name'] = $row['attr_name'];
$arr['spe'][$row['attr_id']]['values'][] = array(
'label' => $row['attr_value'],
'price' => $row['attr_price'],
'format_price' => price_format(abs($row['attr_price']), false),
'id' => $row['goods_attr_id']);
}
if ($row['is_linked'] == 1)
{
/* 如果该属性需要关联，先保存下来 */
$arr['lnk'][$row['attr_id']]['name'] = $row['attr_name'];
$arr['lnk'][$row['attr_id']]['value'] = $row['attr_value'];
}
}
return $arr;
}
把它修改为：(这个要根据实际情况修改，请不要直接复制修改)
/**
* 获得商品的属性和规格
*
* @access public
* @param integer $goods_id
* @return array
*/
function get_goods_properties($goods_id)
{
/* 对属性进行重新排序和分组 */
$sql = "SELECT attr_group ".
"FROM " . $GLOBALS['ecs']->table('goods_type') . " AS gt, " . $GLOBALS['ecs']->table('goods') . " AS g ".
"WHERE g.goods_id='$goods_id' AND gt.cat_id=g.goods_type";
$grp = $GLOBALS['db']->getOne($sql);
if (!empty($grp))
{
$groups = explode("n", strtr($grp, "r", ''));
}
/* 获得商品的规格 */
$sql = "SELECT a.attr_id, a.attr_name, a.attr_group, a.is_linked, a.attr_type, ".
"g.goods_attr_id, g.attr_value, g.attr_price,g.thumb_url,g.img_url,g.img_original, hex_color " .
'FROM ' . $GLOBALS['ecs']->table('goods_attr') . ' AS g ' .
'LEFT JOIN ' . $GLOBALS['ecs']->table('attribute') . ' AS a ON a.attr_id = g.attr_id ' .
"WHERE g.goods_id = '$goods_id' " .
'ORDER BY a.sort_order, g.attr_price, g.goods_attr_id';
$res = $GLOBALS['db']->getAll($sql);
$arr['pro'] = array(); // 属性
$arr['spe'] = array(); // 规格
$arr['lnk'] = array(); // 关联的属性
foreach ($res AS $row)
{
$row['attr_value'] = str_replace("n", '<br />', $row['attr_value']);
if ($row['attr_type'] == 0)
{
$group = (isset($groups[$row['attr_group']])) ? $groups[$row['attr_group']] : $GLOBALS['_LANG']['goods_attr'];
$arr['pro'][$group][$row['attr_id']]['name'] = $row['attr_name'];
$arr['pro'][$group][$row['attr_id']]['value'] = $row['attr_value'];
}
else
{
$arr['spe'][$row['attr_id']]['attr_type'] = $row['attr_type'];
$arr['spe'][$row['attr_id']]['name'] = $row['attr_name'];
$arr['spe'][$row['attr_id']]['values'][] = array(
'label' => $row['attr_value'],
'price' => $row['attr_price'],
'img_url' => $row['img_url'],
'img_original' => $row['img_original'],
'thumb_url' => $row['thumb_url'],
'hex_color' => $row['hex_color'],
'format_price' => price_format(abs($row['attr_price']), false),
'id' => $row['goods_attr_id']);
}
if ($row['is_linked'] == 1)
{
/* 如果该属性需要关联，先保存下来 */
$arr['lnk'][$row['attr_id']]['name'] = $row['attr_name'];
$arr['lnk'][$row['attr_id']]['value'] = $row['attr_value'];
}
}
return $arr;
}5、关于模板themes/模板路径/goods.dwt修改
找到：
<!-- {* 开始循环所有可选属性 *} -->
<!-- {* 结束循环可选属性 *} -->将这两个注释的之间代码改成如下：
<!-- {* 开始循环所有可选属性 *} -->
<script language="javascript">
function changeAtt(t,src,key)
{
document.getElementById('spec_value_'+src).checked='checked';
var itemObj = document.getElementById("catt_"+key);
var elems = itemObj.getElementsByTagName("a");
for (i = 0; i < elems.length; i ++ )
{
var prefix = elems[i].name.substr(0, 7);
if (prefix == 'spec_a_')
{
elems[i].className = '';
}
}
t.className = "cattsel";
changePrice();
}
</script>
<style type="text/css">
<!--
/*--------------颜色选择器CSS添加-------------*/
.propertySelect{padding:10px 0 10px 10px;}
.propertySelect strong{float:left;font-weight:normal;text-align:left;}
.propertySelect .catt{height:auto;overflow:hidden;}
.propertySelect .catt a{border:1px solid #C8C9CD;text-align:center;background-color:#FFFFFF;display:block;white-space:nowrap;color:#666666;text-decoration:none;float:left;margin-left:2px;margin-right:2px;position:relative;}
.propertySelect .catt a p{border:1px solid #FFFFFF;padding:2px 5px;background-color:#FFFFFF;}
.propertySelect .catt a p.padd{padding:0px;}
.propertySelect .catt a:hover{border:1px solid #FF6701;}
.propertySelect .catt a:hover p{border:1px solid #FF6701;}
.propertySelect .catt a:focus{outline-style:none;}
.propertySelect .catt .cattsel{background:#FF6701;border:1px solid #FF6701;}
.propertySelect .catt .cattsel a:hover{border:1px solid #FF6701;}
.propertySelect .catt .cattsel p{border:1px solid #FF6701;}
.propertySelect .catt em{font-style:normal;}
.propertySelect .catt .cattsel i{background:url(images/test.png) no-repeat scroll right bottom transparent;bottom:0;height:16px;position:absolute;right:0;width:16px;}
.propertySelect .catt .cattsel a:hover i{background:url(images/test.png) no-repeat scroll right bottom transparent;}
-->
</style>
{if $specification}
<div class="propertySelect clearfix" id="propertySelect">
<!-- {foreach from=$specification item=spec key=spec_key} -->
<strong>{$spec.name}：</strong>
<div class="catt" id="catt_{$spec_key}">
<!-- {* 判断属性是复选还是单选 *} -->
<!-- {if $spec.attr_type eq 1} -->
<!-- {if $cfg.goodsattr_style eq 1} -->
<!-- {foreach from=$spec.values item=value key=key} -->
<a class='hover {if $key eq 0}cattsel{/if}{if $value.thumb_url} colorImg{/if}' {if $value.thumb_url} href="{$value.img_original}" rev={$value.img_original} rel=goodsPic {else}href="javascript:"{/if} title="{$value.label}" style="cursor:pointer" name="spec_a_{$value.id}" onclick="changeAtt(this,{$value.id},{$spec_key})">
<p {if $value.thumb_url}class="padd"{elseif $value.hex_color neq ''}style="background:#{$value.hex_color}; height:45px; width:45px"{/if}>
{if $value.thumb_url}
<img src="{$value.thumb_url}" width="50" height="50" alt="{$value.label}">
{elseif $value.hex_color}
{else}
<em>{$value.label}</em>
{/if}
<i></i>
</p>
<input style="display:none" id="spec_value_{$value.id}" type="radio" name="spec_{$spec_key}" value="{$value.id}" {if $key eq 0}checked{/if} />
</a>
<!-- {/foreach} -->
<input type="hidden" name="spec_list" value="{$key}" />
<!-- {else} -->
<select name="spec_{$spec_key}">
<!-- {foreach from=$spec.values item=value key=key} -->
<option label="{$value.label}" value="{$value.id}">{$value.label} {if $value.price gt 0}{$lang.plus}{elseif $value.price lt 0}{$lang.minus}{/if}{if $value.price neq 0}{$value.format_price}{/if}</option>
<!-- {/foreach} -->
</select>
<input type="hidden" name="spec_list" value="{$key}" />
<!-- {/if} -->
<!-- {else} -->
<!-- {foreach from=$spec.values item=value key=key} -->
<label for="spec_value_{$value.id}">
<input type="checkbox" name="spec_{$spec_key}" value="{$value.id}" id="spec_value_{$value.id}" onclick="changePrice()" />
{$value.label} [{if $value.price gt 0}{$lang.plus}{elseif $value.price lt 0}{$lang.minus}{/if} {$value.format_price|abs}] </label>
<br />
<!-- {/foreach} -->
<input type="hidden" name="spec_list" value="{$key}" />
<!-- {/if} -->
</div>
<div class="blank"></div>
<!-- {/foreach} -->
</div>
{/if}
<!-- {* 结束循环可选属性 *} -->6、在后台数据库管理->sql查询处执行以下语句（全部一次性）:
请将ecs_改成你的网站数据库扩展名,如果你的数据扩展名已经是ecs_了，那就不用改了。
Alter table ecs_goods_attr add column thumb_url varchar(50) not null default ''; Alter table ecs_goods_attr add column img_url varchar(50) not null default ''; Alter table ecs_goods_attr add column img_original varchar(50) not null default ''; Alter table ecs_goods_attr add column hex_color varchar(50) not null default ''; ALTER TABLE `ecs_goods_attr` CHANGE `img_url` `img_url` VARCHAR( 80 ) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL , CHANGE `img_original` `img_original` VARCHAR( 80 ) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL , CHANGE `hex_color` `hex_color` VARCHAR( 80 ) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL; ALTER TABLE `ecs_goods_attr` CHANGE `thumb_url` `thumb_url` VARCHAR( 255 ) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL;
7、data目录下建一个category目录
8、根据需要修改您的模版商品详情页实现放大镜效果，见附送的放大镜效果实现示例。
相关专题
- Images Tool v3.0在线图片视频编辑源码 [2022-08-15]
- 织梦CMS站长图片素材下载站模板 [2022-03-31]
- 图片相册社区类型小程序模板 [2022-01-06]
- 帝国CMS7.5仿千图网图片素材下载模板升级版 [2021-11-30]
- Images Tool v3.0多功能在线图片编辑器模板源码 [2021-10-29]
