如何在AnQiCMS模板中方便地引入公共的页头和页脚代码片段？
在网站开发和运营中，页头（Header）和页脚（Footer）几乎是每个页面都不可或缺的部分。它们承载着导航、品牌标识、版权信息、联系方式等重要内容。然而，如果每个页面都独立编写这些代码，不仅会造成大量重复工作，还会让后续的修改和维护变得异常复杂。想象一下，如果网站有上百个页面，每次要修改导航菜单或者底部版权信息，都需要手动逐一调整，那将是多么低效和容易出错。
幸运的是，AnQiCMS 提供了强大而灵活的模板机制，能够帮助我们优雅地解决这个问题。它允许我们将公共的页头和页脚代码片段抽取出来，集中管理和复用，从而大幅提升网站的开发效率和维护便利性。
为什么模块化管理页头和页脚至关重要？
将页头和页脚代码片段化并集中管理，带来的好处是显而易见的：
- 提升维护效率：所有页头或页脚的修改，只需在一个文件中进行，即可影响全站。这极大地减少了重复劳动，降低了出错的风险。
- 确保全站一致性：无论是品牌视觉、导航结构还是法律声明，模块化管理能确保它们在所有页面上保持统一，提升用户体验和品牌专业度。
- 优化团队协作：在多开发人员参与的项目中，不同成员可以专注于各自模块的开发，减少代码冲突，提高协作效率。
- 改善代码可读性：页面模板只包含核心内容代码，结构更加清晰，易于阅读和理解。
- 有利于 SEO：避免大量重复的冗余代码，使搜索引擎爬虫能更高效地抓取和理解页面内容。
AnQiCMS 采用了类似 Django 模板引擎的语法，这使得内容运营者和开发者都能非常容易上手。它主要通过两种核心机制来实现模板的模块化管理：include 标签和 extends 标签。
方法一：使用 include 标签，灵活组合代码片段
include 标签的作用，就像搭积木一样，将常用的小部件预先制作好，然后在需要的地方“嵌入”进来。对于那些不构成页面整体骨架，但在多个地方重复出现的小块代码，比如侧边栏、面包屑、独立的广告位，甚至是简单的页头和页脚，include 都是一个非常便捷的选择。
基本用法：
假设你已经将页头代码保存在 partial/header.html 文件中，页脚代码保存在 partial/footer.html 文件中（partial 目录是 AnQiCMS 推荐存放代码片段的地方），那么你可以在任何页面模板中，通过以下方式引入它们：
{# 引入公共页头 #}
{% include "partial/header.html" %}
{# 页面核心内容 #}
<main>
<h1>这是页面的主要内容</h1>
<p>这里是页面的详细信息...</p>
</main>
{# 引入公共页脚 #}
{% include "partial/footer.html" %}
传递变量：
有时，被引入的页头或页脚可能需要一些当前页面的特定信息。例如，页头可能需要显示当前页面的标题。你可以使用 with 关键字向 include 的模板传递变量：
{% include "partial/header.html" with pageTitle="当前文章详情" %}
然后在 partial/header.html 中，就可以像普通变量一样使用 {{ pageTitle }}。
只传递指定变量：
如果你希望被引入的模板只使用你明确传递的变量，而不继承当前模板的所有变量，可以加上 only 关键字：
{% include "partial/header.html" with pageTitle="当前文章详情" only %}
条件引入：
如果某个代码片段并非所有页面都必须有，或者你希望它只有在文件存在时才被引入，可以使用 if_exists：
{# 如果 partial/sidebar.html 存在，则引入，否则忽略 #}
{% include "partial/sidebar.html" if_exists %}
include 标签的优点是轻量和灵活，它适合那些相对独立、可以在不同页面或不同布局中随意组合使用的代码片段。
方法二：利用 extends 标签构建模板骨架
如果说 include 是搭积木，那么 extends 更像是在设计一份报纸的版面骨架。它允许你定义一个“母版”模板（通常命名为 base.html），其中包含网站的通用结构，如整个 HTML 文件的框架、页头、页脚、侧边栏等，并用 {% block %} 标签标记出可供子模板重写或填充的区域。
定义母版 base.html：
<!DOCTYPE html>
<html lang="{% system with name='Language' %}">
<head>
<meta charset="UTF-8">
<title>{% block title %}{% tdk with name="Title" siteName=true %}{% endblock %}</title>
<meta name="keywords" content="{% tdk with name='Keywords' %}">
<meta name="description" content="{% tdk with name='Description' %}">
<link rel="stylesheet" href="{% system with name='TemplateUrl' %}/css/style.css">
{% block head_extra %}{% endblock %} {# 预留给子模板添加额外的head内容 #}
</head>
<body>
<header>
{% include "partial/top_nav.html" %} {# 顶部导航，可以是include进来的 #}
<h1>{% block page_header %}默认页面标题{% endblock %}</h1>
</header>
<div class="container">
{% block content %}
{# 这里是页面的主要内容区域，由子模板填充 #}
<p>欢迎来到 AnQiCMS 网站！</p>
{% endblock %}
</div>
<footer>
{% include "partial/footer.html" %} {# 页脚，也可以是include进来的 #}
<p>© {% now "2006" %} {% system with name="SiteName" %} All Rights Reserved.</p>
</footer>
<script src="{% system with name='TemplateUrl' %}/js/main.js"></script>
{% block body_extra %}{% endblock %} {# 预留给子模板添加额外的body底部内容 #}
</body>
</html>
在 base.html 中，我们用 {% block title %}、{% block head_extra %}、{% block page_header %}、{% block content %} 和 {% block body_extra %} 定义了可替换或扩展的区域。
子模板 article_detail.html 继承并重写：
{% extends 'base.html' %} {# 必须是模板文件的第一行 #}
{# 重写页面标题，显示文章标题 #}
{% block title %}{{ archive.Title }} - {% system with name="SiteName" %}{% endblock %}
{# 为当前页面添加特定的CSS或JS #}
{% block head_extra %}
<link rel="stylesheet" href="{% system with name='TemplateUrl' %}/css/article.css">
{% endblock %}
{# 重写页面大标题 #}
{% block page_header %}
<h1>{{ archive.Title }}</h1>
<p>发布时间：{{ stampToDate(archive.CreatedTime, "2006-01-02") }}</p>
{% endblock %}
{# 填充文章内容区域 #}
{% block content %}
<article>
<div>{{ archive.Content|safe }}</div>
</article>
<aside>
{# 这里可以放相关文章、评论区等 #}
</aside>
{% endblock %}
{# 为当前页面添加特定的JS脚本 #}
{% block body_extra %}
<script src="{% system with name='TemplateUrl' %}/js/article_detail.js"></script>
{% endblock %}
通过 extends 标签，子模板清晰地继承了 base.html 的结构，并只关注自身独特的内容和样式，极大地简化了页面开发。请务必记住，`{%