What is the basic syntax structure of the `pageList` tag in AnQiCMS?

In-depth analysis of AnQiCMSpageListThe basic syntax structure of tags

In the powerful function set of AnQi CMS, template tags play a crucial role, acting as the bridge between backend data and frontend display. For common single-page content on the website such as "About Us", "Contact Us", "Terms of Service", etc., AnQi CMS provides a simple and efficient tool for management and presentation, that ispageListLabel. As an experienced website operations expert, I know how important it is to transform complex technical concepts into practical methods that are easy to understand, so today we will delve into it together.pageListBasic syntax structure of tags and their flexible application in content operation.

pageListTags: easily get a single-page list.

AnQi CMS is committed to providing an intuitive content management experience, andpageListThe label embodies this concept. Its core function is to help us easily obtain all single-page (Page) content in the website backend management.Imagine that your website has multiple independent pages that need to be displayed in a navigation menu, footer, or specific block, manually writing code one by one is time-consuming and prone to errors. Now you havepageListYou can dynamically pull these page data, greatly enhancing the flexibility and maintainability of the template.

Overview of basic syntax structure

pageListThe syntax structure of the tag is very intuitive and easy to understand, mainly consisting of a start tag and an end tag, with a code block in between for looping and displaying page data. Its basic form is like this: 

