Empower content timeliness: The efficient display method of the article list page publication date in AnQi CMS

In today's rapidly changing digital world, the timeliness of content is crucial for the attractiveness and user experience of websites.Whether it is news reporting, technical articles, or product updates, clearly displaying the publication date can help readers quickly judge the value of the information and enhance the professionalism of the website.For users of AnQiCMS, this is a very easy-to-implement feature, because the system has a powerful and flexible template tag system, especiallystampToDateTags, which can cleverly convert the timestamp data from the background to the date format we are familiar with.

As an experienced website operations expert, I know the value of transforming technical details into practical operations. Next, I will guide everyone on how to use Anqi CMS'sstampToDateLabels, elegantly display the publication date of each document on your article list page.

Understand the 'secret' behind time:stampToDateThe principle of operation of tags

On the AnQi CMS backend, the publication time of articles is usually stored in the form of a 'timestamp' (Unix timestamp).This essentially is a long numerical sequence that represents the number of seconds elapsed since 00:00:00 UTC on January 1, 1970, to a specific time point.This format is very efficient for computers, but it is very obscure for humans.

To solve this problem, Anqi CMS providesstampToDateThis powerful template tag. Its function, as the name implies, is to convert this numeric timestamp 'seal' into a human-readable date and time format.Its basic usage is very intuitive:

{{ stampToDate(时间戳, "格式") }}

There are two key parts:

  1. timestamp: You need to pass a 10-digit or 13-digit number representing the article's publish time.
  2. Format: This is a string that tellsstampToDateWhat format would you like the date to be displayed in? It should be noted that the date format string of Anq CMS (developed based on Go language) is based on a fixed reference date2006-01-02 15:04:05Defined. For example, if you want to display the format "Year-Month-Day", you should write it as"2006-01-02"；If you want to display the format "Hour:Minute", then write it as"15:04". This reference date is like a template, you can enter the year, month, day, hour, minute, and second at the corresponding positions.

Capture the moment of article publication: archiveListofCreatedTime

When we are on the Anqing CMS article list page (usually corresponding to the modellist.htmltemplate file, for examplearticle/list.html)archiveListWhen a tag loops to display articles, the detailed information of each article is assigned to a temporary variable (usually nameditem). In thisitemThe object contains the release time information we need-CreatedTime.

item.CreatedTimeIt is that 10-digit numerical timestamp that faithfully records the moment the article was created and published. With it, we can use it asstampToDatethe first parameter of the tag.

Mingle both ingeniously: Display the publish date on the article list page

Now, we have the "conversion tool" (stampToDate) and "original data" (item.CreatedTime), next is to combine them into your template code. Suppose your article list page template (for examplearticle/list.html) structure is as follows:

{% archiveList archives with type="page" limit="10" %}
    {% for item in archives %}
        <article class="article-item">
            <h3 class="article-title"><a href="{{ item.Link }}">{{ item.Title }}</a></h3>
            <div class="article-meta">
                <span class="publish-date">发布日期：{{ stampToDate(item.CreatedTime, "2006年01月02日") }}</span>
                <span class="article-views">阅读量：{{ item.Views }}</span>
            </div>
            <p class="article-description">{{ item.Description }}</p>
            <a href="{{ item.Link }}" class="read-more">查看详情</a>
        </article>
    {% empty %}
        <p class="no-content">暂无文章发布。</p>
    {% endfor %}
{% endarchiveList %}

{# 如果您的列表需要分页，可以在此处添加分页标签 #}
{% pagination pages with show="5" %}
    {# 分页导航的代码，例如： #}
    <div class="pagination-nav">
        {% if pages.PrevPage %}<a href="{{ pages.PrevPage.Link }}">上一页</a>{% endif %}
        {% for page in pages.Pages %}<a href="{{ page.Link }}" class="{% if page.IsCurrent %}active{% endif %}">{{ page.Name }}</a>{% endfor %}
        {% if pages.NextPage %}<a href="{{ pages.NextPage.Link }}">下一页</a>{% endif %}
    </div>
{% endpagination %}

In the above code snippet, we specifically in<div class="article-meta">This area added a line:

<span class="publish-date">发布日期：{{ stampToDate(item.CreatedTime, "2006年01月02日") }}</span>

This line of code is the core. When the page is accessed,archiveListIt will iterate through each article,item.CreatedTimeIt will extract the timestamp of the current article, thenstampToDateThe label will be adjusted according to your specifications"2006年01月02日"Formatted into a direct display of "XXXX year XX month XX day". You can adjust it as needed.spanLabel styles to integrate date information into your website design.

Versatile: customize your date display format.

stampToDateThe power of tags lies in the flexibility of their format strings. Besides the examples above,"2006年01月02日"you can try various combinations to meet different design and information display needs:

  • Show Year and Month Only:{{ stampToDate(item.CreatedTime, "2006年01月") }}-> March 2023
  • Simple Month/Day Format:{{ stampToDate(item.CreatedTime, "01/02") }}-> 03/15
  • Include Full Time:{{ stampToDate(item.CreatedTime, "2006-01-02 15:04:05") }}-> 2023-03-15 10:30:00
  • Show the day of the week:{{ stampToDate(item.CreatedTime, "2006-01-02 Mon") }}-> 2023-03-15 Wed (English representation of days of the week, with "Mon" representing Monday, etc.)

You can adjust the date display format flexibly according to the overall design style of the website and the reading habits of the users, ensuring that the information is clear and beautiful.

Summary

BystampToDateTags, Anqi CMS makes it extremely simple and efficient to display the publish date on the article list page.It not only enhances users' trust in the content but also benefits search engine optimization (SEO), allowing the crawler to better understand the timeliness of the content.Master this little trick, and your Aiqi CMS website operation will be more refined and professional.

Frequently Asked Questions (FAQ)

  1. Q:item.CreatedTimeWhy is it a long number instead of the date format I'm familiar with?A: This is becauseitem.CreatedTimeThis stores the Unix timestamp (Unix timestamp).It is an internationally recognized standard representing the number of seconds elapsed since 00:00:00 UTC on January 1, 1970.This format is easy for machines to process, convenient for cross-platform data exchange and comparison, andstampToDateLabels are used to convert this machine language into a date format familiar to humans.

  2. Q: How do I set the format parameter to display only the year or month in a date?stampToDate?A: You just need to refer to the reference date in the Go language.2006-01-02 15:04:05Keep only the year and month parts you want to display.

    • Only show the year:{{ stampToDate(item.CreatedTime, "2006年") }}
    • Only show the month and date:{{ stampToDate(item.CreatedTime, "01月02日") }}

  3. Q: If my article has an update date, can I display the update date instead of the publication date?A: Of course you can. Anqi CMS usually also provides for articles.item.UpdatedTimeThis field records the timestamp of the last update of the article. You can setitem.CreatedTimeReplace