织梦仿站第三课：网站的文件分割

 在进行仿站之前  你可以在电脑上新建一个templets文件夹
                                                                   templets/default          模板文件   
                                                                   templets/default/style      样式文件
                                                                   templets/default/images    图片文件
                                                                   templets/default /js          javascript文件
然后将搭建的一个本地php环境 安装好织梦 最好安装体验包 ，可以有内容。
一，我们打开目标站的首页源代码 （我们建议使用谷歌浏览器，后续我们也是根据谷歌浏览器来调试的）  查看到这样的信息：
   （站长之家）

1. <link rel="stylesheet" href="http://img.chinaz.com/templates/chinaz/css/style.css?v=20110901"><!--样式文件-->
3. <link rel="stylesheet" href="http://my.chinaz.com/max-templates/passport/styles/topbar.css"><!--样式文件-->
5. <link rel="shortcut icon" type="image/ico" href="http://img.chinaz.com/templates/chinaz/favicon.ico"> <!--ico图标-->
7. <script src="http://img.chinaz.com/templates/chinaz/js/script.js"></script><!--js文件-->
9. <script src="http://img.chinaz.com/js/lib/jquery.js"></script> <!--jquery.js文件-->

复制代码

我们先把这些文件保存到相应的文件夹中。
二，把整个首页文件保存在default文件夹中并更名为index.htm


        我们再从新打开index.htm文件看看效果是否完整 。若效果没有改变则正常，如果发现异常 看看源码是否改变。

三，将首页中的head contents  footer 区分：
我们来看一下站长之家的这个：

1. <div class="container">
3.                     <div class="toolbar">

复制代码

我们可以很清楚的看一个 container 把头部 中部 底部 的内容包围了


所以我们就可以进行 划分：
    1.将 

1.    <div class="toolbar">
2. <!--顶部代码-->
3.                        </div>
4.            <div class="header">
5. <!--头部代码-->
6.              </div>

复制代码

    保存为一个head.htm     2.将

1. <div class="footer"> 
2. <!--底部内容-->         
3.             </div>

复制代码

   保存一个footer.htm文件

3.  然后使用{dede:include filename="head.htm"/}
                   {dede:include filename="footer.htm"/}         分别 进行插入头部与尾部。


不修改任何代码。
直接将 index.htm  .head.htm  与footer.htm  
   放在搭建好的织梦环境中 生成一个主页   看看效果是否和目标站相同  。
我们的效果是要相同的。

织梦仿站教程更新 更多请访问：站长部落论坛 http://bbs.zzblo.com