How to elegantly display a 'no content' prompt when using the `empty` tag in AnQiCMS `for` loop?

In the daily operation of the website, we understand that the presentation of content is crucial to user experience.A well-designed website that not only provides rich information but also offers friendly prompts to users when content is missing, avoiding the embarrassment of blank pages or error messages.AnQiCMS as an enterprise-level content management system developed based on the Go language and using syntax similar to the Django template engine, has provided us with a powerful and elegant solution in this regard, especially itsforLoop withemptyThe combination of tags can intelligently handle the 'no content' scenario.

The way of elegance: AnQiCMSforLoop withemptyThe clever use of tags

In AnQiCMS template development,forThe loop is the basic tool for iterating over data collections (such as article lists, product lists, comments, etc.).Its function is intuitive and clear, which is to process each item in the collection one by one and present the item data.For example, you may need to display the latest ten articles on a page or list all related products on a category page.

However, when our dataset is exactly empty, for example, when there are no articles under a certain category or when a user has not posted any comments, the traditional approach often requires that weforAdd an extra one outside the loopifTo determine if the collection is empty. If it is empty, then display the prompt 'No content'; if not empty, then execute.forLoop. This method is feasible, but it undoubtedly increases the redundancy of template code and the complexity of reading.

The template engine of AnQiCMS is well-versed in this, cleverly introducingemptyThe tag perfectly solves this pain point. When you are inforUsing a loopemptyWhen the tag is used, the template engine intelligently detects the data collection being looped. If the collection is not empty,forThe content within the loop will execute normally, displaying items one by one. Once the collection is detected as empty, the template engine willAutomatically skipforloop, and then executeemptythe code block inside the tagThus, it displays the "no content" prompt you have预设预设。This design makes the code structure more concise and the logic clearer, which is undoubtedly a major highlight in template development.

Practice makes perfect: Take the article list as an example

Let's take a common article list as an example and seeforLoop withemptyHow labels elegantly collaborate. Suppose we need to display a list of articles under a category on a page:

<div class="article-list">
    {% archiveList archives with type="list" categoryId="1" limit="10" %}
        {% for item in archives %}
        <div class="article-item">
            <h3 class="article-title"><a href="{{item.Link}}">{{item.Title}}</a></h3>
            <p class="article-description">{{item.Description}}</p>
            <span class="article-date">{{stampToDate(item.CreatedTime, "2006-01-02")}}</span>
        </div>
        {% empty %}
        <div class="no-content-tip">
            <p>抱歉，当前分类暂无相关文章，敬请期待！</p>
            <a href="/" class="back-home">返回首页</a>
        </div>
        {% endfor %}
    {% endarchiveList %}
</div>

In this code block:

1. We first use{% archiveList archives ... %}A label has obtained a namedarchivesThe list of articles. This tag is responsible for retrieving articles that meet the conditions from the background database.
2. Then,{% for item in archives %}Start traversing thisarchivesList. If the list contains articles, it will extract the data of each article one by one (such asitem.Link/item.Title/item.Description), and display them indiv.article-itemblocks.
3. But ifarchivesThe list is empty (meaning no articles were retrieved), the template engine will not executeforThe logic of displaying articles within the loop. Instead, it will jump to{% empty %}the part after the tag, displayingdiv.no-content-tipThe prompt information: "Sorry, there are no related articles in this category at present, please look forward!

In this way, we do not need any additionalifJudging, it can flexibly switch the display mode of content according to the actual situation of the data, whether it is showing a rich list of articles or providing a considerate no-content prompt, it appears professional and smooth.

Why is this crucial for website operation?

As an experienced website operation expert, I know that every detail may affect the perception and trust of users towards the website. AnQiCMS'forLoop combinationemptyTags bring not only code-level simplicity, but also more importantly, an improvement in user experience and optimization of website maintenance efficiency:

• Improve user experience:The page will not have abrupt blank spaces, but clear guidance or friendly prompts.This avoids users from questioning the integrity of the website content, and even guides them to other valuable areas.
• Optimize development and maintenance efficiency:Developers do not need to write additional conditional judgment logic, making the code more compact and readable. This reduces the probability of errors and makes it easier to maintain and expand the functionality later.
• Maintain page structure consistency:Whether there is content or not, the basic layout and style of the page can be maintained uniformly, enhancing the overall aesthetics and professionalism of the website.

exceptarchiveListThere are many tags in AnQiCMS that return list data, such ascommentList(Comment list),categoryList(Category list),tagDataList(Tag document list),pageList(Single page list) andlinkList(Friend link list) and others. In these scenarios,forLoop withemptyThe combination of labels can all play the same elegant role, ensuring that your website can present in **status in any situation.

Conclusion

AnQiCMS'forLoop withemptyThe tag is a vivid manifestation of the 'simple and efficient' design philosophy of its template engine.It makes website content management smarter and more user-friendly, whether for developers who pursue code aesthetics or for operators who are committed to improving user experience, it is undoubtedly a skill worth mastering and widely applying.Let our website convey warmth and professionalism even at moments of 'no content'.

Frequently Asked Questions (FAQ)

Q1: AnQiCMS'forin the loopemptyLabels and usageifWhat is the difference between checking if a list is empty?

A1: The main difference is in the conciseness and readability of the code.emptyis a tagforA special branch built into the loop, which is used to handle the case where the loop data collection is empty, allowing for direct processing of both "content" and "no content" states within the same code block, making the logic more concentrated. And usingifThe statement needs to be judged inforAn additional conditional branch is written outside the loop, which causes the code structure to be slightly scattered, especially in nested loops or complex templates,emptyThe advantage will be more obvious, making the template code more elegant.

Q2:emptyCan the content within the tag include HTML structures and other AnQiCMS tags?

A2: Perfectly okay.emptyThe code block within the tag can contain any valid HTML structure, text content, as well as other template tags provided by AnQiCMS, such assystemLabel to display the website name, orcontactLabel to display contact information, even aincludeA tag to reference an independent 'no content' prompt template fragment. This provides you with great flexibility to design rich prompt information according to your actual needs.

Q3: If I need to display different 'no content' prompts based on different conditions,emptyDoes the tag support?

A3:emptyThe label itself has only one content block for displaying the "no content" prompt. If you need to display different no content prompts based on more complex conditions (such as emptyusing tags insideif/elif/elseConditional judgment tags to further refine the logic. For example:

{% empty %}
    {% if has_activities %}
        <p>暂无商品，但有精彩活动正在进行中！</p>
    {% else %}
        <p>抱歉，暂无任何内容。</p>
    {% endif %}
{% endfor %}

With this combination, you can flexibly deal with various complex non-content prompt requirements.