stampToDateThe filter is a tool that converts the original Unix timestamp into the localized date string we are familiar with.

This article will delve deeper intostampToDateThe usage of filters, helping you easily customize the display of various date and time formats in the AnQi CMS template.

Understanding Unix timestamps in AnQi CMS

In the AnQi CMS, many date and time information stored in the database, such as the creation time of documentsCreatedTimeor update timeUpdatedTimeIt usually exists in the form of Unix timestamp.Unix timestamp is an integer representing the number of seconds elapsed since 00:00:00 UTC on January 1, 1970 (also known as the Unix epoch).

Display such timestamps directly in the template, for example1609470335It is difficult for ordinary users to understand.To provide a better reading experience, we need to format it as a localized string like “2021/01/01 12:25”.

Core Tools:stampToDateFilter

The AutoCMS template engine takes inspiration from Django syntax and providesstampToDateThis convenient filter is specifically designed to format Unix timestamps into readable date and time strings.

Basic syntax:

{{ stampToDate(时间戳, "格式") }}

Among them:

  • 时间戳: is typically the one you get from a data object (such asitem.CreatedTime）中获取的10位Unix timestamp.
  • "格式"This is a string that defines the specific format in which you want the date and time to be displayed. It should be noted that this "format" is not what we commonly see.Y-m-d H:i:sThis pattern is not used, but instead, it adopts the unique 'reference time' mechanism of the Go language.

The secret to mastering the GoLang time format

The Go language uses a fixed reference point to represent each time unit when defining time formats. This reference point is:2006年01月02日 15点04分05秒.

This means that when you want to display the year, use2006; when you want to display the month, use01(representing January); when you want to display the date, use02[Represents number 2), etc. The following are the common correspondences:

  • 2006-> Year (YYYY)
  • 01or1-> Month (MM/M)
  • 02or2-> Day (DD/D)
  • 15or3-> Hour (24-hour format HH/H) or (12-hour format hh/h)
  • 04-> Minutes (MM)
  • 05-> Seconds (SS)
  • Mon-> Day of the week (e.g., Mon, Tue, Wed)
  • Monday-> Full name of the day of the week (e.g., Monday, Tuesday)
  • Jan-> English abbreviation of months (e.g., Jan, Feb)
  • January-> Complete English months (e.g., January, February)

Through combining these reference time elements, you can almost define any date and time format you want.

Common formatting examples and applications

Suppose we have a Unix timestamp1672502400which corresponds to2023年01月01日 00:00:00。we will see how to usestampToDatefilter to format it into various common localized strings.

  1. “YYYY/MM/DD HH:MM”(如：2023年01月01日 00:00)

    {{ stampToDate(1672502400, "2006年01月02日 15:04") }}

    Output:2023年01月01日 00:00

  2. “YYYY-MM-DD”(如：2023-01-01)

    {{ stampToDate(1672502400, "2006-01-02") }}

    Output:2023-01-01

  3. “MM/DD HH:MM”(如：01/01 00:00)

    {{ stampToDate(1672502400, "01/02 15:04") }}

    Output:01/01 00:00

  4. “HH:MM:SS”(如：00:00:00)

    {{ stampToDate(1672502400, "15:04:05") }}

    Output:00:00:00

  5. “YYYY/MM/DD 星期几”(如：2023/01/01 Sunday)

    {{ stampToDate(1672502400, "2006/01/02 星期Monday") }}

    Output:2023/01/01 星期Sunday（注意Go语言的Monday对应输出完整的星期几，这里会是Sunday，因为1672502400是周日）

Examples of practical application scenarios

In the template design of AnQi CMS,stampToDate过滤器常用于archiveList(Document List),archiveDetail(Document Details) andcommentList（评论列表）等标签中。

For example, show the publication time of each article in a document list:

{% archiveList archives with type="page" limit="10" %}
    {% for item in archives %}
    <div class="article-item">
        <h3><a href="{{ item.Link }}">{{ item.Title }}</a></h3>
        <p>发布时间：
            <time datetime="{{ stampToDate(item.CreatedTime, "2006-01-02T15:04:05") }}">
                {{ stampToDate(item.CreatedTime, "2006年01月02日 15:04") }}
            </time>
        </p>
        <p>{{ item.Description }}</p>
    </div>
    {% empty %}
    <p>暂时没有文章。</p>
    {% endfor %}
{% endarchiveList %}

In this example,item.CreatedTimeThe value obtained is a Unix timestamp, bystampToDateFilter, we have formatted it into a user-friendly "year-month-day hour:minute" format, and also in<time>TagsdatetimeProperties output machine-readable ISO 8601 format, balancing user experience and SEO.