How to call and display the data of the custom model field in the document?

In Anqi CMS, the flexible content model is one of its core advantages, allowing us to create various information carriers such as articles, products, and so on according to different business needs, and define unique properties for them.How to present the data of these personalized fields customized for the document on the front end of the website is a focus of many users.This article will detail the process for you, helping you easily master the custom model fields of Anqi CMS.

Understanding the value of custom model fields

Firstly, let us clarify the importance of custom model fields.In content management, standard fields (such as title, content, and publish time) are often not enough to meet all display needs.For example, a product model may need fields such as "product modelThe AnQi CMS custom model field function is exactly designed to meet this personalized demand.It makes your content structure more in line with actual business, not only improves the fineness of data management, but also provides infinite possibilities for the diversified display of front-end pages.By using it reasonably, you can create website content that is more informative and closer to the needs of users.

Backend settings: Creating and entering custom field data

Before calling the custom field data, we need to complete the field creation and data entry in the background.

1. Create a custom model field:

   • Enter the Anqi CMS backend, navigate to "Content Management" -> "Content Model".
   • Select the model you want to add a custom field to (such as "article model" or "product model"), click "modify".
   • On the model editing page, find the "Content model custom field" area, click "Add field".
   • Parameter NameThis is the field name displayed in the background for administrators, for example, 'Article Author', 'Product Price'.
   • Field invocation:This is the key name used to call the field data in the template.. Please make sure to use letters, and it is recommended to use camel case naming (for examplearticleAuthor/productPrice). This name will be written to the database and is the unique identifier for data recognition in the template
   • Field typeSelect an appropriate type based on the data characteristics, such as single-line text, numbers, multi-line text, single-choice, multiple-choice, dropdown, etc.This will determine the input method you use when entering data in the background.
   • Mandatory?: Set according to your needs.
   • Default valueCan preset a default value. Save the model after completion.

2. Enter custom field data:

   • Navigate to 'Content Management' -> 'Document Management' (or the corresponding model list).
   • Click 'Add Document' or edit an existing document.
   • On the document editing page, after selecting the category, the page will load all fields of the model belonging to the selected category.Scroll down, you will see the fields you just customized in the 'Other Parameters' collapse box.
   • Here, you can fill in the corresponding custom field data for each document. This is the content that we will display on the front-end page later.

Template call: How to display custom data on the page

Completed the background setting and data entry, next is the call of the front-end template. The template engine of Anqi CMS is similar to Django syntax, using{{变量}}to output data,{% 标签 %}Come to handle the logic.

1. Call the data of a single known custom field.

When you know exactly which specific custom field data you want to display, you can usearchiveDetailTo get the label. This method is often used on document detail pages.

Suppose you have created a custom field named "Article Author" for the "Article Model" in the background, whose "call field" isarticleAuthor. In the article detail page template, you can call it like this:

{# 直接输出文章作者的自定义字段数据 #}
<div>文章作者：{% archiveDetail with name="articleAuthor" %}</div>

{# 将文章作者的数据赋值给一个变量再输出，方便后续处理 #}
{% archiveDetail authorName with name="articleAuthor" %}
<div>作者：{{ authorName }}</div>

Key point:nameThe value must match the 'Call field' set in the 'Content Model Custom Field' on the backend (including case).

2. Traverse and display all custom field data

Sometimes, you may want to dynamically display all custom fields of a document on a page, or you may not be sure which custom fields there are, in which case you can usearchiveParamstags to iterate over.

In the document detail page template, you can use it like this:

{# 遍历显示当前文档的所有自定义字段 #}
{% archiveParams params %}
<div class="custom-fields">
    {% for item in params %}
    <p>
        <span>{{ item.Name }}：</span>
        <span>{{ item.Value }}</span>
    </p>
    {% endfor %}
</div>
{% endarchiveParams %}

Explanation:

• {% archiveParams params %}: This line of code will retrieve all the custom field data of the current document and store it inparamsthis variable.
• {% for item in params %}: Due toparamsis an array (or iterable object) that contains all custom fields, we can useforto iterate over it.
• {{ item.Name }}:item.NameDisplays the custom field name set in the background (i.e., the Chinese display name).
• {{ item.Value }}:item.ValueDisplays the specific data value corresponding to the custom field.

Advanced usage: Filter out fields that do not need to be displayedIf you want to iterate through and display most fields but exclude certain specific fields (such as some internally used fields), you can combineifLabel for judgment:

{% archiveParams params %}
<div class="custom-fields">
    {% for item in params %}
        {% if item.FieldName != 'internalNotes' and item.FieldName != 'secretCode' %}
        <p>
            <span>{{ item.Name }}：</span>
            <span>{{ item.Value }}</span>
        </p>
        {% endif %}
    {% endfor %}
</div>
{% endarchiveParams %}

Note: Here is useditem.FieldName, it corresponds to the background settings of 'Call field'.

3. Call custom field data on the document list page

On the document list page (for example, displaying product lists), you may want each product to display its price, model, and other custom fields. In this case, you will usearchiveList.

{# 假设您正在循环产品列表，并希望显示每项产品的产品型号（调用字段：productModel）和价格（调用字段：productPrice） #}
{% archiveList products with type="page" moduleId="2" limit="10" %} {# moduleId="2" 假设是产品模型ID #}
    {% for item in products %}
    <div class="product-item">
        <h3><a href="{{ item.Link }}">{{ item.Title }}</a></h3>
        <p>型号：{{ item.productModel }}</p> {# 直接使用item.调用字段名 #}
        <p>价格：{{ item.productPrice }}</p> {# 直接使用item.调用字段名 #}
        <p>{{ item.Description }}</p>
    </div>
    {% endfor %}
{% endarchiveList %}

Key pointIn