ECSHOP在线手册布局参考图--文章列表页 article_cat.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>

C.文章列表

1,设置方法

自动读取后台文章列表

2,代码相关

article.dwt 中 <div class="boxCenterList">
<form action="{$search_url}" name="search_form" method="post" class="article_search">
<input name="keywords" type="text" id="requirement" value="{$search_value}" class="inputBg" />
<input name="id" type="hidden" value="{$cat_id}" />
<input name="cur_url" id="cur_url" type="hidden" value="" />
<input type="submit" value="{$lang.button_search}" class="bnt_blue_1" />
</form>
<table width="100%" border="0" cellpadding="5" cellspacing="1" bgcolor="#dddddd">
<tr>
<th bgcolor="#ffffff">{$lang.article_title}</th>
<th bgcolor="#ffffff">{$lang.article_author}</th>
<th bgcolor="#ffffff">{$lang.article_add_time}</th>
</tr>
<!-- {foreach from=$artciles_list item=article} -->
<tr>
<td bgcolor="#ffffff"><a href="{$article.url}" title="{$article.title|escape:html}" class="f6">{$article.short_title}</a></td>
<td bgcolor="#ffffff">{$article.author}</td>
<td bgcolor="#ffffff" align="center">{$article.add_time}</td>
</tr>
<!-- {/foreach} -->
</table>
</div>

3,相关css

style.css 中 .boxCenterList{padding:8px;}

D.页码区

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;}