前台模板引入及分离

创建三个控制器
  在index\controller目录下创建三个文件Index.php,Cate.php,Article.php

代码内容如下:

namespace app\index\controller;

use think\Controller;
class Index extends Controller
{
    public function index()
    {
        return $this->fetch();
    }
    
}

#Cate.php
<?php
namespace app\index\controller;

use think\Controller;
class Cate extends Controller
{
    public function index()
    {
        return $this->fetch('cate');
    }
    
}

#Article.php
<?php
namespace app\index\controller;

use think\Controller 
class Article extends Controller
{
    public function index()
    {
        return $this->fetch('list');
    }
    
}

  创建视图模板，视图模板有提供，可以到网盘下载。如下图

提示：如果首页还是保持原来的页面，则需要删除runtime目录
  在public\index.php页面中添加如下配置项:

define('SITE_URL', 'http://www.tp5.com/');

  此时浏览器打的应该是混乱的页面，这是因为没有配置__PUBLIC__视图模板替换参数
。在index模块下创建config.php配置文件，内容如下：

return [
	// 作用 在index模块中出现了__PUBLIC__全部替换为/public/
	'view_replace_str'  =>  [
    '__PUBLIC__'=>SITE_URL.'static/index',
	]
];

  然后对各个模板文件如index\view\index\index.html进行替换，将./替换为__PUBLIC__/,然后在浏览器中打开页面，就会正常显示加载样式文件和js文件
提示：如果页面没有任何变化，原因可能是runtime目录中缓存文件导致，可以删除runtime目录，再次打开页面，显示正常
页头及页脚分离
  在index\view目录下创建common目录，并创建footer.html,header.html,并且从index.html中剪切出如下代码，放入header.html

<div class="ladytop">
    <div class="nav">
        <div class="left"><a href="/jiehun/"><img src="__PUBLIC__/images/hunshang.png" alt="wed114婚尚"></a></div>
        <div class="right">
        <div class="box">
         <a href="/jiehun/hunjia/"  rel='dropmenu209'>婚嫁</a> <a href="/jiehun/meirong/"  rel='dropmenu110'>美容</a> <a href="/jiehun/fushi/"  rel='dropmenu112'>服饰</a> <a href="/jiehun/yule/"  rel='dropmenu118'>娱乐</a> <a href="/jiehun/jiankang/"  rel='dropmenu120'>健康</a> <a href="/jiehun/meishi/"  rel='dropmenu122'>美食</a> <a href="__PUBLIC__/images/"  rel='dropmenu117'>生活</a> <a href="/jiehun/tuku/"  rel='dropmenu103'>图库</a> <a href="/jiehun/zhuanti/" >专题</a> 
         </div>
        </div>
    </div>
</div>
        <div class="hotmenu">
    <div class="con">热门标签：<a href='/jiehun/qiwenqushi/'>奇闻趣事</a> <a href='/jiehun/shenghuomiaozhao/'>生活妙招</a> <a href='/jiehun/xingzuo/'>星座</a> <a href='/jiehun/qinzi/'>亲子</a> <a href='/jiehun/qiche/'>汽车</a> <a href='/jiehun/chongwubaike/'>宠物百科</a> <a href='/jiehun/jiaji/'>家居</a> </div>
</div>

  并且在index.html剪切处添加以下代码

{include file='common/header.php'}

  剪切index.html的以下代码粘贴到footer.html中

<div class="footerd">
    <ul>
        <li>Copyright &#169; 2008-2015  all rights reserved 版权所有</li> 
    </ul>
</div>

  并且在index.html剪切处添加以下代码

{include file='common/footer.php'}

  对于index\view\cate\cate.html和index\view\article\article.html做同样的处理，只需要删除同样的代码，并且引入header和footer即可
最终显示结果如下，以index.html页面为例：