在网站运营中，“关于我们”、“联系方式”、“隐私政策”这类独立页面扮演着至关重要的角色，它们是向访客展示企业信息、建立信任的基础。AnQiCMS作为一个高效的内容管理系统，提供了非常灵活且直观的方式来创建和展示这些单页面的详细内容。

一、理解独立页面在AnQiCMS中的定位

AnQiCMS将这类页面归类为“单页面”，它不同于常规的文章或产品列表，每个单页面通常承载着一份独特的、非周期性更新的信息。系统为这些页面提供了专门的管理入口和丰富的自定义选项，确保您能轻松发布和更新它们。

二、 在AnQiCMS后台创建和管理独立页面

要开始创建一个独立页面，您只需登录AnQiCMS后台，导航到左侧菜单的“页面资源”，然后点击“页面管理”。在这里，您可以添加新的页面或编辑已有的页面。

在添加或编辑页面时，您会看到一系列字段，它们帮助您全面定义这个页面：

  • 页面名称：这是您页面在前台显示的标题，例如“关于我们”或“联系我们”。
  • SEO标题、关键词与简介：这些字段专为搜索引擎优化设计，能帮助您的页面在搜索结果中获得更好的可见度。您可以根据页面内容填写相关的SEO信息。
  • 自定义URL：AnQiCMS允许您为页面设置一个简洁、友好的URL地址（例如 /about-us 或 /contact），这不仅美观，也有助于提升SEO效果。系统会根据您输入的页面名称自动生成一个拼音URL作为默认值，您也可以根据需要手动修改。
  • 单页面内容：这是页面的核心，您可以在这里输入所有详细信息。AnQiCMS提供了功能丰富的编辑器，支持图文混排、视频插入、代码展示等多种内容形式。值得一提的是，如果后台启用了Markdown编辑器，您甚至可以直接用Markdown语法撰写内容，系统在前端展示时会自动将其转换为HTML，让内容创作更加高效。
  • 单页面模板：这是AnQiCMS提供的一项强大功能，您可以为特定的单页面指定一个独有的模板文件。这意味着“关于我们”页面可以有A样式，而“联系我们”页面可以有B样式，实现高度个性化的展示。如果未指定，页面会使用默认的 page/detail.html 模板。
  • Banner图与缩略图：如果您的页面需要展示头部Banner或列表缩略图，可以在这里上传相应的图片。

通过这些细致的设置，您可以确保每个独立页面都拥有清晰的结构、优化的内容和独特的展示风格。

三、 在前端模板中展示独立页面内容

当您在后台创建好独立页面后，接下来就是如何在您的网站前端模板中将其内容展示出来。AnQiCMS提供了专门的模板标签 pageDetail 来轻松实现这一点。

通常情况下，独立页面的详情会使用 page/detail.html 或您在后台指定的自定义模板文件。在这个模板文件中，您可以利用 pageDetail 标签来获取并渲染页面中的各项数据。

以下是一些常用的 pageDetail 标签用法示例，用于获取页面标题、内容、描述等：

  • 获取页面标题： <h1>{% pageDetail with name="Title" %}</h1> 如果您希望标题同时包含网站名称，可以这样写： <h1>{% pageDetail with name="Title" siteName=true %}</h1>

  • 获取页面主要内容： 页面的主要文本内容通常包含HTML富文本，因此在输出时需要使用 |safe 过滤器来防止HTML标签被转义，确保内容正确渲染。

    <article>
    {% pageDetail pageContent with name="Content" %}
    {{ pageContent|safe }}
</article>

  • 获取页面描述（用于Meta标签）： <meta name="description" content="{% pageDetail with name="Description" %}">

  • 获取页面Banner图或缩略图： 如果您的页面设置了Banner图，并且希望将其作为背景或图片展示：

    {% pageDetail pageBannerImages with name="Images" %}
{% if pageBannerImages %}
    <div class="page-banner" style="background-image: url('{{ pageBannerImages[0] }}');"></div>
{% endif %}

    这里 pageBannerImages[0] 表示获取上传的第一张图。

通过这些标签，您可以灵活地将后台录入的各种信息呈现在网站的任何位置。pageDetail 标签会自动识别当前页面的ID或URL别名，从而获取对应页面的数据。如果您需要获取特定ID的独立页面内容（例如，在首页展示一个固定ID的“关于我们”简介），您也可以通过 id 参数来指定：

<div>这是我的公司简介：{% pageDetail with name="Content" id="10" %}|safe}}</div> (假设ID为10是关于我们页面)

AnQiCMS的模板系统还支持Django模板引擎语法，这意味着您可以结合 if、for 等逻辑标签，实现更复杂的页面布局和条件展示。例如，判断是否有Banner图，再决定是否显示某个区域。

四、 实际案例：搭建一个“联系我们”独立页面

让我们通过一个简单的“联系我们”页面，来串联整个流程。

  1. 后台创建页面：

    • 进入“页面资源” -> “页面管理”，点击“添加新页面”。
    • 页面名称：联系我们
    • SEO标题：联系我们 - [您的公司名称]
    • 自定义URL：contact
    • 单页面内容：在编辑器中输入您的公司地址、电话、邮箱、地图嵌入代码等详细信息。
    • 单页面模板：可以留空使用默认的 page/detail.html，或者为了更精细控制，创建一个 page/contact.html 并在这里指定。
    • 点击保存。

  2. 前端模板编写（以 page/detail.html 为例）： 在您的 template/default/page/detail.html 文件中（或者 page/contact.html），您可以这样组织代码来显示内容：

    ”`twig <!DOCTYPE html> 

    <meta charset="UTF-8">
{# 使用tdk标签获取页面的SEO标题，并带上网站名称后缀 #}
<title>{% tdk with name="Title" siteName=true %}</title>
{# 获取页面的SEO描述 #}
<meta name="description" content="{% tdk with