ThinkPHP如何给网页加公共的header文件和footer文件

2023-12-22 11:18

本文主要是介绍ThinkPHP如何给网页加公共的header文件和footer文件,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

在thinkPHP的手册的模板里面有模板继承,模板继承的优势其实是设计基础模板中的区块(block)和子模板中替换这些区块

具体如下:

每个区块由<block></block>标签组成。下面就是基础模板中的一个典型的区块设计(用于设计网站标题):

1
<block name= "title" ><title>网站标题</title></block>

block标签必须指定name属性来标识当前区块的名称,这个标识在当前模板中应该是唯一的,block标签中可以包含任何模板内容,包括其他标签和变量,例如:

1
<block name= "title" ><title>{ $web_title }</title></block>

甚至还可以在区块中加载外部文件:

1
< block  name = "include" >< include  file = "Public:header"  /></ block >

一个模板中可以定义任意多个名称标识不重复的区块,例如下面定义了一个base.html基础模板:

1
2
3
4
5
6
7
8
9
10
11
12
13
< html >
< head >
< meta  http-equiv = "Content-Type"  content = "text/html; charset=utf-8" >
< block  name = "title" >< title >标题</ title ></ block >
</ head >
< body >
< block  name = "menu" >菜单</ block >
< block  name = "left" >左边分栏</ block >
< block  name = "main" >主内容</ block >
< block  name = "right" >右边分栏</ block >
< block  name = "footer" >底部</ block >
</ body >
</ html >

然后我们在子模板(其实是当前操作的入口模板)中使用继承:

<extend name="base" />

<block name="title"><title>{$title}</title></block>

<block name="menu"><a href="/" >首页</a>

                                     <a href="/info/" >资讯</a>

                                    <a href="/bbs/" >论坛</a>

</block><block name="left"></block>

 <block name="content"><

volist name="list" id="vo">

<a href="/new/{$vo.id}">{$vo.title}</a><br/> {$vo.content}</volist>

</block>

<block name="right"> 最新资讯:<volist name="news" id="new"><a href="/new/{$new.id}">{$new.title}</a><br/>

</volist>

</block>

<block name="footer"> @ThinkPHP 版权所有</block>

可以看到,子模板中使用了extend标签定义需要继承的模板,extend标签的用法和include标签一样,你也可以加载其他模板:

<extend name="Public:base" />

或者使用绝对文件路径加载

<extend name="./Template/Public/base.html" />

在当前子模板中,只能定义区块而不能定义其他的模板内容,否则将会直接忽略,并且只能定义基础模板中已经定义的区块。

例如,如果采用下面的定义:

<block name="title"><title>{$title}</title></block><a href="/" >首页</a><a href="/info/" >资讯</a><a href="/bbs/" >论坛</a>

导航部分将是无效的,不会显示在模板中。



ThinkPHP的模板引擎内置了布局模板功能支持,可以方便的实现模板布局以及布局嵌套功能。

有三种布局模板的支持方式:

第一种方式:全局配置方式

这种方式仅需在项目配置文件中添加相关的布局模板配置,就可以简单实现模板布局功能,比较适用于全站使用相同布局的情况,需要配置开启LAYOUT_ON 参数(默认不开启),并且设置布局入口文件名LAYOUT_NAME(默认为layout)。

 
  1. 'LAYOUT_ON'=>true,
  2. 'LAYOUT_NAME'=>'layout',

开启LAYOUT_ON后,我们的模板渲染流程就有所变化,例如:

 
  1. namespace Home\Controller;
  2. use Think\Controller;
  3. Class UserController extends Controller{
  4. Public function add() {
  5. $this->display('add');
  6. }
  7. }

在不开启LAYOUT_ON布局模板之前,会直接渲染 Application/Home/View/User/add.html 模板文件,开启之后,首先会渲染Application/Home/View/layout.html 模板,布局模板的写法和其他模板的写法类似,本身也可以支持所有的模板标签以及包含文件,区别在于有一个特定的输出替换变量{__CONTENT__},例如,下面是一个典型的layout.html模板的写法:

 
  1. <include file="Public:header" />
  2. {__CONTENT__}
  3. <include file="Public:footer" />

读取layout模板之后,会再解析User/add.html 模板文件,并把解析后的内容替换到layout布局模板文件的{CONTENT} 特定字符串。

