模板中如何使用Django模板引擎语法来显示变量和逻辑结构?

📅 👁️ 63

安企CMS(AnQiCMS)在模板制作上采用了类似于Django的模板引擎语法,这种设计理念旨在为内容运营者和开发者提供一个既强大又易于上手的工具,让大家能够更灵活地控制网站内容的展示方式。通过掌握这套模板语法,您可以轻松地在网站前端页面上显示动态数据,并根据特定条件控制内容的呈现逻辑。

一、模板语法的核心构成:变量与逻辑结构

安企CMS的模板语法主要由两大部分构成:用于显示变量的双花括号 {{ }},以及用于处理逻辑结构的单花括号和百分号 {% %}

  • 显示变量 {{ 变量 }} 这是最常见的用法,用于将后端传递到前端的数据直接呈现在页面上。例如,如果您想显示网站的标题,可能会用到 {{ siteName }} 这样的形式。变量名通常遵循驼峰命名法则,即每个单词的首字母大写,例如 archive.Titlecategory.Link

  • 逻辑结构 {% 逻辑结构 %} 这类标签用于控制模板的渲染流程,比如进行条件判断、循环遍历数据集合等。与变量显示不同,逻辑结构标签需要成对出现,即有一个开始标签也必须有一个对应的结束标签。例如,一个条件判断结构会是 {% if 条件 %} ... {% endif %}

所有的模板文件都以.html为后缀,统一存放在/template目录下,并且建议使用UTF-8编码,以避免出现乱码。模板中用到的样式、JS脚本和图片等静态资源,则统一放在/public/static/目录中。

二、变量的灵活运用:如何获取与展示数据

在安企CMS中,要显示特定的数据,通常会结合使用模板标签来获取数据,然后通过双花括号语法来显示变量值。系统内置了丰富的标签,可以方便地获取不同类型的数据。

例如,您可以使用 system 标签来获取网站的系统配置信息:

