如何在AnQiCMS中显示指定文章或产品的详细内容?

安企CMS(AnQiCMS)作为一个高效灵活的内容管理系统,提供了直观的方式来管理和展示各类内容。当您希望在网站上呈现某一篇特定的文章、产品详情,或者任何通过内容模型创建的独立内容页面时,核心在于利用其强大的模板标签功能。

AnQiCMS将网站上的文章、产品等可独立展示的内容统称为“文档”(archive)。这种统一的设计使得管理和调用这些内容的详细信息变得非常一致和便捷。无论您要展示的是一篇博客文章、一个产品详情,还是某个特定的活动信息,都可以通过相同的逻辑和标签来实现。

核心标签:archiveDetail 的使用

要显示指定文档的详细内容,我们主要依赖AnQiCMS提供的archiveDetail标签。这个标签专门用于获取单个文档的详细数据。

在模板中,如果您已经处于某个文档的详情页面,系统会自动识别并加载当前文档的数据,此时可以直接通过{{ archive.字段名 }}的方式来调用文档的各项信息。例如,要显示当前文档的标题,可以直接使用{{ archive.Title }}

如果您需要显式地获取某个特定文档(而不是当前页面文档)的数据,或者要获取除默认archive对象外字段,archiveDetail标签就显得尤为重要。它的基本用法是:

{% archiveDetail 变量名称 with name="字段名称" id="文档ID" %}

或者通过URL别名:

{% archiveDetail 变量名称 with name="字段名称" token="文档URL别名" %}

这里,变量名称是一个可选的参数,如果设置了,您可以将获取到的数据赋值给这个变量,并在后续使用该变量。name属性则用来指定您想获取的具体字段,例如Title(标题)、Content(内容)、Description(描述)等。idtoken则用来精确指定您希望显示哪个文档的内容。

调用常见字段:

AnQiCMS的文档包含了一系列常用的字段,例如:

  • 标题 (Title): {% archiveDetail with name="Title" %}{{ archive.Title }}
  • 内容 (Content): {% archiveDetail with name="Content" %}{{ archive.Content }}
  • 简介 (Description): {% archiveDetail with name="Description" %}{{ archive.Description }}
  • 链接 (Link): {% archiveDetail with name="Link" %}{{ archive.Link }}
  • 发布时间 (CreatedTime): 需要配合stampToDate函数进行格式化,例如 {{ stampToDate(archive.CreatedTime, "2006-01-02 15:04") }}
  • 封面首图 (Logo): {% archiveDetail with name="Logo" %}{{ archive.Logo }}
  • 缩略图 (Thumb): {% archiveDetail with name="Thumb" %}{{ archive.Thumb }}
  • 分类信息 (Category): {{ archive.Category.Title }} 获取分类标题,或使用 {% categoryDetail with name='Title' id=archive.CategoryId %}

特别注意Content字段的显示:

当您显示文档的Content(内容)时,如果内容中包含HTML标签,为了确保浏览器能够正确解析并渲染这些内容,通常需要在输出时添加|safe过滤器。此外,如果您的内容启用了Markdown编辑器,archiveDetail标签还支持render参数来控制是否将Markdown转换为HTML,以及lazy参数用于图片的懒加载处理。例如:

{# 显示文档内容并解析HTML,如果开启Markdown则渲染,且图片支持data-src懒加载 #}
{% archiveDetail articleContent with name="Content" render=true lazy="data-src" %}
{{ articleContent|safe }}

展示内容模型自定义字段:archiveParams 标签

AnQiCMS的一大优势在于其灵活的内容模型。您可以在后台为不同的内容模型(如文章模型、产品模型)添加自定义字段。要显示这些自定义字段的内容,可以使用archiveParams标签。

如果您想遍历并显示某个文档的所有自定义参数,可以这样操作:

{% archiveParams params %}
    {% for item in params %}
        <div>
            <span>{{ item.Name }}:</span>
            <span>{{ item.Value }}</span>
        </div>
    {% endfor %}
{% endarchiveParams %}

这里,item.Name是自定义字段的名称(如”文章作者”),item.Value是该字段对应的值。

如果您知道自定义字段的名称(例如,您添加了一个名为author的自定义字段),您也可以更直接地通过archiveDetail标签来调用它:

{# 直接获取名为'author'的自定义字段的值 #}
<div>作者:{% archiveDetail with name="author" %}</div>

展示单页(Page)的详细内容:pageDetail 标签

除了文章和产品这类“文档”外,AnQiCMS还支持创建独立的“单页”(如“关于我们”、“联系我们”)。显示单页的详细内容与显示文档的逻辑非常相似,使用pageDetail标签。

其用法与archiveDetail高度一致,同样可以通过idtoken指定单页,并使用name属性获取具体字段(如TitleContentDescriptionLogoImages等)。

{# 获取ID为5的单页标题 #}
{% pageDetail pageTitle with name="Title" id="5" %}
<h1>{{ pageTitle }}</h1>

{# 获取当前单页的内容 #}
{% pageDetail pageContent with name="Content" %}
<div>{{ pageContent|safe }}</div>

结合实际场景的示例

通用文章详情页展示:

假设您要构建一个常见的文章详情页面,包含标题、分类、发布日期、标签、浏览量和正文内容。

<article>
    <h1>{{ archive.Title }}</h1>
    <div>
        <span>分类:<a href="{% categoryDetail with name='Link' id=archive.CategoryId %}">{% categoryDetail with name='Title' id=archive.CategoryId %}</a></span>
        <span>发布于:{{ stampToDate(archive.CreatedTime, "2006年01月02日") }}</span>
        <span>浏览量:{{ archive.Views }}次</span>
        <span>标签:
            {% tagList tags with itemId=archive.Id limit="10" %}
                {% for tag in tags %}
                    <a href="{{ tag.Link }}">{{ tag.Title }}</a>
                {% endfor %}
            {% endtagList %}
        </span>
    </div>
    <div class="content-body">
        {% archiveDetail docContent with name="Content" render=true lazy="data-src" %}
        {{ docContent|safe }}
    </div>
</article>

产品详情页展示:

对于产品详情页,除了标题和描述,可能还需要展示自定义的产品参数(如型号、品牌、颜色)和联系方式。

”`twig

<div class="product-images">
    <img src="{{ archive.Logo }}" alt="{{ archive.Title }}" />
    {# 如果有其他产品图片,可以通过 archive.Images 循环展示 #}
    {% if archive.Images %}
        {% for img in archive.Images %}
            <img src="{{ img }}" alt="{{ archive.Title }} - 更多图片" />
        {% endfor %}
    {% endif %}
</div>

<div class="product-info">
    <h1>{{ archive.Title }}</h1>
    <p class="description">{{ archive.Description }}</p>

    <div class="product-specs">
        <h3>产品参数:</h3>
        {% archiveParams params %}
            {% for item in params %}
                <div>
                    <span>{{ item.Name }}:</span>
                    <span>{{ item.Value }}</span>
                </div>
            {% endfor %}
        {% endarchiveParams %}
    </div>

    <div class="contact-info">
        <p>如需购买或咨询,请联系:</p>
        <p>电话:<a href="tel:{% contact with name='Cellphone' %}">{% contact with name="Cellphone" %}</a></p