As an experienced website operations expert, I fully understand the importance of website details to user experience and brand image.AnQiCMS (AnQiCMS) with its flexible template mechanism and powerful multilingual support, allows us to easily achieve these customized requirements.Today, let's delve into how to precisely customize the pagination tags such as 'Home', 'Previous', 'Next', and 'Last Page' in AnQiCMS templates, making your website's pagination not only functional but also full of brand characteristics.

Understanding AnQiCMS pagination mechanism

In AnQiCMS, the pagination feature is usually implemented bypaginationThe tag is implemented in the template. This tag is responsible for handling complex page number calculations, link generation, and current page state judgment, and then returns a container that includes all pagination information.pagesThe object is provided for use in the template.

We usually see pagination code like this at the bottom of a list page (such as an article list page, a product list page).

{# 假设我们有一个名为 archives 的文档列表，并且 type="page" 开启了分页 #}
{% archiveList archives with type="page" limit="10" %}
    {# ... 文档列表循环内容 ... #}
{% endarchiveList %}

<div class="pagination-container">
    {% pagination pages with show="5" %}
    <ul>
        {# 首页 #}
        <li class="page-item {% if pages.FirstPage.IsCurrent %}active{% endif %}">
            <a href="{{pages.FirstPage.Link}}">{{pages.FirstPage.Name}}</a>
        </li>
        {# 上一页 #}
        {% if pages.PrevPage %}
        <li class="page-item">
            <a href="{{pages.PrevPage.Link}}">{{pages.PrevPage.Name}}</a>
        </li>
        {% endif %}
        {# 中间页码 #}
        {% for item in pages.Pages %}
        <li class="page-item {% if item.IsCurrent %}active{% endif %}">
            <a href="{{item.Link}}">{{item.Name}}</a>
        </li>
        {% endfor %}
        {# 下一页 #}
        {% if pages.NextPage %}
        <li class="page-item">
            <a href="{{pages.NextPage.Link}}">{{pages.NextPage.Name}}</a>
        </li>
        {% endif %}
        {# 末页 #}
        <li class="page-item {% if pages.LastPage.IsCurrent %}active{% endif %}">
            <a href="{{pages.LastPage.Link}}">{{pages.LastPage.Name}}</a>
        </li>
    </ul>
    {% endpagination %}
</div>

In this code, you can see such as{{pages.FirstPage.Name}}/{{pages.PrevPage.Name}}English variables.They are responsible for outputting texts such as 'Home page', 'Previous page'.This default text content, AnQiCMS usually retrieves it from the system's language package to support multi-language switching.

Custom pagination text: Deep into the language package

The most recommended and flexible way to customize these texts is to use the multi-language (locales) mechanism of AnQiCMS.Even if your website currently supports only one language, customizing in this way can lay a good foundation for future multilingual expansion.

The following are the specific operation steps:

1. Locate or create a templatelocalesDirectoryThe template files of AnQiCMS are stored in/templateThe directory. Each template set of yours will have an independent directory, for example/template/default. Under this template directory, you need to create a namedlocalesThe folder. If your template already supports multilingual, this directory may already exist.

   `template/ └── your_theme_name/

   ├── config.json
   └── locales/`
   

2. Create or modify language filesInlocalesIn the directory, you need to create a corresponding folder based on your website language, for example, if your website is Simplified Chinese, createzh-cnthe folder; if it is English, createen-us.

   Inzh-cnIn the folder with the language code you choose, create a file nameddefault.yml. This file will be used to store your custom text key-value pairs.

   `template/ └── your_theme_name/

   └── locales/
       └── zh-cn/
           └── default.yml`
   

3. Indefault.ymlto define custom textOpendefault.ymlFile, and add the custom pagination text content you want. You can define new keys and values for 'Home', 'Previous Page', 'Next Page', and 'End Page'. For example:

   English

   default.yml 文件内容示例

   pagination: first_page: “Go back to home page” previous_page: “<< Previous page” next_page: “Next page >>” last_page: “Go to the last page” # You can also customize the name of the middle page number, if the system default does not support, you can directly write it in the template