`archiveList`循环中,如何获取文档的缩略图、描述和发布时间?

作为一名资深的网站运营专家,我深知在内容管理系统中,如何高效、灵活地展示内容是网站成功的关键之一。AnQiCMS(安企CMS)凭借其强大的模板引擎和简洁的标签设计,让内容展示变得异常便捷。今天,我们就来深入探讨一个非常实用的场景:如何在archiveList循环中,优雅地获取并展示文档的缩略图、描述和发布时间。

开启内容循环:archiveList标签的魔力

在AnQiCMS中,archiveList标签是用于获取和循环展示文档列表的核心工具。无论是文章、产品还是其他自定义模型的内容,它都能帮助我们轻松地迭代处理。想象一下,您的网站首页或列表页需要展示一系列文章或产品,每一项都包含吸引人的图片、简短的摘要和发布日期,archiveList就是实现这一目标的起点。

它通常以这样的结构呈现在您的模板文件中:

{% archiveList archives with type="list" limit="5" %}
    {% for item in archives %}
        {# 在这里处理每一个文档项,item代表当前循环中的文档对象 #}
    {% endfor %}
{% empty %}
    {# 如果没有文档,这里的内容会被显示 #}
{% endarchiveList %}

在这段代码中,archives是我们为文档列表起的一个变量名,item则是在每次循环中代表当前文档的对象。所有我们需要的数据,都将从这个item对象中提取。

细致呈现:获取文档的缩略图

网站内容的视觉吸引力不言而喻,而缩略图正是提升这种吸引力的关键。在AnQiCMS中,获取文档的缩略图非常直观,主要通过item.Thumbitem.Logo字段来实现。

  • item.Thumb: 这个字段通常指向经过系统优化处理的缩略图路径。AnQiCMS在您上传文档图片时,会自动根据后台设置生成不同尺寸的缩略图。如果您在发布文档时没有手动上传缩略图,但文档内容中包含图片,系统还会智能地提取第一张图片作为缩略图。因此,item.Thumb是列表页推荐使用的缩略图字段,因为它尺寸通常更小,加载更快。

  • item.Logo: 相比之下,item.Logo字段可能指向文档的主要封面图,通常是原始尺寸或较大尺寸的图片。在某些设计场景下,如果需要展示更高清或更完整的封面,可以使用这个字段。

在模板中使用它们的代码示例如下:

{% if item.Thumb %}
    <img src="{{ item.Thumb }}" alt="{{ item.Title }}" class="document-thumbnail">
{% else if item.Logo %}
    <img src="{{ item.Logo }}" alt="{{ item.Title }}" class="document-logo">
{% endif %}

通过这样的条件判断,我们可以确保即使文档没有Thumb图,也能尝试使用Logo图作为备选,或者在两者都缺失时避免显示破碎的图片图标。

精炼概括:获取文档的描述

文档描述,或称摘要,是引导用户点击阅读的重要文本。它需要简明扼要地概括文档的核心内容。AnQiCMS将文档描述存储在item.Description字段中。

这个字段的内容可以直接输出:

<p class="document-description">{{ item.Description | truncatechars:120 }}</p>

这里我添加了一个truncatechars:120过滤器,这是AnQiCMS模板引擎中一个非常实用的功能,它可以将描述文字截取到指定字符数(这里是120个字符),并在末尾自动添加省略号。这对于保持列表页布局的整洁和统一性非常有帮助。值得一提的是,如果您在发布文档时没有手动填写描述,AnQiCMS会自动从文档内容中提取前150个字作为描述,大大减轻了内容运营者的负担。

追溯时间:获取文档的发布时间

发布时间对于用户来说,是判断内容时效性和价值的重要指标。在AnQiCMS中,文档的发布时间存储在item.CreatedTime字段中。但需要注意的是,CreatedTime字段返回的是一个Unix时间戳(10位数字),为了方便用户阅读,我们需要将其格式化为常见的日期时间格式。

AnQiCMS提供了一个名为stampToDate的内置标签,专门用于格式化时间戳。它的用法是{{ stampToDate(时间戳, "格式") }}。其中,“格式”参数遵循Go语言的时间格式化规则,例如"2006-01-02"表示年月日,"15:04:05"表示时分秒。

以下是一些常用的时间格式化示例:

{# 格式化为:2023年01月01日 #}
<span>发布于:{{ stampToDate(item.CreatedTime, "2006年01月02日") }}</span>

{# 格式化为:2023-01-01 12:30 #}
<span>发布于:{{ stampToDate(item.CreatedTime, "2006-01-02 15:04") }}</span>

{# 格式化为:Jan 01, 2023 #}
<span>发布于:{{ stampToDate(item.CreatedTime, "Jan 02, 2006") }}</span>

除了CreatedTime(创建时间),您还可以使用item.UpdatedTime来获取文档的更新时间,同样需要通过stampToDate进行格式化。

融会贯通:一个完整的archiveList循环示例

现在,让我们将这些元素整合到一个完整的archiveList循环中,模拟一个内容列表的展示:

<div class="document-list-section">
    {% archiveList archives with type="list" limit="6" order="id desc" %} {# 获取最新发布的6篇文档 #}
        {% for item in archives %}
            <div class="document-card">
                {% if item.Thumb %}
                    <a href="{{ item.Link }}" class="document-image-link">
                        <img src="{{ item.Thumb }}" alt="{{ item.Title }}" class="document-cover-image">
                    </a>
                {% endif %}
                <div class="document-info">
                    <h3 class="document-title"><a href="{{ item.Link }}">{{ item.Title }}</a></h3>
                    <p class="document-excerpt">{{ item.Description | truncatechars:100 }}</p>
                    <div class="document-meta">
                        <span class="document-date">发布于:{{ stampToDate(item.CreatedTime, "2006年01月02日") }}</span>
                        <span class="document-views">浏览:{{ item.Views }}</span>
                    </div>
                </div>
            </div>
        {% empty %}
            <p class="no-content-message">很抱歉,当前暂无文档可供显示。</p>
        {% endfor %}
    {% endarchiveList %}
</div>

在这个示例中,我们不仅获取了缩略图、描述和发布时间,还顺带展示了文档标题和