How to get and display the detailed information of a single article in AnQiCMS?

In AnQiCMS, managing and displaying content is one of its core functions.It is crucial to understand how to accurately obtain and display detailed information about a specific article when you need to present it to visitors.AnQiCMS provides a直观 and powerful template tag system that allows you to flexibly control the layout and content of article detail pages.

AnQiCMS template system overview

AnQiCMS templates use a syntax similar to the Django template engine. In the template files, you will encounter two main tags:

• double curly braces{{ 变量 }}: is used to output the value of a variable.
• single curly braces and percent signs{% 标签 %}Used to control the logic flow (such as conditional judgments, loops) or to call specific function tags.

Generally, the detail page template file of a single article follows certain naming conventions, such as being stored in{模型table}/detail.htmlsuch a path. For example, if your article belongs to the "article model", then the detail page template may bearticle/detail.html.

to get the core information of a single article:archiveDetailTag

To obtain and display the detailed information of a single article, AnQiCMS provides a specialarchiveDetailtag. This tag is the foundation for building the article detail page.

archiveDetailusage

When you use the template on the article detail pagearchiveDetailthe tag will default to retrieving the article data on the current page. You just need to specify the field name you want to retrieve.

For example, to display the article title, you can write it like this:

<h1>{% archiveDetail with name="Title" %}</h1>

here,name="Title"Tell the system what article title you want to get. Similarly, you can get other commonly used fields:

• Article content (Content)The main content of the article, usually containing HTML format. To ensure that the HTML content is rendered correctly rather than displayed as plain text, you need to use|safeFilter. If the article content uses a Markdown editor in the background, AnQiCMS will also automatically render it as HTML, but you can also userender=trueParameter forced rendering, orrender=falseTo cancel rendering.

  
  <div>{% archiveDetail archiveContent with name="Content" %}{{ archiveContent|safe }}</div>
  

• Article description (Description): It is usually the abstract or introduction of the article.

  
  <p>{% archiveDetail with name="Description" %}</p>
  

• Article link (Link): Article access address.

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

• Article thumbnail (LogoorThumb): The cover image or thumbnail of the article.

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

• Publish time (CreatedTime): AnQiCMS stores timestamps, you need to usestampToDatea function to format it into a readable date and time.

  
  <span>发布日期：{{ stampToDate(archive.CreatedTime, "2006-01-02 15:04") }}</span>
  

• Views (Views)The number of times the article has been accessed.

  
  <span>阅读量：{% archiveDetail with name="Views" %}</span>
  

• Article ID (Id) and the category ID (CategoryId)These are the unique identifiers and category identifiers of the articles, often used to obtain associated information further.

  
  <span>文章ID：{% archiveDetail with name="Id" %}</span>
  

指定特定文章

If you are not on the article detail page or need to get the details of other articles, you canidortokento specify the parameters:

{# 获取ID为10的文章标题 #}
<h2>{% archiveDetail with name="Title" id="10" %}</h2>
{# 获取URL别名为"my-first-article"的文章内容 #}
<div>{% archiveDetail with name="Content" token="my-first-article" %}{{archiveContent|safe}}</div>

Gain in-depth information about the related articles

An individual article is often not just its own content, but is closely related to categories, tags, custom attributes, and other information.The AnQiCMS template system allows you to easily retrieve this related data.

Get the detailed information of the article category

archiveDetailTags can be retrieved althoughCategoryIdIt only provides IDs. To get the category name and link, we need to combinecategoryDetail.

{# 先获取当前文章的完整对象（通常在详情页中，直接用`archive`变量即可，或者通过archiveDetail获取） #}
{% archiveDetail currentArchive with name="Id" %} {# 确保有archive对象，或先获取 #}
<p>所属分类：<a href="{% categoryDetail with name='Link' id=archive.CategoryId %}">{% categoryDetail with name='Title' id=archive.CategoryId %}</a></p>

here,id=archive.CategoryIdWill pass the category ID of the current article tocategoryDetailthe tag, so as to obtain the name and link of the category.

Get the tag list of the article

If your article has multiple tags set, you can usetagListLabels to display them.

<div class="article-tags">
    <strong>标签：</strong>
    {% tagList tags with itemId=archive.Id %}
        {% for tag in tags %}
            <a href="{{ tag.Link }}">{{ tag.Title }}</a>
        {% endfor %}
    {% endtagList %}
</div>

itemId=archive.IdEnsure the parameterstagListThe ones obtained are related tags of the current article.

Display the custom parameters of the article.

AnQiCMS allows you to add custom fields to the article model. These fields can be accessed viaarchiveParamstags, or directly througharchiveDetailSpecify the tagnameParameter to obtain.

{# 遍历显示所有自定义参数 #}
<div class="article-params">
    {% archiveParams params %}
        {% for item in params %}
            <p>{{ item.Name }}：{{ item.Value }}</p>
        {% endfor %}
    {% endarchiveParams %}
</div>

{# 如果您知道自定义字段的名称，可以直接获取，例如一个名为“author”的字段 #}
<p>作者：{% archiveDetail with name="author" %}</p>

the previous and next articles

At the bottom of the article detail page, links to the 'previous article' and 'next article' are usually displayed, convenient for users to browse.

<div class="navigation-links">
    {% prevArchive prev %}
        {% if prev %}
            <a href="{{ prev.Link }}">上一篇：{{ prev.Title }}</a>
        {% else %}
            <span>上一篇：没有了</span>
        {% endif %}
    {% endprevArchive %}

    {% nextArchive next %}
        {% if next %}
            <a href="{{ next.Link }}">下一篇：{{ next.Title }}</a>
        {% else %}
            <span>下一篇：没有了</span>
        {% endif %}
    {% endnextArchive %}
</div>

Get the SEO information of the page

of the article detail page's<head>The area needs to set appropriate SEO titles, keywords, and descriptions.tdkTags can help you dynamically retrieve this information.

<head>
    <title>{% tdk with name="Title" siteName=true %}</title>
    <meta name="keywords" content="{% tdk with name="Keywords" %}">
    <meta name="description" content="{% tdk with name="Description" %}">
</head>

siteName=trueThe parameter will be automatically appended to the article title, improving SEO friendliness.

Comprehensive example: Build a basic article detail page.

Here is an example of an integrated article detail page template that you can adjust and beautify according to your needs:

`twig {% extends ‘base.html’ %} {# inherit the base template, usually containing header, footer, etc. #}

{% block head_meta %}

{# 动态设置页面SEO信息 #}
<title>{% tdk with name="Title" siteName=true %}</title>
<meta name="keywords" content="{% tdk with name="Keywords" %}">
<meta name="description" content="{% tdk with name="Description" %}">
{# 规范链接 #}
{% tdk canonical with name="CanonicalUrl" %}
{% if canonical %}<link rel="canonical" href="{{canonical}}" />{% endif %}

{% endblock %}

{% block main_content %} <