In the daily content operation of AnQi CMS, we often need to present the original timestamp data such as publish time and update time in a way that users are more accustomed to and easier to read. The original timestamp, for example, is1609470335Such a pure numeric sequence is meaningless to ordinary users. To solve this problem, Anqi CMS provides a very practical template tag -stampToDateIt can help us convert these numeric timestamps into a clear and user-friendly date and time display.

stampToDateMaking timestamps readable

stampToDateThe core function of the label is to beautify the output of a 10-digit or 13-digit (if internally processed as milliseconds) Unix timestamp in the format we specify.This greatly enhances the professionalism and user experience of the website content.Imagine if the publication time of an article is only displayed as a string of numbers, users might feel confused.It is clear at a glance if displayed as "October 27, 2023 10:30" or "10/27/2023".

Its usage is very intuitive:{{stampToDate(时间戳, "格式")}}Here, you need to provide two parameters:

  1. Timestamp:It is usually in AnQiCMSCreatedTime/UpdatedTimesuch fields return numbers.
  2. Format:This part defines the "template" how you want the date and time to be displayed.

Understand the formatting rules deeply: Go language's special "magic numbers".

Anqi CMS'sstampToDateTags follow the unique time formatting rules of the Go language. Unlike the placeholders we might be familiar with,YYYY-MM-DD/HH:MM:SSGo language uses a fixed reference time -2006年01月02日 15时04分05秒(Also known as "magic number" or "reference time") as a template.

The key to understanding this reference time is that each number or part represents a specific time component:

  • 2006Represents the year (Year)
  • 01Represents the month (Month), with leading zero
  • 02Represents the day (Day), with leading zero
  • 15Represents the hour (Hour), 24-hour format, with leading zero
  • 04represents minutes (Minute), with a leading zero
  • 05represents seconds (Second), with a leading zero

If you want to display other formats, you just need to use the corresponding parts of these 'magic numbers' to construct your format string. For example, if you want to display 'Year-Month-Date', the format string is"2006-01-02".

Common formatting examples

Here are some common formatting methods, along with their corresponding format strings and display effects:

  • Only show the date (Year-Month-Day): {{stampToDate(item.CreatedTime, "2006-01-02")}}For example:2023-10-27

  • Display the full date and time: {{stampToDate(item.UpdatedTime, "2006-01-02 15:04:05")}}For example:2023-10-27 10:30:00

  • Chinese date and time format: {{stampToDate(archive.CreatedTime, "2006年01月02日 15时04分")}}For example:2023年10月27日 10时30分

  • Date with custom separator: {{stampToDate(item.CreatedTime, "2006/01/02")}}For example:2023/10/27

  • Display only hours and minutes: {{stampToDate(item.CreatedTime, "15:04")}}For example:10:30

  • Display the day of the week (English): {{stampToDate(item.CreatedTime, "Mon Jan 02 2006")}}For example:Fri Oct 27 2023(Here is the)Monrepresenting the day of the week,Janrepresenting the English abbreviation of the month,02is the date)

actual application in the template

In the AnQi CMS template, we usually use it when looping through document lists (such asarchiveList) or displaying document details (such asarchiveDetail)stampToDateLabel.

For example, on an article list page, you might display the publication time of each article like this:

{% archiveList archives with type="page" limit="10" %}
    {% for item in archives %}
    <div class="article-card">
        <h3><a href="{{item.Link}}">{{item.Title}}</a></h3>
        <p class="meta-info">
            发布于:{{ stampToDate(item.CreatedTime, "2006年01月02日 15:04") }}
            浏览量:{{item.Views}}
        </p>
        <p>{{item.Description}}</p>
    </div>
    {% endfor %}
{% endarchiveList %}

On the article detail page, you can display the update time of the article like this:

<article>
    <h1>{% archiveDetail with name="Title" %}</h1>
    <div class="article-meta">
        发布时间:{{ stampToDate(archive.CreatedTime, "2006-01-02 15:04:05") }}
        更新时间:{{ stampToDate(archive.UpdatedTime, "2006-01-02 15:04:05") }}
        浏览量:{% archiveDetail with name="Views" %}
    </div>
    <div class="article-content">
        {% archiveDetail articleContent with name="Content" %}{{articleContent|safe}}
    </div>
</article>

By making reasonable use ofstampToDateWe can ensure that time information on the website is always presented in a clear, professional, and user-friendly manner, thus enhancing the overall user experience.


Common Questions (FAQ)

  1. Why can't I useYYYY-MM-DDthis format placeholder?Anqi CMS'sstampToDateThe tag uses the Go language time formatting standard, it does not recognizeY/M/DAnd traditional placeholders. Instead, you need to use a fixed reference time(2006年01月02日 15时04分05秒) to construct your format string. For example, if you want to display a four-digit year, use2006; To display two-digit months, use01. Continue in this manner.