How to dynamically display the publication time of an article and format it on the article detail page?

In Anqi CMS, managing content, the publish time is undoubtedly an indispensable important piece of information for each article.It not only allows readers to understand the timeliness of the content, but also has a positive impact on the website's SEO.Fortunately, AnQi CMS provides us with a very convenient and flexible way to dynamically display and format these published times on the article detail page.

Get the publication time of the article

On the article detail page of Anqi CMS, the system automatically provides all information of the current article as context variables to us. Among them, the publication time is stored inCreatedTimeIn the field. This field is saved in the form of a timestamp, representing the specific moment the article was first published.

If you want to get this timestamp directly in the template, you can simply by{{ archive.CreatedTime }}To implement. This isarchiveIt usually represents the current article object in the article detail page.

The magic of the `stampToDate` tag for formatting the publication time.

It only displays a long timestamp, which is obviously not the effect we want.We need to convert it to a human-readable date and time format.stampToDate.

stampToDateThe design of the label is very intuitive, it accepts two parameters: the first is the timestamp to be formatted, and the second is the date and time format string you expect.

This format string is quite special, it is not the common oneYYYY-MM-DDThis form, rather than Go language特有的, based on2006-01-02 15:04:05This reference time point is defined. You just need to replace the different parts of this reference time point with the actual date or time you want to display.

Let's see some common formatting examples:

• Only show the year, month, and date: {{ stampToDate(archive.CreatedTime, "2006-01-02") }}
  • For example:2023-10-26
• Show the Chinese year, month, and day: {{ stampToDate(archive.CreatedTime, "2006年01月02日") }}
  • For example:2023年10月26日
• Show hours, minutes, and seconds: {{ stampToDate(archive.CreatedTime, "15:04:05") }}
  • For example:14:30:00
• Show the full date and time: {{ stampToDate(archive.CreatedTime, "2006-01-02 15:04:05") }}
  • For example:2023-10-26 14:30:00
• Display the day of the week and date: {{ stampToDate(archive.CreatedTime, "Mon, 02 Jan 2006") }}
  • For example:Thu, 26 Oct 2023

You can see, by combining flexibly2006-01-02 15:04:05with numbers and text, we can define almost any date and time format we want.

Integrate the publication time display on the article detail page

Generally, we will integrate the template file (such asdetail.htmlPerform these actions. Find the location where you want to display the publish time and insert the correspondingstampToDate.

A typical article detail page may contain a title, metadata (such as publication time, category, and views) and the article content. We can organize it like this:

<article class="article-detail">
    <h1 class="article-title">{{ archive.Title }}</h1>
    <div class="article-meta">
        <span class="publish-time">发布于：{{ stampToDate(archive.CreatedTime, "2006年01月02日 15:04") }}</span>
        <span class="category">分类：<a href="{% categoryDetail with name='Link' id=archive.CategoryId %}">{% categoryDetail with name='Title' id=archive.CategoryId %}</a></span>
        <span class="views">浏览：{{ archive.Views }}次</span>
        {# 如果需要显示更新时间，可以使用 UpdatedTime 字段 #}
        {# <span class="update-time">更新于：{{ stampToDate(archive.UpdatedTime, "2006-01-02") }}</span> #}
    </div>
    <div class="article-content">
        {{ archive.Content|safe }}
    </div>
</article>

In this code block:

• We go through directly{{ archive.Title }}Get the article title.
• UsestampToDate(archive.CreatedTime, "2006年01月02日 15:04")Format the article's publish timestamp into the format of 'Year-Month-Day Hour:Minute'.
• archive.Content|safeUsed to safely display article content, preventing HTML codes from being escaped.

By such settings, your article detail page can dynamically and beautifully display the publication time.

Some practical considerations

• CreatedTimewithUpdatedTime: CreatedTimeRecords the date and time of the first publication of the article. If the article has been modified multiple times, you may also see the displayUpdatedTimeThe field is of interest, it represents the last update time of the article. You can choose to display one or both according to the needs of the website.
• Default format:If you are usingarchiveDetailtag to obtainCreatedTimeorUpdatedTimewhen, no additional specification is madeformatThe parameter, it will be automatically formatted in the default case2006-01-02in the form of.
• Location of the template file: The template for the article detail page is usually located in the template package you are currently usingarchive/detail.htmlor{模型table}/detail.htmlThe specific name and structure may vary depending on your template design.

This flexible mechanism of AnQi CMS allows us to easily customize the content display, ensuring that every detail of the website meets our operational needs.

Frequently Asked Questions (FAQ)

1. Ask: Why do we use special number combinations when formatting time?2006-01-02 15:04:05What do they represent?Answer: This is a unique time formatting convention in the Go language. Go does not useYYYY-MM-DDThis symbol, rather than using a fixed reference time2006-01-02 15:04:05.999999999 -0700 MSTCome as a formatting template. You just need to replace the year, month, day, hour, minute, and second parts corresponding to the reference time point with the display format you want (for example, if you want to display a two-digit month, write...01Write to display the full year2006The system will format according to your replacement rules

2. Question: Which field should I use to display the update time of the article?Answer: The update time of the article is indicated byarchive.UpdatedTimethe field. Its usage is the same asCreatedTimethe same, and it also needs to be paired withstampToDatetags for formatting, for example:{{ stampToDate(archive.UpdatedTime, "2006年01月02日") }}.

3. Question: If I amstampToDateWhat will happen if the format string is not specified in the tag?Answer: InarchiveDetailDirectly retrieveCreatedTimeorUpdatedTimeAnd not specifyformatThe parameter, it will be formatted to `2006-0` by default in the default usage.