当然可以通过设置来改变这个特定的替换字符串,例如:

 
  1. 'TMPL_LAYOUT_ITEM' => '{__REPLACE__}'

一个布局模板同时只能有一个特定替换字符串。

采用这种布局方式的情况下,一旦User/add.html 模板文件或者layout.html布局模板文件发生修改,都会导致模板重新编译。

如果需要指定其他位置的布局模板,可以使用:

 
  1. 'LAYOUT_NAME'=>'Layout/layoutname',

就表示采用Application/Home/View/Layout/layoutname.html作为布局模板。

如果某些页面不需要使用布局模板功能,可以在模板文件开头加上 {__NOLAYOUT__} 字符串。

如果上面的User/add.html 模板文件里面包含有{__NOLAYOUT__},则即使当前开启布局模板,也不会进行布局模板解析。

第二种方式:模板标签方式

这种布局模板不需要在配置文件中设置任何参数,也不需要开启LAYOUT_ON,直接在模板文件中指定布局模板即可,相关的布局模板调整也在模板中进行。

以前面的输出模板为例,这种方式的入口还是在User/add.html 模板,但是我们可以修改下add模板文件的内容,在头部增加下面的布局标签(记得首先关闭前面的LAYOUT_ON设置,否则可能出现布局循环):

 
  1. <layout name="layout" />

表示当前模板文件需要使用layout.html 布局模板文件,而布局模板文件的写法和上面第一种方式是一样的。当渲染User/add.html 模板文件的时候,如果读取到layout标签,则会把当前模板的解析内容替换到layout布局模板的{CONTENT} 特定字符串。

一个模板文件中只能使用一个布局模板,如果模板文件中没有使用任何layout标签则表示当前模板不使用任何布局。

如果需要使用其他的布局模板,可以改变layout的name属性,例如:

 
  1. <layout name="newlayout" />

还可以在layout标签里面指定要替换的特定字符串:

 
  1. <layout name="Layout/newlayout" replace="{__REPLACE__}" />

由于所有include标签引入的文件都支持layout标签,所以,我们可以借助layout标签和include标签相结合的方式实现布局模板的嵌套。例如,上面的例子

 
  1. <include file="Public:header" />
  2. <div id="main" class="main" >
  3. {__CONTENT__}
  4. </div>
  5. <include file="Public:footer" />

在引入的header和footer模板文件中也可以添加layout标签,例如header模板文件的开头添加如下标签:

 
  1. <layout name="menu" />

这样就实现了在头部模板中引用了menu布局模板。

也可以采用两种布局方式的结合,可以实现更加复杂的模板布局以及嵌套功能。

第三种方式:使用layout控制模板布局

使用内置的layout方法可以更灵活的在程序中控制模板输出的布局功能,尤其适用于局部需要布局或者关闭布局的情况,这种方式也不需要在配置文件中开启LAYOUT_ON。例如:

 
  1. namespace Home\Controller;
  2. use Think\Controller;
  3. Class UserController extends Controller{
  4. Public function add() {
  5. layout(true);
  6. $this->display('add');
  7. }
  8. }

表示当前的模板输出启用了布局模板,并且采用默认的layout布局模板。

如果当前输出需要使用不同的布局模板,可以动态的指定布局模板名称,例如:

 
  1. namespace Home\Controller;
  2. use Think\Controller;
  3. Class UserController extends Controller{
  4. Public function add() {
  5. layout('Layout/newlayout');
  6. $this->display('add');
  7. }
  8. }

或者使用layout方法动态关闭当前模板的布局功能(这种用法可以配合第一种布局方式,例如全局配置已经开启了布局,可以在某个页面单独关闭):

 
  1. namespace Home\Controller;
  2. use Think\Controller;
  3. Class UserController extends Controller{
  4. Public function add() {
  5. layout(false); // 临时关闭当前模板的布局功能
  6. $this->display('add');
  7. }
  8. }

三种模板布局方式中,第一种和第三种是在程序中配置实现模板布局,第二种方式则是单纯通过模板标签在模板中使用布局。具体选择什么方式,需要根据项目的实际情况来了。


这篇关于ThinkPHP如何给网页加公共的header文件和footer文件的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/523748

相关文章

网页解析 lxml 库--实战

