As an experienced website operation expert, I have accumulated rich experience in the practice of AnQiCMS.I deeply understand that the way content is presented is crucial for user experience, even something as seemingly trivial as the date format may affect the user's reading experience and the professionalism of the website.prevArchiveCombine within the tagstampToDateThe filter beautifully formats time.

Elegantly present the time of the previous article in AnQiCMS

When building website content, we often need to provide users with convenient navigation functions, such as 'Previous article' or 'Next article' links. AnQiCMS provides this for users.prevArchiveandnextArchiveSuch convenient tags, they can help us easily get information about adjacent articles.However, when we try to display the time data contained in these tags directly, we may find that they appear in the form of raw timestamps, which is not intuitive for ordinary users.stampToDateThe filter comes into play here, it can turn the cold timestamp into an easily understandable date and time format.

UnderstandprevArchiveTag

First, let's briefly review.prevArchiveThe function of the tag. When you are on the article detail page and want to display a link and a brief introduction to the previous article, you can use this tag. Its basic structure is usually as follows:

{% prevArchive prev %}
  {% if prev %}
    <a href="{{prev.Link}}">{{prev.Title}}</a>
  {% else %}
    <span>没有了</span>
  {% endif %}
{% endprevArchive %}

Here, prevIt is the variable name defined for the data of the previous article. Throughprev, we can access various fields of the previous article, such asprev.Linkget the article link,prev.TitleGet the article title. The time information is usually stored inprev.CreatedTime(creation time) andprev.UpdatedTimethe (update time) field. The values of these fields are standard Unix timestamps, such as1609470335Such a sequence of numbers. It is obvious that users cannot understand these numbers directly.

IntroductionstampToDateFilter: The magician of time.

To convert these timestamps into a user-friendly format, AnQiCMS providesstampToDateThis powerful filter. Its function is to receive a timestamp and a format string as parameters, and then output the formatted date and time.

stampToDateThe syntax is very intuitive:{{stampToDate(时间戳, "格式")}}. The 'timestamp' here is the number we obtained fromprev.CreatedTimeorprev.UpdatedTimeand the 'format' string is the key.

The template engine of AnQiCMS is developed based on Go language, therefore, its time formatting follows the Go language'stime.FormatThe rule of 'reference time' used by the function. This reference time is a fixed value:2006-01-02 15:04:05.999999999 -0700 MST.You do not need to remember this long string of numbers and letters, just know that when you want to represent year, month, day, hour, minute, second information, you use the corresponding part of this reference time to 'occupy'.

  • YearUse2006to represent a four-digit year (such as 2023).
  • MonthUse01To represent two-digit months (e.g., 09), useJanTo represent the English abbreviation of months (e.g., Sep), useJanuaryTo represent the English full month name (e.g., September).
  • DateUse02To represent a two-digit date (e.g., 15), use_2To represent a date without leading zeros (e.g., 5).
  • hoursUse15To represent 24-hour time (e.g., 13), use03To represent 12-hour time (e.g., 01).
  • minuteUse04represents two digits of minutes (such as 08).
  • secondsUse05represents two digits of seconds (such as 30).

After mastering this basic principle, we can flexibly combine various date and time formats.

InprevArchiveChinese formatted time: practical exercise

Now, let's takeprevArchiveandstampToDateCombine them and see how to apply them in actual templates.

Suppose we want to display the title of the previous article at the same time as its publication date, formatted as "YYYY年MM月DD日".

{% prevArchive prev %}
  {% if prev %}
    <p>上一篇：
      <a href="{{prev.Link}}">{{prev.Title}}</a>
      <!-- 格式化发布时间为“年年年年-月月-日日” -->
      <small>发布于：{{stampToDate(prev.CreatedTime, "2006-01-02")}}</small>
    </p>
  {% else %}
    <p>没有上一篇文章了</p>
  {% endif %}
{% endprevArchive %}

In this code,{{stampToDate(prev.CreatedTime, "2006-01-02")}}Willprev.CreatedTimeThis timestamp is converted to2023-09-15This format.

If you need to display the specific publishing time, such as to the hour and minute, you can adjust the format string like this:

{% prevArchive prev %}
  {% if prev %}
    <p>上一篇：
      <a href="{{prev.Link}}">{{prev.Title}}</a>
      <!-- 格式化发布时间为“年年年年-月月-日日 时时:分分” -->
      <small>发布于：{{stampToDate(prev.CreatedTime, "2006-01-02 15:04")}}</small>
    </p>
  {% else %}
    <p>没有上一篇文章了</p>
  {% endif %}
{% endprevArchive %}

This may output发布于：2023-09-15 10:30.

Or if you need a more Chinese context expression, for example, the format string can be written as: 

{% prevArchive prev %}
  {% if prev %}
    <p>上一篇：
      <a href="{{prev.Link}}">{{prev.Title}}</a>
      <!-- 格式化发布时间为“年年年年年月月月日日日” -->
      <small>发布于：{{stampToDate(prev.CreatedTime, "2006年01月02日")}}</small>
    </p>
  {% else %}
    <p>没有上一篇文章了</p>
  {% endif %}
{% endprevArchive %}

By flexibly using the reference time format of Go language, you can easily achieve any date and time display effect you need, whether it isYYYY/MM/DD/MM-DD HH:mmor星期一, 02 Jan 2006,stampToDateit can help you achieve it.

AnQiCMS providesstampToDateThis powerful filter allows template developers to easily format time information in dynamic content, greatly enhancing the flexibility and user experience of content presentation.Make good use of these tools, your website can not only provide rich content, but also present every detail in a professional and user-friendly manner.

Frequently Asked Questions (FAQ)

Q1: Why do I need to usestampToDatea filter to format the time instead of displaying it directly{{prev.CreatedTime}}?

directly displaying{{prev.CreatedTime}}will output a pure numeric timestamp (for example:1609470335This format is hard to understand for ordinary website visitors.stampToDateThe role of the filter is to convert this machine-readable timestamp into a human-readable date and time string, for example2023年09月15日or10:30 AMThus greatly enhancing the user experience and readability of the content.

Q2:stampToDateWhat are the special requirements for the 'format' string in the filter? How can I remember it?

stampToDateThe format string follows the Go language'stime.Formatfunction specification, which uses a specific reference time2006-01-02 15:04:05Define the parts of a date and time.You do not need to remember the date represented by this reference time itself, just remember the meaning of each number (2006 represents the year, 01 represents the month, 02 represents the day, etc.).If you need a more complex format, refer to the AnQiCMS template tag document, which will list all options and examples of Go language time formatting in detail."2006-01-02"or"2006-01-02 15:04"Can meet most needs already.

Q3:stampToDateThe filter can only be used withprevArchiveTags, can you?

No, it's not.stampToDateIs a universal time formatting filter. As long as you can get any time data in the form of a Unix timestamp (for example, fromarchiveDetailobtainedarchive.CreatedTime, or fromarchiveListin the loopitem.UpdatedTime), you can use it asstampToDate