{% pageList 变量名称 %}
    {# 在这里循环遍历每个单页面数据 #}
{% endpageList %}

Here, 变量名称Is a placeholder you define, representing a collection containing all the single-page data (usually an array or slice). For example, we commonly usepagesAs for this variable name, the label becomes{% pageList pages %}Once defined, you can use a loop statement (such as{% pageList ... %}and{% endpageList %}betweenforloop) to access each onepagesEach single-page object in the collection is collected and its specific information is extracted.

Parameter and flexible customization

Compared to some more complex list tags,pageListThe design concept of the tag is to obtain all single pages, therefore it does not provide direct parameters such as 'filter by category' or 'limit by quantity'. However, it still takes into account the needs of multi-site management and provides asiteIdparameters:

  • siteId: This parameter allows you to specify which site's single-page data to retrieve. In the case of multi-site management in Anqi CMS, if you need to call a single page of another site in a template of a certain site, you can do so bysiteId="指定站点ID"To implement. For most single-site operators, this parameter is usually not required, and the system will automatically obtain the single page of the current site.

For example, if you want to get all single pages of the site with ID 2, you can write it like this:

{% pageList pages with siteId="2" %}
    {# 遍历 ID 为 2 的站点的单页面 #}
{% endpageList %}

However, evenpageListThe system does not have built-in rich filtering parameters, but we can still achieve more refined content display by combining the logical judgment capabilities provided by the Anqi CMS template engine within the tags.

In-depthpageListInternal: Available page data field

Once we pass through{% pageList pages %}Get the single page collection and start iterating through (for example using{% for item in pages %}), eachitemVariable represents an independent single page object. ThisitemAn object contains the detailed properties of the single page, we can directly access them through dot notation（item.属性名）to access them. The following are some commonly used single-page data fields：

  • item.Id: The unique identifier ID for a single page, usually used for management in the background or for building unique links on the front end.
  • item.Title: The title of a single page, which is most commonly used for displaying content to users.
  • item.Link: Single page access link address, used directly in the template to construct<a>label'shrefProperty.
  • item.Description: Brief description of a single page, which can be displayed in lists, cards, or SEO metadata.
  • item.Content: The detailed content of a single page, usually the main content edited by a rich text editor. When outputting, to avoid HTML tags being escaped and causing the content to be displayed abnormally, you need to use|safeFilter, for example{{ item.Content|safe }}.
  • item.Logo: The thumbnail large image address of a single page, if set.
  • item.Thumb: The thumbnail address of a single page, usually a cropped or compressed small image.

Useful scenarios: How to applypageListTag

Now, let's look at several specific examples,pageListhow tags play a role in the operation of actual websites.

Scenario one: Building a universal footer navigation

Many websites' footers list links to commonly used single pages such as “About Us”, “Contact Us”, “Privacy Policy”, and so on. UsepageListcan be easily achieved:

<nav class="footer-nav">
    <ul>
    {% pageList footerPages %}
        {% for item in footerPages %}
        <li><a href="{{ item.Link }}">{{ item.Title }}</a></li>
        {% endfor %}
    {% endpageList %}
    </ul>
</nav>

This code will traverse all single pages and generate a list with titles and links.

Scenario two: Exclude a specific single page list.

Assuming you have a 'site map' page, which is also a single page, but you don't want it to appear in the 'footer navigation' or some sidebar. AlthoughpageListThere is no direct exclusion parameter, but we can take advantage ofifLogical judgment is filtered in the loop:

<nav class="sidebar-pages">
    <h3>我们的页面</h3>
    <ul>
    {% pageList sidePages %}
        {% for item in sidePages %}
            {# 假设“网站地图”页面的ID是5，我们想排除它 #}
            {% if item.Id != 5 %}
                <li><a href="{{ item.Link }}">{{ item.Title }}</a></li>
            {% endif %}
        {% endfor %}
    {% endpageList %}
    </ul>
</nav>

By simple conditional judgment, we can flexibly control which pages are displayed.

Scenario three: Display single-page summary with thumbnail

If some of your single pages (such as "Team Introduction" or "Success Stories") are configured with thumbnails and summaries, you can usepageListCreate a list with visual elements:

<div class="page-highlights">
    {% pageList featuredPages %}
        {% for item in featuredPages %}
            <div class="page-card">
                {% if item.Thumb %}
                    <img src="{{ item.Thumb }}" alt="{{ item.Title }}" class="page-thumbnail">
                {% endif %}
                <h4><a href="{{ item.Link }}">{{ item.Title }}</a></h4>
                <p>{{ item.Description }}</p>
                <a href="{{ item.Link }}" class="read-more">了解更多</a>
            </div>
        {% endfor %}
    {% endpageList %}
</div>

Here we checkitem.ThumbIs there, to avoid broken image links on pages without thumbnails, while displaying the page title, summary, and link.

Summary

pageListTags in AnQi CMS are the core tools for managing and displaying single-page content.It enables website operators and developers to efficiently build various page navigation and content modules with its concise syntax and support for multi-site environments.Although its own parameters are not many, when combined with the powerful logic processing ability of Anqi CMS template engine, it can easily realize various customized content display requirements.Masterfully skilledpageListThe application will undoubtedly bring more flexible content management and a smoother user experience to your website.

Frequently Asked Questions (FAQ)

1.pageListDoes the tag support direct sorting by page title?

pageListThe label itself does not provide directorderParameters are used to sort the page list. The single page of Anqi CMS usually sorts by default according to the sorting value or ID set in the background.If you need a specific sorting method, such as alphabetical order by title or reverse chronological order by publication time, this usually requires adjusting the sorting priority of a single page in the backend management interface, or considering secondary sorting through front-end JavaScript after obtaining the data (but this will increase client load).

2. Can I likearchiveListthe same, rightpageListDisplay pagination for the single page obtained?

According to AnQi CMS design,pageListThe purpose of the tag is to retrieve all single page content, not designed for pagination. Therefore, it does not providetype="page"Such a pagination mode, also cannot be directly withpaginationCombine tags. If you have a very large number of single pages and need pagination, it is recommended that you reconsider whether this part of the content is more suitable for managing as articles or product model categories, thereby utilizingarchiveListandpaginationThe powerful pagination feature of tags.

3. If I only want to get a single page with specific IDs, not all pages, is there an easy method?

pageListThe tag will default to getting all single pages. If you want to display only specific pages, the most common method is to use a conditional judgment inside thepageListloop condition (ifFilter statements. For example, you can define a list containing the required page IDs and then check each loop to see ifitem.Idit is in this list. Although it is not as direct asid="1,2,3"The parameter is intuitive, but this method is still very flexible and effective.