`archiveDetail`标签如何获取并显示文档详情页的特定字段（如标题、内容、图片）？

在安企CMS搭建的网站中，每一个文档详情页都是展示核心内容、吸引访客停留的关键。为了确保这些页面能高效、灵活地呈现文章标题、内容、图片等重要信息，理解并善用archiveDetail标签就显得尤为重要。它正是您精确定位并灵活展示这些核心数据的强大工具。

驾驭archiveDetail标签：精确定位与展示文档详情内容

当您在AnQiCMS中创建了一个文章或产品详情页时，archiveDetail标签是您从数据库中提取当前页面或指定文档详细信息的关键。这个标签的设计理念是简洁而强大，让您能够轻松地将后端数据呈现在前端模板上。

archiveDetail的基本用法

在大多数情况下，当您正在编辑一个文档详情页（例如，article/detail.html或product/detail.html）时，archiveDetail标签会自动识别并获取当前页面所对应的文档数据。它最常见的用法是直接通过name属性指定您想要获取的文档字段。

例如，要显示当前文档的标题，您可以使用以下语法：

<div>文档标题：{% archiveDetail with name="Title" %}</div>

此外，在文档详情页的模板中，您通常也可以更直接地通过{{archive.字段名称}}这样的形式来访问当前文档的各项属性，例如{{archive.Title}}。这种方式更加简洁，适用于直接获取当前页面的文档信息。

如果您需要在非文档详情页（比如首页的某个区块）或者需要指定显示某篇特定文档的详情，archiveDetail标签也提供了id或token参数，让您能够根据文档的ID或URL别名来精确获取其数据：

{# 获取ID为1的文档标题 #}
<div>指定文档标题：{% archiveDetail with name="Title" id="1" %}</div>
{# 获取URL别名为"about-us"的文档内容 #}
<div>指定文档内容：{% archiveDetail with name="Content" token="about-us" %}</div>

获取并显示核心信息

接下来，我们来看看如何使用archiveDetail标签获取并显示文档详情页的常见字段：

1. 文档标题 (Title)

获取文档标题非常直接，它通常是页面上最显著的元素之一：

<h1>{% archiveDetail with name="Title" %}</h1>
{# 或者更简洁地 #}
<h1>{{archive.Title}}</h1>

2. 文档内容 (Content)

文档内容通常是页面上篇幅最长的部分，承载着信息主体。由于文档内容可能包含HTML标签（如段落、链接、图片等），为了确保这些HTML内容能够正确渲染而非被浏览器作为纯文本显示，您需要使用|safe过滤器。

<div>
    {%- archiveDetail articleContent with name="Content" %}
    {{articleContent|safe}}
</div>
{# 或者更简洁地 #}
<div>{{archive.Content|safe}}</div>

如果您的后台启用了Markdown编辑器，并且希望前端内容自动渲染为HTML，可以在archiveDetail标签中添加render=true参数：

{# 启用Markdown渲染 #}
<div>
    {%- archiveDetail articleContent with name="Content" render=true %}
    {{articleContent|safe}}
</div>

此外，如果您希望文档内容中的图片支持懒加载，可以结合前端懒加载库的需求，在archiveDetail标签中指定lazy="data-src"（根据您的懒加载库实际data-src属性名调整）：

{# 启用图片懒加载，将图片src属性替换为data-src #}
<div>
    {%- archiveDetail articleContent with name="Content" lazy="data-src" %}
    {{articleContent|safe}}
</div>

3. 文档图片 (Logo, Thumb, Images)

安企CMS提供了多种图片字段来满足不同展示需求：

• Logo：通常用于获取文档的主封面图或大图。

  
  <img src="{% archiveDetail with name="Logo" %}" alt="{% archiveDetail with name="Title" %}" />
  

• Thumb：用于获取文档的缩略图，通常是经过系统裁剪或压缩的小尺寸图片。

  
  <img src="{% archiveDetail with name="Thumb" %}" alt="{% archiveDetail with name="Title" %}" />
  

• Images：如果文档包含一组图片（例如产品详情页的轮播图），Images会返回一个图片URL数组。您需要使用for循环来遍历并显示这些图片：

  
  <div>
      {% archiveDetail archiveImages with name="Images" %}
      {% for item in archiveImages %}
          <img src="{{item}}" alt="文档图片" />
      {% endfor %}
  </div>
  

4. 其他常用字段

除了标题、内容和图片，archiveDetail标签还能获取许多其他有用的文档信息：

• 文档描述 (Description)：通常是文章的简介或摘要。

  
  <meta name="description" content="{% archiveDetail with name="Description" %}">
  

• 文档链接 (Link)：当前文档的URL地址。

  
  <a href="{% archiveDetail with name="Link" %}">查看详情</a>
  

• 浏览量 (Views)：显示文档的阅读或访问次数。

  
  <span>浏览量：{% archiveDetail with name="Views" %}</span>
  

• 发布时间 (CreatedTime) 和 更新时间 (UpdatedTime)：这些是时间戳，需要配合stampToDate标签进行格式化显示。

  
  <span>发布日期：{{ stampToDate(archive.CreatedTime, "2006年01月02日") }}</span>
  <span>更新时间：{{ stampToDate(archive.UpdatedTime, "2006-01-02 15:04:05") }}</span>
  

• 文档分类 (Category)：获取当前文档所属分类的详细信息，这在展示面包屑导航或相关分类时非常有用。

  
  {% archiveDetail currentCategory with name="Category" %}
  <a href="{{ currentCategory.Link }}">{{ currentCategory.Title }}</a>
  {% endarchiveDetail %}
  

• 自定义字段：AnQiCMS允许您为内容模型添加自定义字段。如果您的文档模型定义了如author、source等自定义字段，您可以直接通过name属性来获取它们：

  
  <span>作者：{% archiveDetail with name="author" %}</span>
  

  如果您想遍历所有自定义字段，可以使用archiveParams标签：

  
  {% archiveParams params %}
  <div>
      {% for item in params %}
          <span>{{item.Name}}：</span>
          <span>{{item.Value}}</span>
      {% endfor %}
  </div>
  {% endarchiveParams %}
  

实际应用场景示例

让我们看一个典型的文章详情页的结构，如何通过archiveDetail及相关标签来构建：

”`twig {% extends ‘base.html’ %} {# 继承基础模板 #}

{% block content %}

{# 获取并显示文档标题 #}
<h1>{% archiveDetail with name="Title" %}</h1>

<div class="meta-info">
    {# 显示文档分类 #}
    {% archiveDetail currentCategory with name="Category" %}
    <span>分类：<a href="{{ currentCategory.Link }}">{{ currentCategory.Title }}</a></span>
    {% endarchiveDetail %}

    {# 显示发布时间 #}
    <span>发布日期：{{ stampToDate(archive.CreatedTime, "2006