As a senior website operations expert, I am well aware of the importance of flexible data display and user experience.AnQi CMS provides many conveniences for content operations with its powerful customization capabilities.tagDataListThe creation time of the associated document is formatted elegantly.

Timestamp in the Anqi CMS template: why is formatting needed?

In the Auto CMS, whether it is articles, products, or other content models, their creation time (CreatedTimeand update timeUpdatedTimeDates such as these are usually stored in the database in the form of Unix timestamps (Timestamp). This format is efficient and easy to handle for computers, but for website visitors, a string like1678886400Such numbers are meaningless.

As website operators, our goal is to provide clear and readable information.Translate these original timestamps into user-friendly date formats such as "March 15, 2023", "10:30 AM yesterday", or "Mar 15, 2023", which can not only enhance the professionalism of the website but also improve the reading experience of users.

tagDataList: A powerful tool for linking documents.

In the template design of AnQi CMS,tagDataListA label is a very practical tool that allows us to retrieve and display a list of associated documents based on a specific label (Tag).For example, we may need to display all articles with the "SEO optimization

tagDataListworks very intuitively. It returns an array containing document objects, which we can access throughforLoop to traverse these documents. Each document object (usually nameditem) contains various properties of the document, such asId/Title/Link/Description, of course, including the one we are concerned aboutCreatedTime.

Basic usage is as follows:

{% tagDataList archives with tagId="1" %}
    {% for item in archives %}
        <p>{{ item.Title }} - 创建时间：{{ item.CreatedTime }}</p>
    {% endfor %}
{% endtagDataList %}

If not processed,{{ item.CreatedTime }}What is output here is that cold, cold Unix timestamp.

stampToDateThe Magic Wand of Time Formatting

In order to 'transform' these timestamps into readable date formats, Anqi CMS provides a very convenient built-in tag function:stampToDateThis function is specifically designed for timestamp formatting, and its usage is also very simple and clear.

stampToDateThe function requires two parameters:

  1. Timestamp: This is the original Unix timestamp you need to format intagDataListin the loop, it is usuallyitem.CreatedTime.
  2. Format StringThis is a string defining the output date format. Special attention is required here, as the Anqi CMS is developed based on Go language, so this format string follows the Go language'slayoutStandard, that is, using onefixed reference timeto define the format, rather than using placeholders (such as)Y-m-d).

The reference time in Go language is:2006-01-02 15:04:05This means, if you want to display the year, write2006；to display the month, write01If you want to display the date, write02. Continue in this manner.

Practice exercise: turntagDataListof the creation time into a magnificent transformation

Now, let's taketagDataListandstampToDateCombine them and see how to apply it in an actual template.

Suppose we have a TagID of1The label, we need to list all associated document titles and their creation dates, and display them in the format of "Year-Month-Day Time:Minute":

{% tagDataList archives with tagId="1" %}
    {% for item in archives %}
        <div class="document-item">
            <h2><a href="{{ item.Link }}">{{ item.Title }}</a></h2>
            <p>
                发布于：
                {{ stampToDate(item.CreatedTime, "2006-01-02 15:04") }}
                <span>浏览量：{{ item.Views }}</span>
            </p>
            <p>{{ item.Description }}</p>
        </div>
    {% else %}
        <p>当前标签下暂无关联文档。</p>
    {% endfor %}
{% endtagDataList %}

In the above code,item.CreatedTimePassed as the first parameter.stampToDatewhile"2006-01-02 15:04"Then it is used as a format string to tell the system the date format we want to output.

Output example:

发布于：2023-03-15 10:30

Custom format, do as you wish.

The date formatting method of Go language may look peculiar at first glance, but once you master its principles, you can achieve extremely flexible custom formats. Here are some common formatting examples that can help you generalize:

  • Only show year and month: {{ stampToDate(item.CreatedTime, "2006年01月") }}
    • Output:2023年03月
  • Show English month and date: {{ stampToDate(item.CreatedTime, "Jan 02, 2006") }}
    • Output:Mar 15, 2023
  • Show the full day of the week: {{ stampToDate(item.CreatedTime, "Monday, 2006年01月02日") }}
    • Output:Wednesday, 2023年03月15日
  • Show AM/PM: {{ stampToDate(item.CreatedTime, "2006-01-02 03:04 PM") }}
    • Output:2023-03-15 10:30 AM(NotePMin uppercase,03:04For 12-hour format)
  • Show short date: {{ stampToDate(item.CreatedTime, "01/02/06") }}
    • Output:03/15/23

By these examples, you can freely combine the most suitable date format according to the website's UI/UX design and the reading habits of the target audience.

The insights of content operation.

Precise and user-friendly time display is an indispensable part of high-quality content operation.It is not just a technical implementation, but also has a direct impact on the trust and dwell time of users for website information.Whether it is news updates, blog articles, or product releases, clear publication or update times can help users quickly obtain key information and enhance the overall browsing experience.stampToDateFunctionality makes everything simple and efficient.

Summary

MastertagDataListandstampToDatethe combination use, is one of the basic skills for the content operators of security CMS.Through the explanation and examples in this article, I believe you are now able to easily convert the original timestamp into various elegant and readable date formats in the AnQiCMS template, thereby adding luster to your website content.

Common Questions (FAQ)

1.stampToDateWhy is the format string in the function so special, not common?Y-m-d?

This is because the AQB CMS is developed in Go language, and its template engine follows the standard of Go language when handling date formats. The date formatting in Go language is based on a 'reference time', i.e.2006-01-02 15:04:05.999999999 -0700 MST。You write each number or letter in the format string, and it corresponds to a specific component of this reference time (for example,2006Represents the year,01Representing the month).If you write according to the reference time, the system will automatically recognize and output the corresponding time information. Although this method may seem unfamiliar at first, it is very precise and flexible.

2. BesidestagDataList，Can I also use it in other tags?stampToDateDo you want to format the time?

Of course, you can. All returned documents in the Anqi CMS (such asarchiveList/archiveDetail), categories (such ascategoryList/categoryDetail), or single pages (such aspageList/pageDetail) tags, if their internal data structure containsCreatedTimeorUpdatedTimethese timestamp fields, you can use themstampToDateFunction performs formatting. Usage is the same as in English,tagDataListjust replace with the timestamp field of the corresponding label loop variable.item.CreatedTime.

3. If I find that the creation time is directly displayed as a long string of numbers (such as1678886400)，instead of a formatted date, how should I investigate the problem?

This usually meansstampToDatethe function does not