ECSHOP在线手册布局参考图--积分商城 exchange_list.dwt
A.购物车
1,设置方法
- 程序自动读取购物车的商品数量
2,代码相关
cart.lbi 中
{insert_scripts files='transport.js'}
<div class="cart" id="ECS_CARTINFO">
{insert name='cart_info'}
</div>
<div class="blank5"></div>
3,相关css
style.css 中 /*购物车*/
.cart{background:url(images/catBg.gif) no-repeat left top; padding:15px 10px 15px 50px;
color:#006bcd; height:50px; _padding:12px 10px 15px 50px;
}
.cart a{color:#006bcd; text-decoration:none;}
.cart a:hover{color:#006bcd; text-decoration:underline;}
B.商品分类树
1,设置方法
- 可以在后台
商店管理-商品分类
- 里修改
- 详细教程：http://www.ecmoban.com/article-1688.html
2,代码相关
category_tree.lbi 中
<div class="box">
<div class="box_1">
<div id="category_tree">
<!--{foreach from=$categories item=cat}-->
<dl>
<dt><a href="{$cat.url}">{$cat.name|escape:html}</a></dt>
<!--{foreach from=$cat.cat_id item=child}-->
<dd><a href="{$child.url}">{$child.name|escape:html}</a></dd>
<!--{foreach from=$child.cat_id item=childer}-->
<dd> <a href="{$childer.url}">{$childer.name|escape:html}</a></dd>
<!--{/foreach}-->
<!--{/foreach}-->
</dl>
<!--{/foreach}-->
</div>
</div>
</div>
<div class="blank5"></div>
3,相关css
style.css 中 /*商品分类*/
#category_tree{border:4px solid #f1faff; background-color:#fff;}
#category_tree dl{margin:6px;}
#category_tree dt{background:url(images/lineBg.gif) repeat-x left bottom;
color:#3f3f3f; padding:2px 0 3px 12px;
}
#category_tree dt a{background:url(images/bg.gif) no-repeat 0 -69px;
color:#3f3f3f; padding-left:15px; text-decoration:none;
}
#category_tree dd{padding:3px 0 3px 10px;}
#category_tree dd a{color:#404040; text-decoration:none;}
#category_tree dd a:hover{color:#ff6600; text-decoration:none;}
C.热卖商品区
1,设置方法
- 在后台
促销管理 - 积分商城商品
- 里加商品的时候勾选“热销”
2,代码相关
exchange_hot.lbi 中
<!-- {if $hot_goods}-->
<div class="box">
<div class="box_2 centerPadd">
<div class="itemTit Hot" id="itemHot"></div>
<div id="show_hot_area" class="clearfix goodsBox">
<!--{foreach from=$hot_goods item=goods}-->
<div class="goodsItem">
<span class="hot"></span>
<a href="{$goods.url}"><img src="{$goods.thumb}" alt="{$goods.name|escape:html}" class="goodsimg" /></a><br />
<p><a href="{$goods.url}" title="{$goods.name|escape:html}">{$goods.short_style_name}</a></p>
{$lang.exchange_integral}<font class="f1">{$goods.exchange_integral}</font>
</div>
<!--{/foreach}-->
</div>
</div>
</div>
<div class="blank5"></div>
<!-- {/if} -->
3,相关css
style.css 中 /*精品推荐，新品上市，热卖商品*/
.centerPadd{padding:5px 8px 8px 8px; overflow:hidden;}
.itemTit{height:30px; background:url(images/bg.gif) no-repeat 0px -195px; padding-left:190px; text-align:right;
/*margin-bottom:-3px; _margin-bottom:-2px;*/
}
.itemTit.Hot{background:url(images/bg.gif) no-repeat 0px -256px;}
.centerPadd .goodsBox{border:1px solid #d6ecff; background:#fff; padding:12px 0px 0px 17px; *padding:12px 0px 0px 17px;
_padding:12px 0px 0px 0px;}
.centerPadd .goodsBox .more{text-align:right; clear:both; margin:0 8px 8px 0;}
/*单个商品*/
.goodsItem{width:110px; float:left; position:relative; overflow:hidden; margin:0px 14px 15px 14px;}
.goodsItem .goodsimg{width:100px; height:100px; border:4px solid #eef8ff; margin-bottom:4px;}
.goodsItem img{width:52px; height:17px;}
.goodsItem p{text-align:left; color:#3f3f3f;}
.goodsItem p a{color:#3f3f3f; text-decoration:none;}
.goodsItem p a:hover{color:#ff6600; text-decoration:none;}
.goodsItem span{width:40px; height:40px; position:absolute;left:0px; top:0px;}
.goodsItem span.best{background:url(images/bg.gif) no-repeat 0px -304px;}
.goodsItem span.news{background:url(images/bg.gif) no-repeat -75px -304px;}
.goodsItem span.hot{background:url(images/bg.gif) no-repeat -161px -304px;}
D.积分商城商品
1,设置方法
- 在后台
促销管理 - 积分商城商品
- 里添加商品即可
2,代码相关
exchange_list.lbi 中 <div class="box">
<div class="box_1">
<h3>
<span>{$lang.goods_list}</span>
<form method="GET" class="sort" name="listform">
{$lang.btn_display}：
<a href="javascript:;" onClick="javascript:display_mode('list')"><img src="data:images/display_mode_list<!-- {if $pager.display == 'list'} -->_act<!-- {/if} -->.gif" alt="{$lang.display.list}"></a>
<a href="javascript:;" onClick="javascript:display_mode('grid')"><img src="data:images/display_mode_grid<!-- {if $pager.display == 'grid'} -->_act<!-- {/if} -->.gif" alt="{$lang.display.grid}"></a>
<a href="javascript:;" onClick="javascript:display_mode('text')"><img src="data:images/display_mode_text<!-- {if $pager.display == 'text'} -->_act<!-- {/if} -->.gif" alt="{$lang.display.text}"></a>
<select name="sort" style="border:1px solid #ccc;">
{html_options options=$lang.exchange_sort selected=$pager.sort}
</select>
<select name="order" style="border:1px solid #ccc;">
{html_options options=$lang.order selected=$pager.order}
</select>
<input type="image" name="imageField" src="../images/bnt_go.gif" alt="go"/>
<input type="hidden" name="category" value="{$category}" />
<input type="hidden" name="display" value="{$pager.display}" id="display" />
<input type="hidden" name="integral_min" value="{$integral_min}" />
<input type="hidden" name="integral_max" value="{$integral_max}" />
<input type="hidden" name="page" value="{$pager.page}" />
</form>
</h3>
<form name="compareForm" method="post">
<!-- {if $pager.display == 'list'} -->
<div class="goodsList">
<!--{foreach name=goods_list from=$goods_list item=goods}-->
<ul class="clearfix bgcolor"<!--{if $smarty.foreach.goods_list.index mod 2 eq 0}-->id=""<!--{else}-->id="bgcolor"<!--{/if}-->>
<li class="thumb"><a href="{$goods.url}"><img src="{$goods.goods_thumb}" alt="{$goods.goods_name}" /></a></li>
<li class="goodsName">
<a href="{$goods.url}" class="f6">
<!-- {if $goods.goods_style_name} -->
{$goods.goods_style_name}<br />
<!-- {else} -->
{$goods.goods_name}<br />
<!-- {/if} -->
</a>
<!-- {if $goods.goods_brief} -->
{$lang.goods_brief}{$goods.goods_brief}<br />
<!-- {/if} -->
</li>
<li>
{$lang.exchange_integral}<font class="shop_s">{$goods.exchange_integral}</font>
</li>
</ul>
<!--{/foreach}-->
</div>
<!-- {elseif $pager.display == 'grid'} -->
<div class="centerPadd">
<div class="clearfix goodsBox" style="border:none;">
<!--{foreach from=$goods_list item=goods}-->
<!-- {if $goods.goods_id} -->
<div class="goodsItem">
<a href="{$goods.url}"><img src="{$goods.goods_thumb}" alt="{$goods.goods_name}" class="goodsimg" /></a><br />
<p><a href="{$goods.url}" title="{$goods.name|escape:html}">{$goods.goods_name}</a></p>
{$lang.exchange_integral}<font class="shop_s">{$goods.exchange_integral}</font><br />
</div>
<!--{/if}-->
<!--{/foreach}-->
</div>
</div>
<!-- {elseif $pager.display == 'text'} -->
<div class="goodsList">
<!--{foreach from=$goods_list item=goods}-->
<ul class="clearfix bgcolor" <!--{if $smarty.foreach.goods_list.index mod 2 eq 0}-->id=""<!--{else}-->id="bgcolor"<!--{/if}-->>
<li class="goodsName">
<a href="{$goods.url}" class="f6 f5">
<!-- {if $goods.goods_style_name} -->
{$goods.goods_style_name}<br />
<!-- {else} -->
{$goods.goods_name}<br />
<!-- {/if} -->
</a>
<!-- {if $goods.goods_brief} -->
{$lang.goods_brief}{$goods.goods_brief}<br />
<!-- {/if} -->
</li>
<li>
{$lang.exchange_integral}<font class="shop_s">{$goods.exchange_integral}</font>
</li>
</ul>
<!--{/foreach}-->
</div>
<!-- {/if} -->
</form>
</div>
</div>
<div class="blank5"></div>
<script type="text/javascript">
window.onload = function()
{
Compare.init();
fixpng();
}
var button_compare = '';
</script>
3,相关css
style.css 中 .centerPadd .goodsBox{border:1px solid #d6ecff; background:#fff; padding:12px 0px 0px 17px; *padding:12px 0px 0px 17px;
_padding:12px 0px 0px 0px;}
.centerPadd .goodsBox .more{text-align:right; clear:both; margin:0 8px 8px 0;}
/*单个商品*/
.goodsItem{width:110px; float:left; position:relative; overflow:hidden; margin:0px 14px 15px 14px;}
.goodsItem .goodsimg{width:100px; height:100px; border:4px solid #eef8ff; margin-bottom:4px;}
.goodsItem img{width:52px; height:17px;}
.goodsItem p{text-align:left; color:#3f3f3f;}
.goodsItem p a{color:#3f3f3f; text-decoration:none;}
.goodsItem p a:hover{color:#ff6600; text-decoration:none;}
.goodsItem span{width:40px; height:40px; position:absolute;left:0px; top:0px;}
.goodsItem span.best{background:url(images/bg.gif) no-repeat 0px -304px;}
.goodsItem span.news{background:url(images/bg.gif) no-repeat -75px -304px;}
.goodsItem span.hot{background:url(images/bg.gif) no-repeat -161px -304px;}
/*商品列表显示方式*/
.goodsList{ padding:10px 10px 0 10px;}
.goodsList ul{ margin-bottom:10px;}
.goodsList ul#bgcolor{background:#fbfbfb; border-top:1px dashed #e8e8e8; border-bottom:1px dashed #e8e8e8;}
.goodsList li{float:left; padding-top:8px;}
.goodsList li.thumb{width:80px; text-align:center;}
.goodsList li.thumb img{width:50px; height:50px; border:1px solid #ccc; padding:1px;}
.goodsList li.goodsName{width:290px; margin-right:10px;}
.goodsList li.action{float:right; margin-left:10px;}
.goodsList li.action a.abg{background:url(images/bg.gif) no-repeat 0px -735px; padding-left:18px; position:relative; bottom:5px;}
E.页码区
1,设置方法
- 程序自带的分页效果,样式有两种,可以在后台
商店设置-显示设置
- 里选择
2,代码相关
pages.lbi 中
<!--翻页 start-->
<form name="selectPageForm" action="{$smarty.server.PHP_SELF}" method="get">
<!-- {if $pager.styleid eq 0 } -->
<div id="pager">
{$lang.pager_1}{$pager.record_count}{$lang.pager_2}{$lang.pager_3}{$pager.page_count}{$lang.pager_4} <span> <a href="{$pager.page_first}">{$lang.page_first}</a> <a href="{$pager.page_prev}">{$lang.page_prev}</a> <a href="{$pager.page_next}">{$lang.page_next}</a> <a href="{$pager.page_last}">{$lang.page_last}</a> </span>
<!--{foreach from=$pager.search key=key item=item}-->
{if $key eq 'keywords'}
<input type="hidden" name="{$key}" value="{$item|escape:decode_url}" />
{else}
<input type="hidden" name="{$key}" value="{$item}" />
{/if}
<!--{/foreach}-->
<select name="page" id="page" onchange="selectPage(this)">
{html_options options=$pager.array selected=$pager.page}
</select>
</div>
<!--{else}-->
<!--翻页 start-->
<div id="pager" class="pagebar">
<span class="f_l f6" style="margin-right:10px;">{$lang.pager_1}<b>{$pager.record_count}</b> {$lang.pager_2}</span>
<!-- {if $pager.page_first} --><a href="{$pager.page_first}">{$lang.page_first} ...</a><!-- {/if} -->
<!-- {if $pager.page_prev} --><a class="prev" href="{$pager.page_prev}">{$lang.page_prev}</a><!-- {/if} -->
<!-- {if $pager.page_count neq 1} -->
<!--{foreach from=$pager.page_number key=key item=item}-->
<!-- {if $pager.page eq $key} -->
<span class="page_now">{$key}</span>
<!-- {else} -->
<a href="{$item}">[{$key}]</a>
<!-- {/if} -->
<!--{/foreach}-->
<!-- {/if} -->
<!-- {if $pager.page_next} --><a class="next" href="{$pager.page_next}">{$lang.page_next}</a><!-- {/if} -->
<!-- {if $pager.page_last} --><a class="last" href="{$pager.page_last}">...{$lang.page_last}</a><!-- {/if} -->
<!-- {if $pager.page_kbd} -->
<!--{foreach from=$pager.search key=key item=item}-->
{if $key eq 'keywords'}
<input type="hidden" name="{$key}" value="{$item|escape:decode_url}" />
{else}
<input type="hidden" name="{$key}" value="{$item}" />
{/if}
<!--{/foreach}-->
<kbd style="float:left; margin-left:8px; position:relative; bottom:3px;"><input type="text" name="page" onkeydown="if(event.keyCode==13)selectPage(this)" size="3" class="B_blue" /></kbd>
<!-- {/if} -->
</div>
<!--翻页 END-->
<!-- {/if} -->
</form>
<script type="Text/Javascript" language="JavaScript">
<!--
{literal}
function selectPage(sel)
{
sel.form.submit();
}
{/literal}
//-->
</script>
3,相关css
style.css 中 /*翻页*/
.pagebar{height:20px; float:right;}
.pagebar img{position:relative; top:2px;}
.pagebar a{display:block; float:left; margin:0 2px; color:#0066cc; text-decoration:none;}
.pagebar a:hover{color:#ff5a6a; text-decoration:none;}
.pagebar .page_now{display:block; float:left; margin:0 5px; color:#ff5a6a; font-weight:bold; background:#fff;}
#pager a{color:#0066cc; text-decoration:none;}
ECSHOP在线手册布局参考图--积分商城 exchange_list.dwt的更多相关文章
- ECSHOP在线手册布局参考图--通用活动页 group_list.dwt等
A.购物车 1,设置方法 程序自动读取购物车的商品数量 2,代码相关 cart.lbi 中 {insert_scripts files='transport.js'} <div clas ...
- ECSHOP在线手册布局参考图--商品分类页 category.dwt
A.购物车 1,设置方法 程序自动读取购物车的商品数量 2,代码相关 cart.lbi 中 {insert_scripts files='transport.js'} <div clas ...
- ECSHOP在线手册布局参考图--商品详情页 goods.dwt
A.购物车 1,设置方法 程序自动读取购物车的商品数量 2,代码相关 cart.lbi 中 {insert_scripts files='transport.js'} <div clas ...
- ECSHOP在线手册布局参考图--文章详情页 article.dwt
A.购物车 1,设置方法 程序自动读取购物车的商品数量 2,代码相关 cart.lbi 中 {insert_scripts files='transport.js'} <div clas ...
- ECSHOP在线手册布局参考图--登录/注册页 user_passport.dwt
A.会员登录框 1,设置方法 自带模块 2,代码相关 user_passport.dwt 中 <div class="usBox_1 f_l"> <div ...
- ECSHOP在线手册布局参考图--文章列表页 article_cat.dwt
A.购物车 1,设置方法 程序自动读取购物车的商品数量 2,代码相关 cart.lbi 中 {insert_scripts files='transport.js'} <div clas ...
- ecshop在线手册前言及程序结构
该在线手册是有模版堂转载而来:仅供参考 一.前言 为什么我们ecshop模板堂要重制ecshop在线手册呢?因为目前网上的一些教程有些是比较老的,有些是不全面的,官方的手册也已经很久没有更 新,很多刚 ...
- ECSHOP在线手册之模板结构说明 (适用版本v2.7.3)
名称 类型 备注(作用或意义) 文件(目录)名可否更改 images 目录 存放模板图片目录 不可更改 library 目录 存放模板库文件目录 不可更改 screenshot.png 图片 用于“后 ...
- ECSHOP在线手册之布局参考图-首页 index.dwt
A.logo替换 1,设置方法 后台商店设置里,上传logo就行,注意logo的名称必须是logo.gif 2,代码相关 page_header.lbi 中 <a href=" ...
随机推荐
- SRM589
250: 给一个串S,可以做这样的操作,可以将串中的一种字母变成另一种字母,代价是该种字母的数量.求解的问题是,最小的代价将串S变成回文串. 根据回文关系,我们可以形成等价对应关系,a与b等价对应说明 ...
- 对Cost (%CPU) 粗略的理解
今天研究执行计划,看到执行计划里面有Cost (%CPU),我这边研究了一把,不知道对与否,拿出来晒晒 在Oracle 10g中,Oracle 把CPU的cost也统计在执行计划中去了, 这和以前的8 ...
- 【Lucene3.6.2入门系列】第04节_中文分词器
package com.jadyer.lucene; import java.io.IOException; import java.io.StringReader; import org.apach ...
- 使用SecureCRT上传和下载文件
SecureCR 下的文件传输协议有ASCII .Xmodem .Ymodem .Zmodem.ASCII:这是最快的传输协议,但只能传送文本文件.Xmodem:这种传输协议速度较慢,但由于使用了CR ...
- centos 如何用 rsyslog 搭建本地日志服务
一.问题背景 最近项目遇到一个问题,服务器响应很慢,team中的两个有经验的工程师找了一台服务器分析了一下,发现问题出在磁盘写入过于频繁.这里大概介绍一下背景,我们的服务器上面主要是跑各种PHP接口, ...
- UVa 1641 ASCII Area
题意: 就是用一个字符矩阵代表一个闭合的阴影部分,然后求阴影部分的面积. 分析: 一个'/'和'\'字符都代表半个小方块的面积. 关键就是判断'.'是否属于阴影部分,这才是本题的关键. 从第一列开始, ...
- 10、Android数据存储
课程目标: 掌握Android中数据存储的几种方式 熟练使用PreferenceActivity&PreferenceScreen做专业的Setting功能 熟练使用SQLite3来存储数据 ...
- redis-3.0.0集群的安装及使用
redis集群需要至少6个节点(偶数节点),3个主节点,3个从节点.注意:集群模式最好不要keys *查询数据. 1 下载redis,官网下载3.0.0版本,之前2.几的版本不支持集群模式.下载地址: ...
- FZU 2216 The Longest Straight 二分
0可以表示任何1到m的数,求一个最长的连续上升序列长度 因为m的范围在10w,所以以每个节点为起点 进行二分,复杂度mlogm 思路:b[i]表示到 1 到 i 有几个数没有出现,二分的时候注意加等号 ...
- [Tommas] 测试场景 VS 测试用例 哪个更好？（转）
分享一篇网上别人的感悟: 6年前,我在一家中型跨国公司工作的时候,我建议与其浪费时间在准备充分的测试用例,还不如编写描述测试场景的文档.所有的人都对我的建议.投以烦恼的目光.他们的脸上清晰地 ...