How to add the `target="_blank"` attribute to the pagination link of AnQiCMS?

Certainly, as an experienced website operations expert, I am happy to give you a detailed explanation of how to add pagination links in AnQiCMStarget="_blank"Properties. In such a flexible content management system as AnQiCMS, such custom requirements are usually implemented by modifying the template, and that is exactly where its strength lies.

Explore the new world of AnQiCMS pagination links: how to addtarget="_blank"property

During the process of building a website with AnQiCMS, we often encounter various personalized needs.By default, the navigation links within the website, including pagination links, are opened in the current browser window.This is usually**practice for improving users' browsing experience within the site.However, in certain specific operational scenarios, you may want pagination links to open in a new tab, for example, so that users can browse pagination content while still retaining the current page as a reference, or to coordinate with some specific marketing strategies.

AnQiCMS is known for its high-performance architecture based on the Go language and its flexible template system, making it easy to customize what seems complex.It adopts a syntax similar to the Django template engine, allowing us to delve into the template code level, precisely controlling every output detail of the page.

Understand the template mechanism of AnQiCMS

In AnQiCMS, everything you see in the frontend display is inseparable from its powerful template system. All template files are stored with.htmlsuffix, neatly organized./templateUnder the directory. When we need to modify the display logic or HTML structure of the website, we usually need to find the corresponding template file to edit.

For the pagination feature, AnQiCMS provides a built-in tag namedpaginationused to generate pagination navigation. This tag itself cannot directly control the links'targetThe property is responsible for outputting an HTML structure that includes pagination logic. Therefore, our task is to delve intopaginationFind those responsible for generating links in the internal HTML structure rendered by the tag<a>At the location of the tag, then add for ittarget="_blank"Property.

Locate the pagination template code

The pagination code of AnQiCMS usually does not exist independently in a separate file, but is included as part of the page list (such as article list, product list, tag list, etc.) in the corresponding list template file.

To find the pagination code you need to modify, you can locate it according to the type of the page:

• Article list page: Usually locatedarchive/list.htmlorcategory/list.html(If the category displays document lists).
• Product list pageSimilarly, it may beproduct/list.htmlin the corresponding category list template.
• Tag document list page: Locatedtag/list.html.
• Search results page: Locatedsearch/index.html.

Open these template files and you will find a block of the form{% pagination pages with show="5" %}. This block contains the specific logic for generating pagination links in AnQiCMS.

Manually modify the pagination link attribute

Now, let's take a typical pagination code snippet as an example and demonstrate how to addtarget="_blank"the attribute. The following istag-pagination.mdthe pagination tag example code given in:

<div class="pagination">
    {% pagination pages with show="5" %}
    <ul>
        <li>总数：{{pages.TotalItems}}条，总共：{{pages.TotalPages}}页，当前第{{pages.CurrentPage}}页</li>
        <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>

You can see that in this{% pagination %}tags inside, we have several<a>Tags correspond to "Home<a>Manually add tagstarget="_blank".

The modified code will be like this:

<div class="pagination">
    {% pagination pages with show="5" %}
    <ul>
        <li>总数：{{pages.TotalItems}}条，总共：{{pages.TotalPages}}页，当前第{{pages.CurrentPage}}页</li>
        <li class="page-item {% if pages.FirstPage.IsCurrent %}active{% endif %}">
            <a href="{{pages.FirstPage.Link}}" target="_blank" rel="noopener noreferrer">{{pages.FirstPage.Name}}</a>
        </li>
        {% if pages.PrevPage %}
            <li class="page-item">
                <a href="{{pages.PrevPage.Link}}" target="_blank" rel="noopener noreferrer">{{pages.PrevPage.Name}}</a>
            </li>
        {% endif %}
        {% for item in pages.Pages %}
            <li class="page-item {% if item.IsCurrent %}active{% endif %}">
                <a href="{{item.Link}}" target="_blank" rel="noopener noreferrer">{{item.Name}}</a>
            </li>
        {% endfor %}
        {% if pages.NextPage %}
            <li class="page-item">
                <a href="{{pages.NextPage.Link}}" target="_blank" rel="noopener noreferrer">{{pages.NextPage.Name}}</a>
            </li>
        {% endif %}
        <li class="page-item {% if pages.LastPage.IsCurrent %}active{% endif %}">
            <a href="{{pages.LastPage.Link}}" target="_blank" rel="noopener noreferrer">{{pages.LastPage.Name}}</a>
        </li>
    </ul>
    {% endpagination %}
</div>

Key modification point:

1. target="_blank"This attribute indicates that the browser should open the link in a new tab or window.
2. rel="noopener noreferrer"This is a very important security and performance enhancement attribute, especially when usedtarget="_blank".
   • noopener: Prevent new pages from accessingwindow.openerthe properties of the original pagewindowAn object, to prevent malicious new pages from using the original page's permissions to execute cross-site scripting attacks.
   • noreferrer: BesidesnoopenerIn addition to its functionality, it also prevents the new page from receiving the HTTP Referer header information from the original page, which is very helpful for protecting user privacy and preventing information leakage.

Save and take effect

After modifying the template file, please make sure to save the changes. Due to the cache mechanism that AnQiCMS may use to speed up page loading, in order for your changes to take effect immediately, you need to perform the following operations:

1. Clear system cacheLog in to the AnQiCMS backend, find the "Update Cache" feature (usually at the bottom of the sidebar or in system settings), and click to clear all caches.
2. Clear browser cachePress on the front-end page:Ctrl + F5(Windows/Linux) orCmd + Shift + R(macOS) Perform a hard refresh to ensure the browser loads the latest CSS and JS files, as well as the updated HTML structure.

Potential impact and suggestions

As a website operations expert, I must remind you to add properties for internal pagination links.target="_blank"In most cases, this is not a **good practice for user experience.

• User Experience (UX)The user usually expects internal links to open in the current tab to maintain the continuity of the browsing path.Continuously opening new tabs can lead to too many tabs in the user's browser, causing confusion and disorientation, and may even result in them closing your website.
• Search Engine Optimization (SEO): Althoughtarget="_blank"It does not have a direct negative impact on SEO, but if overused, especially on internal links, it may indirectly affect user behavior metrics (such as bounce rate), which may have an adverse effect on SEO.Search engines tend to favor websites that provide a smooth, intuitive user experience.

Therefore, please be sure to carefully evaluate the impact of such changes on your website's target user group and overall operational strategy.If you indeed have special requirements, such as at a critical link in some data analysis or marketing funnel, where you want users to process tasks "simultaneously", then customization is feasible under the premise of fully understanding the risks.

Frequently Asked Questions (FAQ)

1. Why does AnQiCMS pagination links not open in a new tab by default?AnQiCMS and other mainstream CMSs are the same, the default design is to open internal links in the current tab, which is based on the **user experience practice of website internal navigation.Users are expected to navigate within a website in a coherent manner, rather than accumulating new browser tabs continuously.

2. Add pagination linkstarget="_blank"Will it have a negative impact on my website's SEO?Add directlytarget="_blank"The attribute itself will not directly lead to SEO punishment.However, if this approach leads to a poor user experience (for example, the user feels confused and closes the website prematurely), it may indirectly affect user behavior metrics (such as dwell time, bounce rate), which are important references for search engines to evaluate website quality.rel="noopener noreferrer"Property to avoid