ecshop模板制作5-调整首页样式

保留头，内容，脚，上中下三层结构




1,修改页头
themes\default\library
page_header.lbi




1)修改logo样式
 <div class="f_l"><a href="../index.php" name="top"><img src="../images/logo.gif" /></a></div>
->
class="logo"


修改style.css
.f_l{float:left;}
->
.logo{
float:left;
margin-left:50px;
margin-top:30px
}










2)修改登录样式
{insert name='member_info'}




includes/lib_insert.php
$output = $GLOBALS['smarty']->fetch('library/member_info.lbi');


library/member_info.lbi




 <a href="user.php"><img src="images/bnt_log.gif" /></a>
 <a href="user.php?act=register"><img src="images/bnt_reg.gif" /></a>
->
 <a href="user.php">登录</a>
 <a href="user.php?act=register">我的帐号</a>




3)修改搜索栏位置
删除
library/page_header.lbi


<!--search start-->
<div id="search"  class="clearfix">
</div>
<!--search end-->


添加
library/member_info.lbi


 <form id="searchForm" name="searchForm" method="get" action="search.php" onSubmit="return checkSearchForm()" class="f_r"  style="_position:relative; top:5px;">
   <select name="category" id="category" class="B_input">
      <option value="0">{$lang.all_category}</option>
      {$category_list}
    </select>
   <input name="keywords" type="text" id="keyword" value="{$search_keywords|escape}" class="B_input" style="width:110px;"/>
   <input name="imageField" type="submit" value="" class="go" style="cursor:pointer;" />
   <a href="search.php?act=advanced_search">{$lang.advanced_search}</a>
   </form>










4)修改中部导航栏样式
page_header.lbi
<div id="mainNav" class="clearfix">
添加样式
<div id="mainNav" class="clearfix m_nav">




style.css
  /*页面主导航*/
  .m_nav{
 position:absolute;
 margin-top:-40px;
 margin-left:400px;
  }















5)将购物车信息放在页头处（类似淘宝）
index.dwt






<!-- #BeginLibraryItem "/library/cart.lbi" -->


{insert_scripts files='transport.js'}
<div class="cart" id="ECS_CARTINFO">
 {insert name='cart_info'}
</div>
<div class="blank5"></div>


 <!-- #EndLibraryItem -->




移到
page_header.lbi
下面






隐藏显示
/library/cart.lbi
<div class="cart" id="ECS_CARTINFO">
->
<div class="cart" style="position:absolute;float:left;visibility:hidden;" id="ECS_CARTINFO">










2,修改页脚
themes\default\library\page_fotter.lbi






1)修改底部导航栏样式
themes\default\library\page_fotter.lbi




删除
   <div class="f_r">
   <a href="#top"><img src="images/bnt_top.gif" /></a> <a href="../index.php"><img src="images/bnt_home.gif" /></a>
   </div>




修改
<div class="f_l">
->
<div class="f_r">








2)修改页脚内容
themes\default\library\page_fotter.lbi


1>修改版权标识
可以参考这里
http://www.ecmoban.com/article-1642.html
进一步深入的修改可以参考这里
http://www.ecmoban.com/article-285.html








删除style.css中的图片
   /*版权*/
   #footer{background:url(images/logo1.gif) no-repeat 5% 50%; padding-left:200px; width:760px; margin:10px auto;}
   #footer .text{background:url(images/footerLine.gif) no-repeat left center; padding-left:50px; *padding-bottom:20px;}






修改
/languages/zh_cn/common.php
$_LANG['copyright'] = "&copy; 2005-%s %s 版权所有，并保留所有权利。";
->
2013 XXXX All rights reserved.






2>去掉底部的Powered by ecshop 270


打开  js/common.js    


删除第244行:onload = function()【一定要删除这个完整的，不然会页面版权乱飞】
 


再打开模板文件夹的  library/page_footer.lbi


删除 {foreach from=$lang.p_y item=pv}{$pv}{/foreach}{$licensed}










3>删除查询信息和rss
themes\default\library\page_fotter.lbi


删除
  {insert name='query_info'}
  <div align="left"  id="rss"><a href="{$feed_url}"><img src="../images/xml_rss2.gif" alt="rss" /></a></div>






4>修改备案号样式
themes\default\library\page_fotter.lbi


  <!-- ICP 证书{if $icp_number} -->
 <span class="f_l" style="margin-top:-35px;margin-left:250px;"> {$lang.icp_number}:<a href="http://www.miibeian.gov.cn/" target="_blank">{$icp_number}</a></span><br />
  <!-- 结束ICP 证书{/if} -->








5>添加页底链接
themes\default\library\page_fotter.lbi


<div class="f_r" style="margin-top:-50px;margin-right:-80px;">
        <a href="#" target="_blank" >网站地图</a>
           -
        <a href="#" target="_blank" >法律声明</a>
           -
        <a href="#" target="_blank" >联系方式</a>           
   </div> 










以下文件是属于index.dwt,但我还是将其归类到页脚






6>删除友情链接
themes\default\index.dwt
<!--友情链接 start-->
<!--友情链接 end-->








7>删除帮助
其实帮助还是蛮有用的，详细设置可以参考这里，但有这里我只能按客户要求删除之
http://www.ecmoban.com/article-1558.html




themes\default\index.dwt






<div class="blank5"></div>
<!--帮助-->
<!--帮助-->


























3,修改主内容区
themes\default\index.dwt








1)删除商店公告


    <!--站内公告 start-->
    <!--站内公告 end-->






2)删除品牌分类
   <!--今日特价，品牌 start-->
    <div class="clearfix">
      <!--特价-->
      <!--品牌-->
    </div>






5)修改轮播栏
1>修改位置


       <div class="f_l" id="focus">
       <!-- #BeginLibraryItem "/library/index_ad.lbi" --><!-- #EndLibraryItem -->
       </div>








复制到此之上
<div class="block clearfix">
  <!--left start-->




2>修改大小
themes\default\library\index_ad.lbi
  var swf_width=484;
  var swf_height=200;
->
  var swf_width=950;
  var swf_height=560;










3>修改样式
       <div class="f_l" id="focus">
->
       <div class="f_l" style="position:absolute;float:left;margin-top:-90px;margin-left:140px;z-index:-99;" id="focus">










3)修改站内快讯样式
1>调至左边


   <!--焦点图和站内快讯 START-->
   <!--焦点图和站内快讯 END-->




       <div id="mallNews" class="f_r">
->
       <div id="mallNews" class="f_l">






4)修改精品推荐样式
1>调至右边


<!-- #BeginLibraryItem "/library/recommend_best.lbi" -->








2>调整样式
/library/recommend_best.lbi


删除文字
           <p><a href="{$goods.url}" title="{$goods.name|escape:html}">{$goods.short_style_name}</a></p>
           <font class="f1">
           <!-- {if $goods.promote_price neq ""} -->
          {$goods.promote_price}
          <!-- {else}-->
          {$goods.shop_price}
          <!--{/if}-->
           </font>






调整more位置
    <div class="more"><a href="../search.php?intro=best"><img src="images/more.gif" /></a></div>
->
  <div class="itemTit" id="itemBest">
下面




调整宽度
<div class="box" style="width:600px;margin-left:150px;height:160px;">