How to format and display the article's publish timestamp in AnQiCMS templates?

Calendar 👁️ 67

In Anqi CMS, we all hope that visitors can clearly see the publication or update time of the articles.A clear and beautiful time format not only enhances the professionalism of the page but also optimizes the user experience.AnQi CMS with its flexible template engine makes it very simple to customize the display format of timestamps.

Next, we will explore how to present the publication time of articles accurately and elegantly in the AnQiCMS template.

Understand the time data in the AnQiCMS template.

In AnQiCMS, the publish time of the article (CreatedTimeAnd update time(UpdatedTime) is usually expressed with timestampStored in the form of a string in the database. A timestamp is a series of numbers representing the number of seconds elapsed from a fixed point in time (usually the Unix epoch, January 1, 1970, 00:00:00 UTC) to the moment the article was published or updated.Although this original format is very efficient for computer processing, it is difficult for users to understand.

Therefore, our goal is to convert these digital timestamps into the familiar 'year-month-day hour:minute:second' format or other more readable formats.

Core Tool:stampToDateTag

AnQiCMS provides a template engine namedstampToDateThe built-in label that is the secret weapon for formatting timestamps.This label can receive a 10-digit timestamp and convert it to a readable date string according to the format we specify.

Its basic usage is:{{stampToDate(时间戳变量, "格式字符串")}}.

These two key parts:

  1. Timestamp variableIt is usually:archive.CreatedTimeoritem.CreatedTime(In the article list loop).
  2. Format stringThis is the key to determining the time display style. It follows a set of date and time formatting rules unique to the Go language (the development language of AnQiCMS).

The Mystery of Time Formatting: Reference Time in Go Language

The date and time formatting method in Go Language is somewhat special, it does not use the commonY-m-d H:i:sorYYYY-MM-DD HH:MM:SSInstead of such placeholders, use onespecific reference date and timeCome as a template. This reference time is:2006-01-02 15:04:05.

Remember, every number and symbol in this reference time represents the corresponding part you want to see in the final output:

  • 2006represent the year (full 4 digits)
  • 01represent the month (with leading zero, such as 01)
  • 02represent the date (with leading zero, such as 02)
  • 15Represent hours (24-hour format, with leading zero, such as 15)
  • 04Represent minutes (with leading zero, such as 04)
  • 05Represent seconds (with leading zero, such as 05)

If there are other elements in the reference time, such asMon(Monday),Jan(January), they also have their respective meanings.

This means, if you want to output "year-month-date", you should follow this pattern; if you want to output "month/day/year", write it as2006-01-02this pattern.01/02/2006. The system will parse and format your actual timestamp based on the template you provide.

For example:

  • "2006-01-02"It will be displayed as2023-10-27
  • "2006年01月02日"It will be displayed as2023年10月27日
  • "15:04:05"It will be displayed as10:30:00
  • "2006/01/02 15:04"It will be displayed as2023/10/27 10:30
  • "Mon, 02 Jan 2006"It will be displayed asFri, 27 Oct 2023

Application in practice: Formatting timestamps in the template.

UnderstoodstampToDateAfter the formatting rules of tags and Go language, we can actually apply them in the AnQiCMS template.

In the detail page of a single article (detail.html)

In the detail page of an article, we usually go througharchiveDetailTag to get the details of the article, includingCreatedTime.

Suppose we want to display the format as "Published on: October 27, 2023, 10:30".

<article>
    <h1>{% archiveDetail with name="Title" %}</h1>
    <div class="article-meta">
        {# 获取文章发布时间戳 #}
        {% archiveDetail articleCreatedTime with name="CreatedTime" %}
        {# 使用 stampToDate 格式化并显示 #}
        <span>发布于:{{stampToDate(articleCreatedTime, "2006年01月02日 15:04")}}</span>
        {# 您也可以直接在 archive 变量上操作,更加简洁 #}
        {# <span>发布于:{{stampToDate(archive.CreatedTime, "2006年01月02日 15:04")}}</span> #}
    </div>
    <div class="article-content">
        {%- archiveDetail articleContent with name="Content" %}
        {{articleContent|safe}}
    </div>
</article>

On the article list page (list.htmlorindex.html)

On the article list page, we usually usearchiveListtags to display multiple articles in a loop. Inside the loop, we can handle each article'sCreatedTimeto format.

Assume we want to display "2023-10-27" below each article in the list.

`twig

    {% archiveList archives with type
    

Related articles

How to automatically add the `rel="nofollow"` attribute to hyperlinks in the page to optimize SEO?

In website content operation, hyperlinks play a vital role, they are not only the bridge for users to browse and obtain information, but also the key for search engines to understand the structure of the website and pass on page authority (PageRank).However, not all links should pass weight, especially links to external websites.At this point, the `rel="nofollow"` attribute comes into play, which can tell the search engine "Do not follow this link, nor pass the weight of this page to the link target".Use `rel="nofollow"` appropriately

2025-11-07

How does AnQiCMS handle and display image resources, including thumbnails and original images?

The charm of website content largely comes from images.They not only beautify the page, but also convey information directly, catching the reader's eye.Therefore, how a content management system (CMS) efficiently and intelligently handles and displays image resources is crucial for the overall performance of a website.AnQiCMS (AnQiCMS) provides a comprehensive and flexible solution in this regard, whether it is for the automatic generation of thumbnails or the optimization and presentation of the original images, it can help us easily manage the visual content of the website.

2025-11-07

How to display the subcategory list under a specified category in AnQiCMS template?

When using AnQiCMS to build a website, clearly organizing content and conveniently displaying it on the page is the key to improving user experience.Especially for content with multi-level classification structures, how to flexibly display the subcategory list under a specified category in the template is a need many users will encounter.A powerful template tag system of AnQiCMS, especially the `categoryList` tag, provides us with an elegant and efficient solution.### Understanding AnQiCMS Classification Structure Before delving into templates, it is important to understand how AnQiCMS manages classifications

2025-11-07

How to configure and display the recommended attributes of articles in AnQiCMS (such as头条, recommendation, slide)?

In AnQiCMS, let your important articles stand out on the website, such as setting them as the headline of the homepage, special recommendation, or slide show, which is a very practical content operation strategy.AnQiCMS offers intuitive features to help you easily manage the recommended attributes of these articles and flexibly display them on the website front-end. ### Backend Configuration of Article Recommendations Configuring article recommendations in the AnQiCMS management backend is a simple and direct process.

2025-11-07

How to set and display the pseudo-static URL structure of the AnQiCMS website?

AnQiCMS provides a flexible and powerful pseudostatic URL structure setting function in website operation, which is crucial for the SEO performance and user experience of the website.Static URL, as the name implies, makes the dynamic page link look like a simple and regular static file path, thus making it easier for search engines to crawl and for users to understand.Why is the use of pseudo-static URLs so important?Before delving into how to set up pseudo-statics in AnQiCMS, let's briefly review why it occupies such an important position in website operations: 1.

2025-11-07

How to display the current page's TDK (Title, Description, Keywords) information in AnQiCMS template?

In website operation, the TDK (Title, Description, Keywords) information of the website plays a vital role.They are not only the key for search engines to understand the content of the page, but also a critical factor for users to decide whether to click on your website in the search results.A well-optimized TDK can significantly improve a website's ranking in search engines and attract more target users.AnQiCMS (AnQiCMS) is a content management system designed for SEO optimization, naturally providing strong and flexible support for TDK management

2025-11-07

How to enable Markdown editor in AnQiCMS and ensure that mathematical formulas and flowcharts are displayed correctly on the webpage?

AnQiCMS provides a flexible and diverse editing experience for content creators, and the introduction of the Markdown editor has made it even more convenient for many users who are familiar with this concise markup language.However, simply enabling the Markdown editor is not enough for content that requires special rendering, such as mathematical formulas and flowcharts.This article will provide a detailed guide on how to enable Markdown editor in AnQiCMS and ensure that your web page can correctly and beautifully display complex mathematical formulas and flowcharts.### One, Enable

2025-11-07

How to implement lazy loading (lazyload) feature in AnQiCMS article content?

On your AnQiCMS website, optimizing image loading is a key step to improving user experience and website performance, especially for pages with a large number of image content.The Lazy Load (Lazy Load) technology is an efficient solution that allows the page to only load images within the user's viewport, while deferring the loading of images outside the viewport until the user scrolls near them.This can significantly reduce the initial page loading time, save bandwidth, and improve the overall website response speed.

2025-11-07