In the security CMS, the display of article or product detailed content pages is the core link of website content operation.An elegantly designed, comprehensive detail page that not only effectively conveys content value but also enhances user experience and search engine friendliness.Auto CMS provides a powerful and flexible set of tools, allowing us to easily achieve these goals.

The foundation of content: content model and template files

In the AnQi CMS, all articles and products are treated as “content” (archive). They can display different forms, such as a news article and a product detail page, thanks to the flexible nature of AnQi CMS.Content ModelFeature.We can customize content models according to business needs, configuring exclusive fields for different types of content (such as "article model" or "product modelThese custom fields are the source of personalized information displayed on the detail page.

When the content is created and published in the background, how to present it to the user on the front end depends onTemplate filethe decision. The template system of Anqi CMS adopts syntax similar to Django template engine,.htmlAs a template file suffix. For detailed content pages of articles or products, it is usually used.{模型table}/detail.htmlSuch naming conventions. For example, if your content model is 'article' (usually corresponding toarticleTable), then the default detail page template file isarticle/detail.htmlIf you want a specific article or product to use a unique layout, you can also specify a custom template file for it in the background, for examplearticle/your-special-story.htmlEnglish only: If this file exists, the system will adopt it first.

English only: Clever use of core features.archiveDetailtags

To dynamically display content data on the detail page, we need to rely on the Anqi CMS.Template tags，where the most crucial one isarchiveDetaillabel. This label is the key to obtaining all the detailed data of the current article or product

We can use it in many waysarchiveDetailTags:

  • Directly access the fields on the current page:In any article or product detail page, you can use it directly{{archive.文档字段}}to call the various information of the current content. For example, to display the title, just{{archive.Title}}.
  • specify the field to obtain:If you want to get a specific field more explicitly, you can use{% archiveDetail with name="字段名称" %}. For example, to get the title of the current content:{% archiveDetail with name="Title" %}.
  • Display rich text content safely:For rich text content that may contain HTML tags, such as article or product descriptions (Contentfield), we must use|safeFilter, for example{{archive.Content|safe}}.This ensures that the HTML content is correctly parsed and rendered, rather than displayed as plain text.render=trueparameters for manual control, such as{{archive.Content|render|safe}}.
  • images and multimedia:The detail page often needs to display images.archiveDetailYou can conveniently get thumbnails (ThumbCover imageLogo) even a set of images (Images, and need to display through forloop traversal).
  • The presentation of custom fields:For various custom fields you define in the content model (such as “Product Model”, “Author”), you canarchiveParamsLabels to get and display. You can iterate over all custom parameters to display them uniformly, or you can display them directly through{% archiveDetail with name="您的自定义字段名" %}To get the value of a specific field

For example, a typical article detail page may be displayed as follows:

<article>
    <h1>{% archiveDetail with name="Title" %}</h1>
    <div class="meta-info">
        <span>发布时间：{{ stampToDate(archive.CreatedTime, "2006-01-02") }}</span>
        <span>浏览量：{% archiveDetail with name="Views" %}</span>
        <a href="{% categoryDetail with name='Link' %}">分类：{% categoryDetail with name='Title' %}</a>
    </div>
    <div class="content">
        {% archiveDetail articleContent with name="Content" render=true %}{{ articleContent|safe }}
    </div>
    {% if archive.自定义字段名 %}
    <div class="custom-field">
        自定义信息：{% archiveDetail with name="自定义字段名" %}
    </div>
    {% endif %}
</article>

Enhance user experience: Details that shine

An excellent detail page, not just a pile of content, but also needs to consider the user's browsing experience and information acquisition efficiency. Anqi CMS provides various auxiliary tags to enrich the functions of the detail page:

  • Clear navigation path: breadcrumbs(breadcrumbTag) Navigating through breadcrumbs allows users to clearly understand the current page's position in the website structure, making it convenient to backtrack. In the template, use{% breadcrumb crumbs %}It can be generated.
  • Linked before and after: the previous article and the next article.(prevArchiveandnextArchive标签) In the bottom of the article or product details, adding "Previous" and "Next" links can effectively guide users to continue browsing related content and extend the time users stay.
  • Smart recommendation: related content(archiveListtags, withtype="related") According to the current detail page content (such as same category, same keywords), intelligently recommend related articles or products, which can improve the content discovery rate and user stickiness.
  • Interactive Feedback: Comment System(commentList标签) If your website allows users to comment, you can integrate a comment list and a comment form at the bottom of the details page to enhance user engagement.The submission and like features both provide corresponding API interfaces.
  • Optimize Visibility: TDK Settings(tdk标签) 虽然详情页的TDK（标题、关键词、描述）大部分在内容发布时已设置，但模板标签tdk可以在页面headEnsure that these SEO key information is correctly output, for example:
    
<title>{% tdk with name="Title" siteName=true %}</title>
<meta name="keywords" content="{% tdk with name="Keywords" %}">
<meta name="description" content="{% tdk with name="Description" %}">

URL structure and SEO: The help of pseudo-statics

The URL structure of the detail page is crucial for search engine optimization (SEO). Anqi CMS supports powerfulStatic rulesCustomization, we can configure the URL of the article or product detail page to be displayed in a friendly and meaningful way, rather than with lengthy dynamic parameters. For example,/article?id=123Optimized to `/article/my-great-