How to use `archiveDetail` tag to retrieve and completely display the title, content, and custom fields of a specific document?

In AnQiCMS, displaying the detailed content of a single document is one of the core requirements for website construction.Whether it is an article detail page, a product detail page, or other custom type content display, we need a flexible and efficient way to obtain and present the title, text, and custom fields defined according to business needs.archiveDetailLabels are born for this, they can help you easily achieve this goal.

Deeply UnderstandarchiveDetailLabel: Get the core information of a specific document

archiveDetailThe tag is mainly used to obtain detailed data of a single document.When you need to fully present all the information of a document on a page, it will be your helpful assistant.The strength of this tag lies in its ability not only to retrieve the default fields of the document (such as title, content) but also to easily access various fields that you have customized for this document type in the "Content Model" on the backend.

Its basic usage syntax is:{% archiveDetail 变量名称 with name="字段名称" id="文档ID" %}

Among them,变量名称Is optional, if set, you can assign the data obtained to this variable, and then reference{{变量名称}}it by; if not set, the tag will try to output the specified field value directly.

• Specify document:In most cases,archiveDetailThe document on the current page will be automatically recognized in the document detail page. But if you need to getspecific IDof the document information,id="文档ID"parameters, such asid="123"can be added.token="文档URL别名"parameter to specify the document.
• Multi-site support:If your AnQiCMS has deployed multiple sites and needs to access document data across sites, you can usesiteId="站点ID"Parameter.

Get the core information of the document: title and content

To display the title and content of the document, you just need tonamespecify the corresponding field name in the parameters.

1. To get the document title (Title):The document title is the core identifier of the content. Usename="Title"to get it.

   {# 获取当前页面文档的标题 #}
   <h1>{% archiveDetail with name="Title" %}</h1>
   
   
   {# 获取ID为1的文档标题，并赋值给archiveTitle变量 #}
   {% archiveDetail archiveTitle with name="Title" id="1" %}
   <p>指定文档标题：{{ archiveTitle }}</p>
   

2. Get document content (Content):Document content usually contains rich HTML structures, including text, images, links, etc. When retrieving, it is important to pay attention to a filter:|safe.

   {# 获取当前页面文档的内容，并使用|safe过滤器防止HTML转义 #}
   <div class="article-content">
       {% archiveDetail articleContent with name="Content" %}
       {{ articleContent|safe }}
   </div>
   
   
   {# 如果您的内容包含Markdown语法，可以使用render=true进行转换 #}
   <div class="article-content">
       {% archiveDetail articleContent with name="Content" render=true %}
       {{ articleContent|safe }}
   </div>
   
   
   {# 如果您使用了图片懒加载插件，可以指定lazy="data-src"来适配 #}
   <div class="article-content">
       {% archiveDetail articleContent with name="Content" lazy="data-src" %}
       {{ articleContent|safe }}
   </div>
   

   Special reminder: ContentThe field usually stores rich text content with HTML tags. In order for the browser to correctly parse and display these HTML structures,Mustuse them when outputting.|safefilters (for example{{ articleContent|safe }}）。Otherwise，HTML tags will be displayed as plain text on the page, affecting reading experience.

Customize fields in depth: Flexibly display personalized content

The powerful "Content Model" function of AnQiCMS allows you to add various custom fields to different types of documents to meet specific business needs, such as product prices, article authors, video durations, and so on.archiveDetailThe label also fully supports retrieving these custom fields.

1. Retrieve specific custom fields:If you know the 'Called field' name of the custom field (defined in the back-end content model), you can access it directly byname="自定义字段名"to get its value.

   Suppose you have defined a field named in the content modelauthorwith a name:

   {# 获取当前文档的作者信息 #}
   <p>作者：{% archiveDetail with name="author" %}</p>
   
   
   {# 获取ID为10的文档的产品价格字段 #}
   <p>产品价格：{% archiveDetail with name="price" id="10" %}</p>
   

2. Loop to display all custom fields (archiveParams):Sometimes, you may wish to traverse and display all custom fields in the document, especially in scenarios such as product parameter lists. At this time, you can usearchiveParamsTag to get all custom parameters of the document, then throughforLoop to display.

   <div class="custom-params">
       <h3>更多参数：</h3>
       {% archiveParams params %}
       {% for item in params %}
       <p>
           <span>{{ item.Name }}：</span>
           <span>{{ item.Value }}</span>
       </p>
       {% endfor %}
       {% endarchiveParams %}
   </div>
   

   archiveParamsTag will return an array (or map, depending onsortedparameters).item.Nameis the display name of the custom field.item.ValueThe corresponding value.

Comprehensive example: Build a complete document detail page

Integrating the above elements, a typical document detail page template fragment may look like this:

`twig <!DOCTYPE html>

<meta charset="UTF-8">
<title>{% archiveDetail with name="Title" siteName=true %}</title>
<meta name="description" content="{% archiveDetail with name="Description" %}">
<meta name="keywords" content="{% archiveDetail with name="Keywords" %}">
<link rel="stylesheet" href="{% system with name="TemplateUrl" %}/css/style.css">

<header>
    <!-- 导航、Logo等页面头部元素 -->
</header>

<main class="container">
    <article class="document-detail">
        <h1 class="document-title">{% archiveDetail with name="Title" %}</h1>

        <div class="document-meta">
            <span>分类：<a href="{% categoryDetail with name='Link' %}">{% categoryDetail with name='Title' %}</a></span>
            <span>发布日期：{% archiveDetail with name="CreatedTime" format="2006-01-02" %}</span>
            <span>浏览量：{% archiveDetail with name="Views" %}</span>
            {% archiveDetail author with name="author" %}{# 假设有一个自定义字段叫 author #}
            {% if author %}<span class="document-author">作者：{{ author }}</span>{% endif %}
        </div>

        <div class="document-description">
            <p>{% archiveDetail with name="Description" %}</p>
        </div>

        <div class="document-content">
            {% archiveDetail documentContent with name