In website operation, we often need to display various time information on the front-end page, such as the publication date of articles, content update time, or user comment time.AnQiCMS as an enterprise-level content management system, usually adopts the efficient and concise format of Unix timestamp when storing data.However, for users accessing the website, a string of numeric timestamps is obviously not intuitive and user-friendly.How can I convert these timestamps into a readable date format in AnQiCMS templates?

AnQiCMS provides a very practical built-in tag and filter, making this conversion process simple and quick, even if you don't deeply understand the underlying details of the Go language, you can easily implement it.

Understand the timestamp in AnQiCMS templates

Inside AnQiCMS, such as articlesCreatedTime(Creation time) andUpdatedTime(Update time), commentsCreatedTime, user login logsLastLoginThe value is usually stored in the form of a 10-digit or more Unix timestamp.This is an integer representing the number of seconds elapsed since 00:00:00 UTC (Coordinated Universal Time) on January 1, 1970.This storage method is convenient for the system to sort, compare, and handle time zones, but when displaying to users, we would rather see a format like

Core Tools:stampToDateTags/Filter

AnQiCMS provides us withstampToDateThis powerful tag can directly convert timestamps into readable date formats that we need in the template.

Its basic usage syntax is very intuitive:{{ stampToDate(您的时间戳变量, "目标日期格式字符串") }}

There are two key parts:

  1. Your timestamp variableis usually:archiveList/archiveDetailFrom other data tags where the timestamp field is obtained, for example,item.CreatedTimeorarchive.UpdatedTime.
  2. Target date format stringThis is the string that determines the final display style of the date. Unlike some other programming languages, the date formatting string in Go language (the underlying development language of AnQiCMS) is defined based on a fixed 'reference time', rather than using likeY-m-d H:i:sSuch placeholder. This magical reference time is:2006-01-02 15:04:05.

This means:

  • 2006Represents the year
  • 01Represents the month (January)
  • 02represents the date
  • 15Represents the hour in 24-hour format
  • 04Represents minutes
  • 05Represents seconds

You only need to replace the numbers in this reference time with the format symbol you want. For example:

  • To displayYear-Month-Day:"2006-01-02"
  • To displayYear/Month/Day:"2006/01/02"
  • To displayYear Month Day (Chinese):"2006年01月02日"
  • To displayHour:Minute:Second:"15:04:05"
  • To displayFull date and time:"2006-01-02 15:04:05"
  • To displayShort month and day:"01-02"
  • To displayAM/PM hours:"03:04 PM"(Note, the03represents the 12-hour clock hourPMmeans AM/PM)

In the actual application of AnQiCMS templates

Let's see how to use it in the article list and article detail pages through a specific examplestampToDate.

假设您有一个文章列表页面，并且希望显示每篇文章的发布时间和更新时间，以及在文章详情页显示详细的发布时间。

Article list template example ({模型table}/list.htmlor home pageindex.html) part):

<div class="articles-list">
    {% archiveList archives with type="page" limit="10" %}
        {% for item in archives %}
        <article class="article-item">
            <h2><a href="{{item.Link}}">{{item.Title}}</a></h2>
            <div class="article-meta">
                <span>发布于：{{ stampToDate(item.CreatedTime, "2006年01月02日") }}</span>
                <span>更新于：{{ stampToDate(item.UpdatedTime, "2006/01/02 15:04") }}</span>
                <span>阅读量：{{item.Views}}</span>
            </div>
            <p class="article-description">{{item.Description}}</p>
            <a href="{{item.Link}}" class="read-more">阅读更多</a>
        </article>
        {% empty %}
        <p>暂时没有内容。</p>
        {% endfor %}
    {% endarchiveList %}

    {# 如果是分页列表，别忘了加上分页导航 #}
    <div class="pagination-controls">
        {% pagination pages with show="5" %}
            {# 分页代码略，参考AnQiCMS分页标签文档 #}
        {% endpagination %}
    </div>
</div>

In this example:

  • item.CreatedTimeFormatted as "xxxx xx xx".
  • item.UpdatedTimeFormatted as "xxxx/xx/xx xx:xx".

Article detail template example ({模型table}/detail.html):

`twig

<h1>{{archive.Title}}</h1>
<div class="article-info">
    <span>发布时间：{{ stampToDate(archive.CreatedTime, "2006年01月02日 15时04分05秒") }}</span>
    <span>更新时间：{{ stampToDate(archive.UpdatedTime, "2006-01-02 15:04:05") }}</span>
    <span>阅读量：{{archive.Views}}</span>
</div>
<div class="article-content">
    {{archive.Content|safe}}
</div>

<div class="article-tags">
    {% tagList tags with itemId=archive.Id limit="5" %}
        {% for tag in tags %}
        <a href="{{tag.Link}}">{{tag.Title}}</a>
        {% endfor %}
    {% endtagList %}
</div>

<div class="navigation-links">
    {% prevArchive prev %}
        {% if prev %}<a href="{{prev.Link}}">上一篇：{{prev.Title}}</a>{% else %}<span>没有上一篇了</span>{% endif %}
    {% endprevArchive %}
    {% nextArchive next %}