How to convert a timestamp to a specified date format and display it in the AnQiCMS template?

In Anqi CMS template design, we often encounter situations where we need to display timestamp data in a human-readable date format.Whether it is the publication time of the article, the update date of the content, or the record of user activities, this data is usually stored in the form of timestamps in the database.It is particularly important to master how to convert timestamps to specified date formats in templates so that website visitors can clearly and intuitively understand this information.

Where do the timestamps in AnQiCMS come from?

In AnQiCMS, you will find that many data fields related to time exist in the form of timestamps, such as article detail tags (archiveDetail) and article list tags (archiveList) in theCreatedTime(creation time) andUpdatedTime(Update time), as well as the comment list label(commentList) in theCreatedTime, as well as the user details label(userDetail) in theLastLogin(Last login time) andExpireTime(VIP expiration time) and so on. These timestamps are usually a 10-digit integer representing the number of seconds elapsed since the Unix epoch (January 1, 1970, 00:00:00 UTC).

Directly displaying these 10-digit numbers means nothing to ordinary users, therefore we need to convert them into easily understandable formats such as "March 15, 2023

Core function:stampToDateTag debut

AnQiCMS has provided a special template tag for this -stampToDateIt can easily convert timestamps to the date format you want.This tag is very intuitive in use, only two parameters are needed: the timestamp you want to convert and a string defining the output format.

Its basic syntax is:{{stampToDate(您的时间戳变量, "您的格式字符串")}}.

Understanding these two parameters is the key to successful conversion.

1. Your timestamp variableThis is usually the data field you get through other tags (such asarchiveListorarchiveDetail), for exampleitem.CreatedTimeorarchive.UpdatedTime. Please note that it must be a10 digitsUnix timestamp (second level).

2. Your format string: This is the 'magic incantation' that determines the date output format. AnQiCMS is developed based on the Go language, so the format string here follows the unique date formatting standard of the Go language.This standard uses a specific reference date——2006年01月02日 15时04分05秒 -0700 MST(or simply put)2006-01-02 15:04:05As a formatting template. You need to replace each component of the reference date with the corresponding value you want to display.

   For example:

   • 2006Represents the year (four digits)
   • 01Represents the month (two digits, with leading zeros if necessary)
   • 02Represent the date (two digits, leading zero if necessary)
   • 15Represent the hour (24-hour format, two digits, leading zero if necessary)
   • 04Represent the minutes (two digits, leading zero if necessary)
   • 05Represents seconds (two digits, leading zeros if necessary)

   By combining these 'magic numbers', you can create a variety of date formats.

How to usestampToDateTag

Let's understand how to use it in AnQiCMS template with some specific examples.stampToDateLabel. Suppose we have a timestamp1678886400It corresponds to2023-03-15 00:00:00.

• Displayed as 'Year-Month-Day':

  <p>发布日期：{{stampToDate(item.CreatedTime, "2006-01-02")}}</p>
  {# 输出: 发布日期：2023-03-15 #}
  

• Displayed as 'YearMonthDayHourMinuteSecond':

  <p>更新时间：{{stampToDate(archive.UpdatedTime, "2006年01月02日 15时04分05秒")}}</p>
  {# 输出: 更新时间：2023年03月15日 00时00分00秒 #}
  

• Displayed as 'Month/Day Time:Minute':

  <p>登录时间：{{stampToDate(user.LastLogin, "01/02 15:04")}}</p>
  {# 输出: 登录时间：03/15 00:00 #}
  

• Show as a pure year:

  <p>版权年份：{{stampToDate(someTimestamp, "2006")}}</p>
  {# 输出: 版权年份：2023 #}
  

Common application scenario examples

tostampToDateLabels integrated into actual templates can greatly enhance the professionalism of information presentation.

1. Display the article publication date on the article list pageWhen you usearchiveListWhen looping through multiple articles, you can display the publication time of each article like this:

   {% archiveList archives with type="page" limit="10" %}
       {% for item in archives %}
           <div>
               <h3><a href="{{item.Link}}">{{item.Title}}</a></h3>
               <p>发布于：<span>{{stampToDate(item.CreatedTime, "2006年01月02日")}}</span></p>
               <p>{{item.Description}}</p>
           </div>
       {% endfor %}
   {% endarchiveList %}
   

2. The update time of the content displayed on the article detail pageIn the article detail page, you may need to display the creation time and the latest update time of the article so that readers can understand the timeliness of the content:

   <article>
       <h1>{% archiveDetail with name="Title" %}</h1>
       <p>
           <span>发布日期：{{stampToDate(archive.CreatedTime, "2006-01-02")}}</span>
           <span>最后更新：{{stampToDate(archive.UpdatedTime, "2006-01-02 15:04")}}</span>
       </p>
       <div class="content">
           {%- archiveDetail articleContent with name="Content" %}
           {{articleContent|safe}}
       </div>
   </article>
   

   Here we assumearchiveIs the data object of the current article detail.

3. Display user-related time information: If your website has a user center, you may need to display the user's VIP expiration time:

   {% userDetail user with name="Id" id="当前用户ID" %}
   <p>您的VIP将于：<span>{{stampToDate(user.ExpireTime, "2006年01月02日")}}</span> 到期。</p>
   {% enduserDetail %}
   

   Of course, when actually in use, you need to obtain according to the actual page contextuser.ExpireTimethis timestamp variable.

A little reminder:datethe filter meetsstampToDateDifference

In the AnQiCMS template system, in addition tostampToDateLabel, you may also see a name calleddatefilter. Here you need to pay special attention todateThe filter is natively supported by the Go language template engine, and it expects to process native Go languagetime.TimeType (a date-time object), not the 10-digit Unix timestamp (integer) we are discussing here.

If you try to pass a timestamp directly todateFilter, it is very likely to report an error during template parsing.stampToDateTag