In AnQiCMS, the custom fields of the content model bring great flexibility to our website content management, allowing us to add unique properties to content types such as articles, products, and events according to different business needs.But it is not enough to just create these fields in the background. How to flexibly present them on the website frontend, so that visitors can see these customized information, is the key to content operation.
Next, we will delve into how AnQiCMS's content model custom fields can be flexibly called and displayed in front-end templates, helping you make full use of this powerful feature.
Laying the foundation for personalized content: Creating custom fields
In AnQiCMS, the charm of custom fields lies in their high degree of customization.They are not fixed and unchanging, but defined by you according to actual business logic. Usually, these fields are created and managed under the "Content Model" in the "Content Management" module.
When you enter a content model (such as "Article Model" or "Product Model
- Parameter name (display name)'} ]This is the field name you see in the background management interface, convenient for identification.
- Field call (variable name in the template)This is the most core attribute, which determines how you will refer to this custom field in the front-end template. Please use concise and meaningful letters as the field name, for example
author/productPrice/eventDateetc. - field type：AnQiCMS provides various field types, such as single-line text, numbers, multi-line text, single selection, multiple selection, and dropdown selection.Select the appropriate type to ensure the standardization of data input and consistency of front-end display.
- Default value and whether it is required: You can set the default value for the field and mark it as required when necessary.
Understanding the importance of calling fields is the first step to successfully calling custom fields on the front-end. It is the bridge connecting back-end data with front-end templates.
In the front-end template, highlight the custom field: flexible calling methods
AnQiCMS's template system is based on Django template engine syntax, providing an intuitive and powerful way to call various data, including the meticulously defined custom fields.Whether it is to display the details of a single article/product or to show the summary information on the list page, there are corresponding calling methods.
1. Directly call a single custom field on the detail page
When you are on the detail page of a document (article or product), AnQiCMS will automatically load all the data of the current document (including custom fields) into a namedarchiveThe variable in. The most direct way to call a single custom field is to use the dot (.) operator combined with the 'Field Name' you set in the backend..) operator, combined with the 'Field Name' you set in the backend.
For example, if you add a custom field named "Product Price" for the "Product Model", and set its "Field Call" toproductPriceThen you can display its price like this in the product detail page template:
<p>产品价格：{{archive.productPrice}} 元</p>
In addition, AnQiCMS also providesarchiveDetailTags, it allows to more specifically get the value of a single field, and even specify the field of a document with a specific ID. For example:
{# 直接获取当前文档的作者自定义字段 #}
<p>作者：{% archiveDetail with name="author" %}</p>
{# 如果需要获取ID为10的文档的产品价格 #}
<p>其他产品价格：{% archiveDetail with name="productPrice" id="10" %} 元</p>
This method is concise and clear, suitable for those who exactly know which custom field to display and have a fixed position in the page layout.
2. Dynamic loop display all custom fields
Sometimes, you may want to display all the defined custom fields on the detail page, or the names and quantities of the fields may vary according to different documents. At this time,archiveParamsTags are particularly powerful. It can retrieve all custom parameters of the current document or a specified document and return them as an array, making it convenient for us to dynamically display them through loops.
For example, on a product detail page, you may want to display all product parameters (such as color, size, material, etc., all of which are custom fields) in a list:
<h3>产品参数：</h3>
<ul>
{% archiveParams params %}
{% for item in params %}
<li>
<span>{{item.Name}}：</span> {# item.Name 会显示后台设置的“参数名” #}
<span>{{item.Value}}</span> {# item.Value 会显示您输入的内容 #}
</li>
{% endfor %}
{% endarchiveParams %}
</ul>
Through this method, even if you add or modify custom fields in the background, the front-end template does not need to be changed and can automatically adapt and display the latest parameter list. If you only want to display specific named fields or exclude certain fields, you can also inforWithin loop usageifcondition judgment.
3. Display the summary information of custom fields on the list page
In the article list, product list, and other pages, we often need to display the summary information of custom fields. For example, displaying a brief description or promotional tags of products in the product list.
When usingarchiveListLabel gets a list of documents, where the loop variable (usuallyitem) also includes each document's custom fields. You can access them directly using the dot operator:
twig {% archiveList archives with type=“page” limit=“10” %}
{% for item in archives %}
<div class="product-card">
<img src="{{item.Logo}}" alt="{{item.Title}}">
<h3><a href="{{item.Link}}">{{item.Title}}</a></h3>
{# 直接在列表