ECSHOP v2.62,仿淘宝的 添加首页文章分类方法

2016-07-07 16:23 来源：www.chinab4c.com 作者：ecshop专家

楼主好，我仿淘宝的，添加文章分类的时候，总是只能放一列，第二列的时候就到下面去了，我想放四列，就是不行，我是安照论坛那些高手添加的代码，就是不行，我安照了两种方法，就是不行，
第一种：
1.打开模板文件夹下的index.dtw，搜索<!--right end-->，由于我是要在首页右边主框架的最后加上文章列表，所以选择这个位置。在<!-- TemplateEndEditable -->后面加入<!-- TemplateBeginEditable name="右边文章区域" --><!-- TemplateEndEditable -->，然后保存并上传覆盖。
步骤解析：这一步是在首页增加一个文章区域，而这个区域是下面所要用到的。
2.进入后台，打开模板管理-库项目管理中的cat_articles.lbi，然后替换成下面的代码
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<div style="width:245px; float:left; margin-right:3px;">
<div class="box">
<div class="box_1">
<h3>
<span><a href="{$articles_cat.url}">{$articles_cat.name|escape:html}</a></span>
<a href="{$articles_cat.url}"><img src="../images/more.gif" alt="more" /></a>
</h3>
<div class="boxCenterList RelaArticle">
<!--{foreach from=$articles item=article}-->
<a href="{$article.url}" title="{$article.title|escape:html}">{$article.short_title}</a><br />
<!--{/foreach}-->
</div>
</div>
</div>
</div>
第二种：
一、style.css 底部添加：
/*====================
首页文章分类
====================*/
#new-list{
width:748px;
height:100％;/* 首页文章分类高度调整*/
float:left;
padding:0 3px 0 0;
}
#new-list .new-left{
width:246px;
height:100％;
float:left;
padding:0 0 2px 0;
overflow:hidden;
}
#new-list .new-center{
width:246px;
height:100％;
float:left;
margin-left:5px;
overflow:hidden;
}
#new-list .new-right{
width:246px;
height:100％;
float:left;
margin-left:5px;
overflow:hidden;
}
#new-list .listStyle{
height:100％;
overflow:hidden;
}
.box_3{
border:1px solid #d4d4d4;
background-color:#fff;
height:200px;
}

二、cat_articles.lbi 文件里面内容
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<div class="box">
<div class="box_3">
<h3>
<span><a style="color: #565656; text-decoration: none" href="{$articles_cat.url}"
title="{$articles_cat.name|escape:html}">{$articles_cat.name|escape:html}</a></span>
<a href="{$articles_cat.url}"><img src="../images/more.gif" title="浏览更多" /></a>
</h3>
<div class="boxCenterList RelaArticle">
<!--{foreach from=$articles item=article}-->
<a href="{$article.url}" title="{$article.title|escape:html}">{$article.short_title|truncate:16:"...":true}</a><br />
<!--{/foreach}-->
</div>
</div>
</div>
<div class="blank5"></div>

三、index.dwt 右边合适位置添加：
搜索
</div>
<!--right end-->
在前面添加下面的代码：


<!--主区域文章分类 start-->
<div id="new-list">
<div class="new-left">
<!-- TemplateBeginEditable name="主区域左侧文章分类" -->
<!-- #BeginLibraryItem "/library/cat_articles.lbi" -->
<div class="box">
<div class="box_3">
<h3>
<span><a style="color: #565656; text-decoration: none" href="{$articles_cat.url}"
title="{$articles_cat.name|escape:html}">{$articles_cat.name|escape:html}</a></span>
<a href="{$articles_cat.url}"><img src="../images/more.gif" title="浏览更多" /></a>
</h3>
<div class="boxCenterList RelaArticle">
<!--{foreach from=$articles item=article}-->
<a href="{$article.url}" title="{$article.title|escape:html}">{$article.short_title|truncate:16:"...":true}</a><br />
<!--{/foreach}-->
</div>
</div>
</div>
<div class="blank5"></div>
<!-- #EndLibraryItem -->
<!-- TemplateEndEditable -->
</div>
<div class="new-center">
<!-- TemplateBeginEditable name="主区域中部文章分类" -->
<!-- #BeginLibraryItem "/library/cat_articles.lbi" -->
<div class="box">
<div class="box_3">
<h3>
<span><a style="color: #565656; text-decoration: none" href="{$articles_cat.url}"
title="{$articles_cat.name|escape:html}">{$articles_cat.name|escape:html}</a></span>
<a href="{$articles_cat.url}"><img src="../images/more.gif" title="浏览更多" /></a>
</h3>
<div class="boxCenterList RelaArticle">
<!--{foreach from=$articles item=article}-->
<a href="{$article.url}" title="{$article.title|escape:html}">{$article.short_title|truncate:16:"...":true}</a><br />
<!--{/foreach}-->
</div>
</div>
</div>
<div class="blank5"></div>
<!-- #EndLibraryItem -->
<!-- TemplateEndEditable -->
</div>
<div class="new-right">
<!-- TemplateBeginEditable name="主区域右侧文章分类" -->
<!-- #BeginLibraryItem "/library/cat_articles.lbi" -->
<div class="box">
<div class="box_3">
<h3>
<span><a style="color: #565656; text-decoration: none" href="{$articles_cat.url}"
title="{$articles_cat.name|escape:html}">{$articles_cat.name|escape:html}</a></span>
<a href="{$articles_cat.url}"><img src="../images/more.gif" title="浏览更多" /></a>
</h3>
<div class="boxCenterList RelaArticle">
<!--{foreach from=$articles item=article}-->
<a href="{$article.url}" title="{$article.title|escape:html}">{$article.short_title|truncate:16:"...":true}</a><br />
<!--{/foreach}-->
</div>
</div>
</div>
<div class="blank5"></div>
<!-- #EndLibraryItem -->
</div>
</div>
<!--主区域文章分类 END-->
两种都不行，第一种放上去后，就没有外框了，第二种，只能放二个，不知道为什么，能帮我组个代码吗。我要四列的，谢谢了。做了很多天了，总是不行，头晕死了。帮我啊。

回答：
其他模板需要修改css