现在写一下关于模板文件中,设置公用的文件。以Index目录为例,公共文件为Public下的base.html。
先贴上公共文件 base.html代码:其中 <block name="style"></block> <block name="body"></block> <block name="footer"></block> ,通过block一个标签来引入非公共文件。
<!DOCTYPE html> <html lang="zh_CN"> <head> <title>后台管理系统</title> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <link rel="stylesheet" href="__PUBLIC__/Admin/css/bootstrap.min.css" /> <link rel="stylesheet" href="__PUBLIC__/Admin/css/bootstrap-responsive.min.css" />
<block name="style"></block>
</head> <body> <div id="header"> <h1><a href="dashboard.html">后台管理系统</a></h1> </div> <div id="user-nav" class="navbar navbar-inverse"> <ul class="nav"> <li class="dropdown" id="profile-messages" ><a title="" href="#" data-toggle="dropdown" data-target="#profile-messages" class="dropdown-toggle"><i class="icon icon-user"></i> <span class="text">欢迎您</span><b class="caret"></b></a> <ul class="dropdown-menu"> <li><a href="#"><i class="icon-user"></i> My Profile</a></li> <li class="divider"></li> <li><a href="#"><i class="icon-check"></i> My Tasks</a></li> <li class="divider"></li> <li><a href="login.html"><i class="icon-key"></i> Log Out</a></li> </ul> </li> <li class=""><a title="" href="#"><i class="icon icon-cog"></i> <span class="text">设置</span></a></li> <li class=""><a title="" href="#"><i class="icon icon-share-alt"></i> <span class="text">退出</span></a></li> </ul> </div> <div id="sidebar"><a href="#" class="visible-phone"><i class="icon icon-home"></i> Dashboard</a> <ul> <li class="active"><a href="{:U('Index/index')}"><i class="icon icon-home"></i> <span>Dashboard</span></a> </li> <li><a href="{:U('Test/index')}"><i class="icon icon-test"></i> <span>测试</span> </a> </li> <li> <a href="{:U('Charts/index')}"><i class="icon icon-signal"></i> <span>Charts & graphs</span></a> </li> <li> <a href="{:U('Widgets/index')}"><i class="icon icon-inbox"></i> <span>Widgets</span></a> </li> <li><a href="{:U('Tables/index')}"><i class="icon icon-th"></i> <span>Tables</span></a></li> <li><a href="{:U('Grids/index')}"><i class="icon icon-fullscreen"></i> <span>Full width</span></a></li> </ul> </div> <block name="body"></block> <div class="row-fluid"> <div id="footer" class="span12"> 2013 © Matrix Admin. Brought to you by <a href="#">Themedesigner.in</a> </div> </div> <block name="footer"></block> </body> </html>
下面是 index.html代码,通过extend 引入公共文件,然后相应的 block标签包含非公共文件
<extend name="Public/base" /> <block name="style"> <link rel="stylesheet" href="__PUBLIC__/Admin/css/fullcalendar.css" /> </block> <block name="body"> <!--main-container-part--> <div id="content"> //内容部分 </div> </block> <block name="footer"> <script src="__PUBLIC__/Admin/js/excanvas.min.js"></script> <script src="__PUBLIC__/Admin/js/jquery.min.js"></script> <script src="__PUBLIC__/Admin/js/jquery.ui.custom.js"></script> <script src="__PUBLIC__/Admin/js/bootstrap.min.js"></script> <script src="__PUBLIC__/Admin/js/jquery.flot.min.js"></script> <script src="__PUBLIC__/Admin/js/jquery.flot.resize.min.js"></script> </block>