lxml库使用流程 lxml 是 Python 的第三方解析库,完全使用 Python 语言编写,它对 XPath表达式提供了良好的支 持,因此能够了高效地解析 HTML/XML 文档。本节讲解如何通过 lxml 库解析 HTML 文档。 pip install lxml lxm| 库提供了一个 etree 模块,该模块专门用来解析 HTML/XML 文档,下面来介绍一下 lxml 库

poj1330(LCA最近公共祖先)

题意:求最近公共祖先 思路:之前学习了树链剖分,然后我就用树链剖分的一小部分知识就可以解这个题目了,记录每个结点的fa和depth。然后查找时,每次将depth大的结点往上走直到x = y。 代码如下: #include<iostream>#include<algorithm>#include<stdio.h>#include<math.h>#include<cstring>

EasyPlayer.js网页H5 Web js播放器能力合集

最近遇到一个需求,要求做一款播放器,发现能力上跟EasyPlayer.js基本一致,满足要求: 需求 功性能 分类 需求描述 功能 预览 分屏模式 单分屏(单屏/全屏) 多分屏(2*2) 多分屏(3*3) 多分屏(4*4) 播放控制 播放(单个或全部) 暂停(暂停时展示最后一帧画面) 停止(单个或全部) 声音控制(开关/音量调节) 主辅码流切换 辅助功能 屏

禁止复制的网页怎么复制

禁止复制的网页怎么复制 文章目录 禁止复制的网页怎么复制前言准备工作操作步骤一、在浏览器菜单中找到“开发者工具”二、点击“检查元素(inspect element)”按钮三、在网页中选取需要的片段,锁定对应的元素四、复制被选中的元素五、粘贴到记事本,以`.html`为后缀命名六、打开`xxx.html`,优雅地复制 前言 在浏览网页的时候,有的网页内容无法复制。比如「360

火语言RPA流程组件介绍--浏览网页

🚩【组件功能】:浏览器打开指定网址或本地html文件 配置预览 配置说明 网址URL 支持T或# 默认FLOW输入项 输入需要打开的网址URL 超时时间 支持T或# 打开网页超时时间 执行后后等待时间(ms) 支持T或# 当前组件执行完成后继续等待的时间 UserAgent 支持T或# User Agent中文名为用户代理,简称 UA,它是一个特殊字符串头,使得服务器

起点中文网防止网页调试的代码展示

起点中文网对爬虫非常敏感。如图,想在页面启用调试后会显示“已在调试程序中暂停”。 选择停用断点并继续运行后会造成cpu占用率升高电脑卡顿。 经简单分析网站使用了js代码用于防止调试并在强制继续运行后造成电脑卡顿,代码如下: function A(A, B) {if (null != B && "undefined" != typeof Symbol && B[Symbol.hasInstan

(入门篇)JavaScript 网页设计案例浅析-简单的交互式图片轮播

网页设计已经成为了每个前端开发者的必备技能,而 JavaScript 作为前端三大基础之一,更是为网页赋予了互动性和动态效果。本篇文章将通过一个简单的 JavaScript 案例,带你了解网页设计中的一些常见技巧和技术原理。今天就说一说一个常见的图片轮播效果。相信大家在各类电商网站、个人博客或者展示页面中,都看到过这种轮播图。它的核心功能是展示多张图片,并且用户可以通过点击按钮,左右切换图片。

在二叉树中找到两个节点的最近公共祖先(基于Java)

如题  题解 public int lowestCommonAncestor(TreeNode root, int o1, int o2) {//记录遍历到的每个节点的父节点。Map<Integer, Integer> parent = new HashMap<>();Queue<TreeNode> queue = new LinkedList<>();parent.put(roo

【IPV6从入门到起飞】4-RTMP推流,ffmpeg拉流,纯HTML网页HLS实时直播

【IPV6从入门到起飞】4-RTMP推流,ffmpeg拉流,纯HTML网页HLS实时直播 1 背景2 搭建rtmp服务器2.1 nginx方案搭建2.1.1 windows 配置2.1.2 linux 配置 2.2 Docker方案搭建2.2.1 docker 下载2.2.2 宝塔软件商店下载 3 rtmp推流3.1 EV录屏推流3.2 OBS Studio推流 4 ffmpeg拉流转格式