When operating website content, the publication time of the article is an indispensable element.It not only helps visitors quickly understand the 'freshness' of the content, but also has a positive impact on search engine optimization (SEO) because it conveys the signal that the website content is continuously updated.AnQiCMS provides great flexibility in content management, making it very convenient to obtain or customize the display of article publication time.

Next, we will explore how to flexibly display the publication time of articles in the Aiqi CMS and customize the date and time display format according to our needs.

Get the article's publish time

In AnQi CMS, each article is accompanied by two important timestamps:CreatedTime(Creation time) andUpdatedTime(Update time). These two fields store the creation or last modification time of the article in the system, which exists in the form of timestamps, meaning they are a sequence of numbers, such as1609470335.

To display these times on the article detail page or in the article list, we need to use the template tags provided by Anqi CMS in the template file (usuallyarchive/detail.htmlorarchive/list.html)

When we want to display the publish time on an article detail page, we can usearchiveDetailtags to get the current article'sCreatedTime:

<div>发布时间：{{archive.CreatedTime}}</div>

or usingarchiveDetailnamed way of tags:

<div>发布时间：{% archiveDetail with name="CreatedTime" %}</div>

If you are on the article list page (for example, usingarchiveListIn the tag loop display article), it is also very direct to get the publishing time of each article:

{% archiveList archives with type="list" limit="10" %}
    {% for item in archives %}
        <div>文章标题：{{item.Title}}</div>
        <div>发布时间：{{item.CreatedTime}}</div>
    {% endfor %}
{% endarchiveList %}

You will find that the output is like this directly:CreatedTime(or}UpdatedTimeYou will get a string of numbers instead of the familiar date and time format.This is because they are UNIX timestamps and need further formatting to be presented in a human-readable manner.

Customize the date and time format

To convert timestamps into a readable date and time format, AnQi CMS provides a very practical template tag: stampToDateThis tag allows us to format timestamps into any date-time string we want according to specific format rules of the Go language.

stampToDateThe usage method of the tag is{{stampToDate(时间戳, "格式")}}This "format" is a string, not what we usually understand.YYYY-MM-DDThis placeholder, rather than the 'reference time' format unique to the Go language. The Go language uses a fixed time.2006-01-02 15:04:05As a formatting template for reference. This means:

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

Once we understand this reference rule, we can flexibly combine various date and time formats.

The following are some common formatting examples:

  • Show date only (Year-Month-Day) If you only want to show the publication date of the article, you can use2006-01-02as the format string.

    <div>发布日期：{{stampToDate(archive.CreatedTime, "2006-01-02")}}</div>
<!-- 输出示例：2023-10-26 -->

  • Show date and time (precise to minutes)If you need to be precise to the minute, you can add the hour and minute reference values after the date.

    <div>发布时间：{{stampToDate(archive.CreatedTime, "2006-01-02 15:04")}}</div>
<!-- 输出示例：2023-10-26 10:30 -->

  • Display the full date and time (precise to seconds)Complete format including year, month, day, hour, minute, and second.

    <div>完整时间：{{stampToDate(archive.CreatedTime, "2006-01-02 15:04:05")}}</div>
<!-- 输出示例：2023-10-26 10:30:45 -->

  • Chinese date display You can even combine Chinese characters to display the date, like "October 26, 2023."

    <div>中文日期：{{stampToDate(archive.CreatedTime, "2006年01月02日")}}</div>
<!-- 输出示例：2023年10月26日 -->

  • Other custom combinations: For example, only display the month and date, or only display the hour and minute.

    <div>月日：{{stampToDate(archive.CreatedTime, "01-02")}}</div>
<!-- 输出示例：10-26 -->
<div>时分：{{stampToDate(archive.CreatedTime, "15:04")}}</div>
<!-- 输出示例：10:30 -->

Comprehensive Application Examples

Now, we will apply this knowledge to actual template code, taking the article detail page and article list page as examples.

Article details page (archive/detail.html) Example:

<article>
    <h1>{% archiveDetail with name="Title" %}</h1>
    <div class="article-meta">
        <span>分类：<a href="{% categoryDetail with name='Link' %}">{% categoryDetail with name='Title' %}</a></span>
        <span>发布于：{{stampToDate(archive.CreatedTime, "2006年01月02日 15:04")}}</span>
        <span>阅读量：{% archiveDetail with name="Views" %}</span>
        <!-- 如果文章有更新时间，可以这样显示 -->
        {% if archive.UpdatedTime and archive.UpdatedTime != archive.CreatedTime %}
        <span>更新于：{{stampToDate(archive.UpdatedTime, "2006年01月02日 15:04")}}</span>
        {% endif %}
    </div>
    <div class="article-content">
        {%- archiveDetail articleContent with name="Content" %}
        {{articleContent|safe}}
    </div>
</article>

Article list page (archive/list.html) Example:

<div class="article-list">
    {% archiveList archives with type="page" limit="10" %}
        {% for item in archives %}
        <div class="article-item">
            <h3><a href="{{item.Link}}">{{item.Title}}</a></h3>
            <div class="item-meta">
                <span>分类：{% categoryDetail with name="Title" id=item.CategoryId %}</span>
                <span>发布于：{{stampToDate(item.CreatedTime, "2006-01-02")}}</span>
                <span>浏览量：{{item.Views}}</span>
            </div>
            <p>{{item.Description}}</p>
            <a href="{{item.Link}}" class="read-more">阅读全文 &gt;&gt;</a>
        </div>
        {% empty %}
        <p>暂时没有文章发布。</p>
        {% endfor %}
    {% endarchiveList %}

    <div class="pagination-area">
        {% pagination pages with show="5" %}
            <!-- 分页链接，具体样式可根据需求调整 -->
            {% if pages.PrevPage %}<a href="{{pages.PrevPage.Link}}">上一页</a>{% endif %}
            {% for item in pages.Pages %}<a class="{% if item.IsCurrent %}active{% endif %}" href="{{item.Link}}">{{item.Name}}</a>{% endfor %}
            {% if pages.NextPage %}<a href="{{pages.NextPage.Link}}">下一页</a>{% endif %}
        {% endpagination %}
    </div>
</div>

You can easily display the article publication time at any position on the Anqi CMS website in the format you desire using the above method.This flexibility makes the presentation of content more professional and in line with user habits.

Common Questions (FAQ)

1. Why output directly{{archive.CreatedTime}}Is the result a sequence of numbers, not a date format?This is becauseCreatedTime(and)UpdatedTime) in