在 AnQiCMS 的模板中,我们经常需要处理各种数据,无论是网站的名称、文章的标题,还是产品详情,这些动态内容都需要通过变量来承载并展示出来。理解如何在模板中定义和显示变量,是进行 AnQiCMS 模板开发的核心。
AnQiCMS 采用了类似 Django 模板引擎的语法,这使得变量的使用直观且易于上手。在模板文件(通常是 .html 格式,并存放在 /template 目录下)中,我们主要通过两种符号来操作内容:双花括号 {{ }} 用于输出变量的值,而单花括号和百分号 {% %} 则用于定义逻辑结构,比如条件判断或循环,有时也用于调用特定的数据标签并定义变量。
基础变量的显示
最直接的变量显示方式,就是使用双花括号包裹变量名。例如,当你想要在页面上显示当前文章的标题时,如果后端已经将文章数据传递到模板中,并命名为 archive 对象,你就可以这样轻松地显示出来:
<h1>{{ archive.Title }}</h1>
这里的 archive 是一个对象,Title 则是这个对象的属性。通过 .(点号)运算符,我们可以层层深入地访问对象的属性。AnQiCMS 的变量命名通常遵循驼峰命名法则,即每个单词的首字母大写,例如 archive.Id、archive.Link。
在模板中定义新的变量
有时候,我们可能需要在模板内部创建一些临时变量,以便于后续的计算、组合或在局部代码块中使用。AnQiCMS 提供了 set 和 with 两种方式来定义变量。
set 标签用于在当前模板文件中定义一个新变量并赋值。这个变量的作用域会持续到当前模板文件的末尾。
{% set myTitle = "欢迎来到安企CMS的世界" %}
<p>{{ myTitle }}</p>
而 with 标签则更常用于定义一个临时的、作用域受限的变量,它通常与 include 标签结合使用,为引入的子模板传递特定数据,或者在某个代码块内进行局部变量声明,并通过 {% endwith %} 结束其作用域。
{% with headerTitle = "安企CMS官方网站" %}
<h1>{{ headerTitle }}</h1>
{% endwith %}
{# 在这里,headerTitle 变量将不再可用 #}
利用内置标签获取并显示数据
AnQiCMS 内置了许多功能强大的标签,它们可以直接从后台获取配置数据、内容数据等,并提供两种常用的显示变量值的方式:直接输出或先定义为变量再输出。
以获取网站名称为例,我们可以使用 system 标签。如果只是想直接在某个位置显示网站名称,可以这样写:
<p>我们的网站名称是:{% system with name="SiteName" %}</p>
如果希望将网站名称赋值给一个新变量,以便在模板中的多个位置灵活使用,或者进行进一步处理,可以在标签后指定变量名:
{% system siteBrandName with name="SiteName" %}
<p>网站品牌:{{ siteBrandName }}</p>
<meta property="og:site_name" content="{{ siteBrandName }}">
类似的标签还有 contact(用于获取联系方式,如 {% contact cellPhone with name="Cellphone" %}{{ cellPhone }})、tdk(用于获取页面 SEO 相关的 TDK 信息)、archiveDetail(获取文章详情)、categoryDetail(获取分类详情)和 pageDetail(获取单页详情)等。它们都遵循这种通过 with name="字段名称" 来指定获取哪个字段的模式。
处理列表数据:for 循环
在网站中,我们经常需要展示文章列表、产品列表等集合数据。AnQiCMS 的 for 循环标签能够遍历这些数据集合,并在每次迭代中将当前项赋值给一个临时变量,供我们显示其属性。
例如,要显示最新的十篇文章列表,可以配合 archiveList 标签:
{% archiveList articles with type="list" limit="10" %}
<ul>
{% for item in articles %}
<li>
<a href="{{ item.Link }}">
<h3>{{ item.Title }}</h3>
<p>{{ item.Description|truncatechars:100 }}</p>
<small>发布日期: {{ stampToDate(item.CreatedTime, "2006-01-02") }}</small>
</a>
</li>
{% empty %}
<li>暂无文章</li>
{% endfor %}
</ul>
{% endarchiveList %}
在这个例子中,for item in articles 会在每次循环时将当前文章数据赋值给 item 变量。我们就可以通过 item.Link、item.Title 等方式来访问并显示文章的各项属性。forloop.Counter 等内置变量还能帮助我们获取循环的当前索引等信息。
条件性显示:if 语句
有时,我们可能需要根据特定条件来决定是否显示某个变量或代码块。if 语句允许我们进行逻辑判断。
例如,如果一篇文章没有缩略图,我们就不显示图片区域:
{% if item.Thumb %}
<img src="{{ item.Thumb }}" alt="{{ item.Title }}">
{% else %}
<img src="{% system with name="SiteLogo" %}" alt="默认图片">
{% endif %}
使用过滤器美化和处理变量
AnQiCMS 提供了丰富的过滤器(Filters)来对变量进行加工处理,例如格式化、截取、转义等。使用过滤器时,只需在变量名后加上 |(管道符)和过滤器名称即可。
|safe: 当变量内容包含 HTML 代码,而你不希望它被转义显示时,使用|safe过滤器可以确保 HTML 代码被浏览器正确解析。这对于显示富文本编辑器内容尤为重要。<div>文章内容:{{ archive.Content|safe }}</div>|stampToDate: AnQiCMS 的时间戳通常以 10 位数字形式存储,stampToDate函数可以将其格式化成我们需要的日期时间格式。 “`twig 更新时间:{{ stampToDate(archive.UpdatedTime, “2006年0