ecshop模板制作3-自定义布局

1,重新定义布局

about.dwt

<div class="aboutBox clearfix">
<!-- TemplateBeginEditable name="内容主区域" -->
<!-- TemplateEndEditable -->
<div class="about_menu">
   <!-- TemplateBeginEditable name="右侧内容区域" -->    
   <!-- TemplateEndEditable -->
    </div>
<div class="about_content">
 <!-- TemplateBeginEditable name="右侧内容区域" -->
<!-- TemplateEndEditable -->  
  </div>    








2,添加库元素
1)新建
about_menu.lbi
about_content.lbi


2)引用
\admin\includes\lib_template.php文件里面
在新加的'about' => array数组末尾加
       '/library/about_menu.lbi' => 0,
       '/library/about_content.lbi' => 0,




3)文字
\languages\zh_cn\admin\template.php 里面加入一行 
$_LANG['template_libs']['about_menu'] = 'about菜单库';
$_LANG['template_libs']['about_content'] = 'about内容库';






4)修正
\themes\default\libs.xml文件里找到刚才你加的   
<file name="about.dwt"><region name="左边区域">里面加上


      <lib>about_menu</lib>
      <lib>about_content</lib>  












3,编写菜单库


about_menu.lbi




    <ul>
      <li><a href="#" οnclick="chgShow(0);">菜单1</a></li>
      <li><a href="#" οnclick="chgShow(1);">菜单2</a></li>
      <li><a href="#" οnclick="chgShow(2);">菜单3</a></li>
      <li><a href="#" οnclick="chgShow(3);">菜单4</a></li>
    </ul>






4,编写内容库
about_content.lbi






<div class="about_content_header">
<img src="images/screenshot.png" width="600" height="150" />
</div>
<div class="about_content_content">
        <p>希望我们希望我们希望我们希望我们希望我们希望我们希望我们希望我们希望我们希望我们希望我们希望我们
希望我们希望我们希望我们</p>
        　　　<p>希望我们的努力能为您带来力能为您带来美好力能为您带来美好！</p>
</div>








5,编写css格式
themes里面的style.css








    /* ====================
     关于我们
==================== */
.aboutBox{
background:#f2f2f2; border:1px solid #e2e2e2; padding:15px; width:928px;
}
.about_menu{
float:left;
background:#fff; text-align:left; width:130px; height:208px; padding:10px 10px 10px 10px;
}




.about_content{
width:680px; height:267px; padding:43px 0 0 90px; background:#f2f2f2; float:right;
    text-align:left; background:url(images/ur_bg1.gif) no-repeat 0 50%; line-height:23px;
}




.about_content_header{
}




.about_content_content{
}