{# 使用 system 标签获取网站名称,并存储到变量 siteName 中 #}
{% system siteName with name="SiteName" %}
<div>网站名称:{{ siteName }}</div>

{# 或者直接输出 #}
<div>网站备案号:{% system with name="SiteIcp" %}</div>

类似地,如果您需要显示文章详情页的标题,可以直接在文档详情页面使用 archiveDetail 标签:

{# 获取当前文章的标题 #}
<h1>{% archiveDetail with name="Title" %}</h1>

{# 获取指定ID文章的链接 #}
{% archiveDetail articleLink with name="Link" id="1" %}
<p>第一篇文章链接:<a href="{{ articleLink }}">点击查看</a></p>

对于像文章内容这样的可能包含HTML标签的数据,为了防止浏览器将其作为纯文本显示或引发安全问题,我们通常会配合使用 |safe 过滤器,确保HTML能够被正确解析:

{# 显示文章内容,并确保HTML标签被正确解析 #}
{% archiveDetail articleContent with name="Content" %}
<div>{{ articleContent|safe }}</div>

时间戳数据也需要特殊处理。安企CMS提供了 stampToDate 标签,可以将10位时间戳格式化为我们可读的日期和时间格式:

{# 假设 item.CreatedTime 是一个时间戳,将其格式化为“年-月-日 时:分” #}
<span>发布时间:{{ stampToDate(item.CreatedTime, "2006-01-02 15:04") }}</span>

三、逻辑结构的实现:控制模板流程

逻辑结构标签让模板变得“智能”,能够根据数据状态或特定条件来调整页面的显示。

  • 条件判断 {% if %}{% elif %}{% else %} 这是最基础的逻辑控制,用于根据条件决定是否显示某个区块的内容。

    {% if item.IsCurrent %}
        <li class="active">{{ item.Title }}</li>
    {% elif item.Status == "pending" %}
        <li class="pending">{{ item.Title }}</li>
    {% else %}
        <li>{{ item.Title }}</li>
    {% endif %}
    
  • 循环遍历 {% for %}{% empty %} 当您需要显示一个列表或集合中的多条数据时,for 循环是不可或缺的。它会遍历集合中的每一个元素,并在每次迭代时将当前元素赋值给您定义的变量。

    {# 遍历一个文章列表 #}
    {% archiveList archives with type="list" limit="5" %}
        {% for article in archives %}
            <li>
                <a href="{{ article.Link }}">{{ article.Title }}</a>
                <span>浏览量:{{ article.Views }}</span>
            </li>
        {% empty %}
            {# 如果 archives 列表为空,则显示此处的内容 #}
            <li>目前没有文章可供显示。</li>
        {% endfor %}
    {% endarchiveList %}
    

    您还可以使用 forloop.Counter 来获取当前循环的索引(从1开始),或者 forloop.Revcounter 来获取剩余循环的数量,这在为列表项添加特殊样式或逻辑时非常有用。

  • 辅助标签 {% include %}{% extends %}{% macro %} 这些标签极大地提高了模板的可维护性和复用性:

    • {% include "路径/文件名.html" %}: 用于将一个模板片段(如页头、页脚、侧边栏)插入到当前模板中。您还可以使用 with 关键字向被包含的模板传递额外的变量,或者 only 来限制只传递指定的变量。
    • {% extends "基础模板.html" %}: 实现模板继承,定义一个基础骨架(如网站整体布局),然后在子模板中重写特定的 {% block %} 区域。这使得修改网站整体布局变得非常高效。
    • {% macro 宏名称(参数) %} ... {% endmacro %}: 定义可复用的模板函数。宏能够接受参数,并在模板的任何地方像函数一样调用,有效减少重复代码。
  • 定义变量 {% with %}{% set %} 在模板中临时定义变量可以帮助您更好地组织代码和数据。with 标签需要 {% endwith %} 结束,其定义的变量仅在其内部生效。set 标签则可以在当前模板的整个作用域中使用。

    {% with greeting="您好", user="安企CMS用户" %}
        <p>{{ greeting }}, {{ user }}!</p>
    {% endwith %}
    
    {% set pageTitle = "我的自定义页面" %}
    <title>{{ pageTitle }}</title>
    

四、数据的精细处理:过滤器的应用

过滤器用于对变量值进行转换或处理,语法格式为 {{ 变量 | 过滤器名称:参数 }}。过滤器可以链式使用,前一个过滤器的输出会作为后一个过滤器的输入。

一些常用且实用的过滤器包括:

  • |safe: 告诉模板引擎输出的变量是安全的 HTML,无需转义,常用于文章内容等富文本。
  • |truncatechars:10: 截断字符串,使其长度不超过10个字符,并附加省略号(例如:”这是一个长句子…“)。
  • |upper / |lower: 将字符串转换为大写或小写。
  • |add:5: 对数字进行加法运算,或对字符串进行拼接。
  • |cut:" ": 移除字符串中指定的所有字符(例如,移除所有空格)。
  • |length: 返回字符串、数组或映射的长度。
  • |floatformat:2: 格式化浮点数,保留指定位数的小数。
  • |join:", ": 将数组元素用指定的分隔符连接成一个字符串。
  • |split:", ": 将字符串按指定分隔符分割成一个数组。
  • |dump: 用于调试,打印出变量的详细结构和值,帮助您了解数据的真实面貌。

掌握了这些模板语法和工具,您就能够充分利用安企CMS的强大功能,打造出既美观又

相关文章

如何确保AnQiCMS模板文件以UTF-8编码,避免页面显示乱码?

在使用AnQiCMS搭建网站的过程中,偶尔会遇到页面显示内容出现乱码的情况,尤其是中文字符。这不仅影响了网站的美观和用户体验,也可能对搜索引擎优化(SEO)造成负面影响。乱码问题通常与模板文件的编码格式不统一有关,而确保AnQiCMS模板文件以UTF-8编码保存是解决这一问题的关键一步。 ### 为什么UTF-8编码至关重要? UTF-8作为一种变长字符编码,几乎可以涵盖世界上所有字符

2025-11-08

AnQiCMS模板文件应如何命名和组织以实现**显示效果?

在安企CMS中,网站的显示效果与模板文件的命名和组织方式有着密不可分的关系。一个良好规划的模板结构不仅能让网站看起来整洁美观,更能极大提升开发效率、方便后期维护,确保在不同场景下内容都能得到**呈现。 ### 模板文件的基石:`/template` 目录与 `config.json` 安企CMS网站的所有视觉呈现都始于 `/template` 目录。这是所有模板文件的家园。每一套独立的模板

2025-11-08

如何利用AnQiCMS过滤器,将HTML内容中的特定属性值进行批量修改?

在网站内容管理中,我们经常会遇到需要对大量HTML内容中的特定属性值进行统一调整或批量修改的场景。例如,你可能需要更新所有图片的高度属性,或者为某些链接添加特定的`rel`属性,甚至是调整富文本编辑器生成的某些标签的样式。AnQiCMS 提供了灵活的工具来应对这些需求,其中后台的批量替换功能是直接修改存储内容的利器,而模板过滤器则能在内容输出时进行动态转换,两者结合,能够高效地管理和优化网站内容

2025-11-08

在调试AnQiCMS模板时,如何快速查看变量中包含的原始HTML内容?

在安企CMS的模板开发过程中,我们经常需要查看变量中究竟包含了哪些内容,尤其当变量可能承载HTML结构时,如何快速准确地看到其原始的HTML内容,而不是被浏览器解析或转义后的结果,是高效调试的关键。安企CMS采用了类似Django的模板引擎语法,提供了几种强大的工具来帮助我们解决这个问题。 ### 理解调试的需求:为什么需要查看原始HTML? 在模板中直接使用 `{{ 变量名 }}`

2025-11-08

AnQiCMS模板支持哪些页面适配模式,如何选择和实现响应式显示?

在多屏时代,用户通过各种设备访问网站已是常态。为了确保网站在任何设备上都能提供流畅且友好的体验,页面适配成为了网站建设不可或缺的一环。AnQiCMS(安企内容管理系统)充分考虑了这一需求,提供了多种灵活的模板适配模式,帮助用户轻松应对不同设备的显示挑战。 ### AnQiCMS 提供的页面适配模式 AnQiCMS 在模板设计上提供了三种主要的页面适配模式

2025-11-08

如何将模板中的页头、页脚等公共部分模块化,并在各页面引用以统一显示?

在网站运营中,保持网站页面的统一性和高效管理是提升用户体验和运营效率的关键。对于安企CMS(AnQiCMS)用户而言,将页头、页脚、导航栏等公共部分进行模块化处理,不仅能确保全站视觉风格的一致性,更能大幅简化后续的维护和更新工作。安企CMS 提供了一套强大而灵活的模板机制,让您轻松实现这一目标。 ### 理解 AnQiCMS 的模板架构 AnQiCMS 的模板文件通常存放在

2025-11-08

如何为特定文章、分类或单页面自定义其显示模板,实现个性化布局?

在网站运营中,为特定的内容提供专属的展示方式,能够显著提升用户体验和内容营销效果。安企CMS(AnQiCMS)深谙此道,提供了灵活多样的模板定制功能,让您可以轻松为文章、分类或单页面打造独一无二的个性化布局。 安企CMS实现个性化模板定制主要有两种方式:一是通过遵循特定的**模板文件命名约定**,系统会自动识别并应用;二是在**后台管理界面手动指定**自定义模板文件。 --- ### 一

2025-11-08

如何在模板中实现基于条件(if/else)动态显示内容和布局?

在网站运营和前端开发中,我们常常需要根据不同的情况,灵活地展示内容或调整页面布局。这种动态变化的能力,正是安企CMS(AnQiCMS)模板中条件判断标签(`if/else`)的核心价值所在。安企CMS的模板引擎设计简洁而强大,它允许我们像编写程序代码一样,在页面中设定逻辑,让网站内容呈现出千变万化的可能。 ### 安企CMS模板的动态之美

2025-11-08