How to format a timestamp in AnQi CMS template to display it in a friendly date/time format?

In displaying website content, how to present the timestamp data stored in the background in a user-friendly and easy-to-read date or time format is a key element in improving user experience. Anqi CMS is well-versed in this, providing template developers with a simple and efficient tag -stampToDateLet this process be effortless.

Understanding the timestamp in AnQi CMS

In many content models of AnQi CMS, such as articles, products, or categories, time data is usually stored in the form of a 10-digit timestamp. For example, the creation time of an article (CreatedTimeand update timeUpdatedTimeIt is like this timestamp.This format is convenient for database storage and calculation, but it seems stiff and difficult to understand when displayed directly to the user.We need to convert it into common forms such as "year-month-day hour:minute:second.

core tools:stampToDateLabel parsing

The template engine of AnQi CMS supports syntax similar to Django, wherestampToDatetags are designed to solve timestamp formatting issues. Its usage is very intuitive:

{{stampToDate(时间戳字段, "格式化字符串")}}

There are two key parts:

1. Timestamp field：This is usually the onearchive/itemfrom objects such asitem.CreatedTime.
2. Formatted stringThis is the core to determine the display style of the date and time. The Anqi CMS template engine adopts the Go language (GoLang) time formatting standard.

Go language time formatting rules

The time formatting rules of Go language are different from those commonly seen in PHP, Python, and other languagesY-m-d H:i:sThe placeholders are different. It uses afixed reference timeDefine the format, the reference time is:

2006年01月02日 15时04分05秒 -0700 MST

You need to replace each part of the reference time with the actual date and time elements you want to display. For example:

• 2006Represents the year (four digits)
• 01Represents the month (two digits)
• 02Represents the date (two digits)
• 15Represent hour (24-hour format, two digits)
• 04Represent minutes (two digits)
• 05Represent seconds (two digits)
• If you want to display hours in 12-hour format, you can use03.
• If you want to display the day of the week, you can useMon(abbreviation) orMonday(full name).

Understanding this reference time is the key to mastering Go language time formatting.

Common formatting examples

After mastering the formatting rules of the Go language, we can easily achieve various common date and time display requirements:

• Only show year-month-day:

  <div>{{stampToDate(item.CreatedTime, "2006-01-02")}}</div>
  {# 例如：2023-10-27 #}
  

• Show year-month-day in Chinese format:

  <div>{{stampToDate(item.CreatedTime, "2006年01月02日")}}</div>
  {# 例如：2023年10月27日 #}
  

• Display full date and time (24-hour format):

  <div>{{stampToDate(item.CreatedTime, "2006-01-02 15:04:05")}}</div>
  {# 例如：2023-10-27 10:30:45 #}
  

• Display full date and time (12-hour format, with AM/PM):

  <div>{{stampToDate(item.CreatedTime, "2006-01-02 03:04:05 PM")}}</div>
  {# 例如：2023-10-27 10:30:45 AM #}
  

• Display only time:minute:

  <div>{{stampToDate(item.CreatedTime, "15:04")}}</div>
  {# 例如：10:30 #}
  

• Display weekday:

  <div>{{stampToDate(item.CreatedTime, "Mon")}}</div> {# 星期五 #}
  <div>{{stampToDate(item.CreatedTime, "Monday")}}</div> {# 星期五 #}
  

Actual usage in template

usually, you will use it when iterating through a document list or displaying document detailsstampToDatetags. For example, when displaying an article list, you may need to show the publication date of each article:

{% archiveList archives with type="page" limit="10" %}
    {% for item in archives %}
    <li>
        <a href="{{item.Link}}">
            <h5>{{item.Title}}</h5>
            <div>
                <span>发布日期：{{stampToDate(item.CreatedTime, "2006年01月02日 15:04")}}</span>
                <span>浏览量：{{item.Views}}</span>
            </div>
        </a>
    </li>
    {% empty %}
    <li>暂无内容</li>
    {% endfor %}
{% endarchiveList %}

or display the update time of the article on the article detail page:

<article>
    <h1>{% archiveDetail with name="Title" %}</h1>
    <div>
        <span>更新于：{% archiveDetail archiveUpdatedTime with name="UpdatedTime" %}{{stampToDate(archiveUpdatedTime, "2006-01-02 15:04")}}</span>
    </div>
    <div>
        {% archiveDetail archiveContent with name="Content" %}
        {{archiveContent|safe}}
    </div>
</article>

As you can see,stampToDateLabels make timestamp formatting very flexible and powerful, you can meet almost all date and time display needs by adjusting the format string.

Use suggestions and precautions

• Remember the Go language formatting standards.This is the core. Do not confuse it with Go language.2006-01-02 15:04:05Reference time and placeholders in other languages. Once mastered, you can generalize.
• The input value must be a timestamp:stampToDateLabels are specifically used to handle integer timestamps of 10 digits or more. If your variable is alreadytime.Timea type of Go language time object, you should usedatefilters (such as{{ myTimeVar|date:"2006-01-02" }}），but usually in the template directly operatetime.TimeThere are few cases where objects are involved, and Safe CMS usually provides time as timestamps.
• Verify the display effectIn modifying the template, make sure to refresh the page and check if the date and time are displayed in the expected format.

PassstampToDateThis powerful tag, AnQi CMS provides great convenience for developers, making the display of time and date no longer a problem. It only takes a few simple steps to convert the cold timestamp into user-friendly information right in front of their eyes.

---

Common Questions (FAQ)

Q1: Why does my date formatting always show "2006-01-02" instead of the actual date?A1: This is because you may have misunderstood the Go language's time formatting rules.stampToDatein the tag,"2006-01-02"It is not a placeholder but a fixed reference date.You need to match the style of the actual date element you want to display against this reference date."2006-01-02"; If you want to display "day/month/year", write"02/01/2006".

Q2: I have a variable that istime.TimeType (or similar date object), can be usedstampToDateto format?A2:stampToDateLabel is used specifically for formattingInteger timestampprocessed.time.TimeOr other date objects, you should try using the built-in template engine.dateFilter (if available) or other formatting methods suitable for the data type. In the AnQi CMS templates, most of the time data will be provided directly in timestamp format, thereforestampToDate通常是首选。

Q3: If I only need to display the year, month, or a specific part of the date, how do I write the formatted string?A3: You can refer to the Go language's reference time2006年01月02日 15时04分05秒Only select the parts you need.

• Only show the year:{{stampToDate(item.CreatedTime, "2006")}}
• Only display the month.:{{stampToDate(item.CreatedTime, "01")}}(Will be displayed as "10") or{{stampToDate(item.CreatedTime, "Jan")}}(Will be displayed as "Oct")
• Only display the hour and minute:{{stampToDate(item.CreatedTime, "15:04")}}