How to display the publication time of articles in Anqi CMS and customize the date and time format?

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), as it conveys the signal that the website content is continuously updated.AnQiCMS (AnQiCMS) offers great flexibility in content management, whether it is to obtain or customize the display time of the published articles, it is very convenient.

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

Get the publication time of the article

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, they exist in the form of timestamps, which means they are a series of numbers, for example1609470335.

We need to use the template tags provided by Anqí CMS in the template file (usually) to display these times on the article detail page or in the article list.archive/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 use:archiveDetailnamed tag style:

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

If you are on the article list page (for example, usingarchiveListTags loop to display articles) It is also very direct to get the publication 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 it outputs directly like thisCreatedTime(orUpdatedTimeYou will get a string of numbers, not the familiar date and time format.This is because they are UNIX timestamps and need to be further formatted to be presented in a human-readable way.

Custom 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 according to the specific format rules of the Go language into any date-time string we want.

stampToDateThe usage method of the tag is{{stampToDate(时间戳, "格式")}}. The "format" is a string, it is not what we usually understand.YYYY-MM-DDSuch placeholders, but Go language has a unique 'reference time' format. Go language uses a fixed time2006-01-02 15:04:05As a formatting reference template. This means:

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

Understood the reference rules, we can flexibly combine various date and time formats.

Here are some common formatting examples:

• Only display the date (year-month-date): If you only want to display 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 -->
  

• Display the date and time (accurate to minutes)If you need to be accurate to minutes, you can add the hour and minute reference value after the date.

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

• Show full date and time (to the second)The complete format includes 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 displayYou can even combine Chinese to display dates, such as "October 26, 2023".

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

• Other custom combinationsFor 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 Example

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

Article detail 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>

By using the above method, you can easily display the publication time of the article in the various locations of the Anqi CMS website in the format you wish.This flexibility makes the presentation of content more professional and in line with user habits.

Frequently Asked Questions (FAQ)

1. Why output directly{{archive.CreatedTime}}Is it a string of numbers, not a date format?This is becauseCreatedTime(andUpdatedTimeat