如何在前端页面中显示文章或产品的浏览量?

让内容活力尽显:在安企CMS前端页面轻松展示文章或产品浏览量

在网站运营中,文章或产品的浏览量往往是衡量内容受欢迎程度的一个重要指标。它不仅能为访问者提供直观的参考,形成“社会认同”效应,引导他们发现热门内容,也能帮助运营者快速识别高价值内容。安企CMS作为一款高效的内容管理系统,充分考虑了用户的实际需求,让在前端页面展示文章或产品的浏览量变得非常简单直观。

接下来,我们将一起探索如何在安企CMS中,利用其强大的模板标签功能,将这些宝贵的流量数据呈现在您的网站上。

在详情页中显示浏览量

当访问者进入一篇具体的文章或产品详情页时,通常会在标题下方、发布日期旁边找到浏览量信息。在安企CMS中,您可以使用archiveDetail标签来轻松获取当前内容的浏览量。

archiveDetail标签旨在获取当前页面内容的详细数据。要显示浏览量,您只需要指定name参数为Views即可。例如,最直接的用法是这样:

<span>浏览量:{% archiveDetail with name="Views" %}</span>

如果您希望将浏览量数据赋值给一个变量,以便后续进行更复杂的处理(例如,配合JavaScript实现动态效果或格式转换),您可以这样做:

{% archiveDetail articleViews with name="Views" %}
<span>阅读量:{{articleViews}}</span>

为了让显示效果更自然,您可以结合其他内容元数据一起展示,例如:

<article>
    <h1>{% archiveDetail with name="Title" %}</h1>
    <div>
        <span>发布日期:{% archiveDetail with name="CreatedTime" format="2006-01-02" %}</span>
        <span>浏览量:{% archiveDetail with name="Views" %} 次</span>
    </div>
    {# 其他文章内容 #}
    <div>
        {%- archiveDetail articleContent with name="Content" %}
        {{articleContent|safe}}
    </div>
</article>

这段代码片段展示了如何在文章标题下方,与发布日期一起显示浏览量,并附带了“次”这个单位,让信息表达更完整。

在列表页中显示浏览量

除了详情页,您可能还希望在文章列表、产品列表、相关推荐列表等页面上,直接显示每项内容的浏览量。这样,用户在浏览列表时就能一目了然地知道哪些内容更受欢迎。

在安企CMS中,当您使用archiveList标签循环输出文章或产品列表时,每一项内容的数据都会被封装在一个名为item的变量中。此时,您可以通过访问item.Views来获取当前列表项的浏览量。

例如,在一个典型的文章列表中,您可以这样来显示每篇文章的浏览量:

<div>
{% archiveList archives with type="page" limit="10" %}
    {% for item in archives %}
    <li>
        <a href="{{item.Link}}">
            <h5>{{item.Title}}</h5>
            <div>{{item.Description}}</div>
            <div>
                <span>{% categoryDetail with name="Title" id=item.CategoryId %}</span>
                <span>{{stampToDate(item.CreatedTime, "2006-01-02")}}</span>
                <span>{{item.Views}} 阅读</span>
            </div>
        </a>
        {% if item.Thumb %}
        <a href="{{item.Link}}">
            <img alt="{{item.Title}}" src="{{item.Thumb}}">
        </a>
        {% endif %}
    </li>
    {% empty %}
    <li>
        当前列表没有任何内容
    </li>
    {% endfor %}
{% endarchiveList %}
</div>

在这个例子中,{{item.Views}}被放置在文章的元信息区域,与分类和发布时间并列,并加上了“阅读”二字,清晰地传达了该文章的受欢迎程度。无论是文章列表、Tag列表(使用tagDataList)还是其他基于archiveList获取的列表,这种item.Views的调用方式都是通用的。

一些实用小建议

  • 添加单位和修饰: 在显示浏览量时,加上“次浏览”、“阅读量”、“人气”等文字单位或图标,能让数据更具可读性和吸引力。
  • 样式优化: 利用CSS对浏览量数字进行美化,比如加粗、改变颜色或字体大小,使其在页面中更显眼。
  • 放置位置: 浏览量通常放置在内容标题附近、发布日期或作者信息旁边,这些位置能有效吸引用户视线,同时保持页面布局的协调性。
  • 数据统计: 安企CMS内置的流量统计功能会实时更新浏览量,您无需额外配置,确保了数据的及时性和准确性。

要将这些信息呈现在您的网站上,过程其实非常直接。您需要做的就是找到对应文章或产品详情页以及列表页的模板文件(通常在/template目录下您所使用的模板文件夹内),然后将上述代码片段插入到合适的位置。保存文件并刷新页面,您就能看到浏览量数据清晰地展现在眼前。

通过这些简单的步骤,您就可以让网站的内容数据活起来,为用户提供更丰富、更有价值的浏览体验。


常见问题 (FAQ)

Q1: 文章或产品的浏览量多久更新一次? A1: 安企CMS的浏览量统计是实时更新的。每次有用户访问文章或产品页面,系统都会即时记录并更新浏览量数据,确保您前端展示的数据是最新的。

Q2: 我可以自定义浏览量的显示格式吗?比如把“12000”显示成“1.2万”? A2: 安企CMS的模板标签直接输出的是原始数字。如果您需要将“12000”显示成“1.2万”这样的格式,可以通过一些前端JavaScript代码来实现。例如,您可以编写一个简单的JS函数来检测数字大小,并根据规则进行格式化,然后动态地更新页面上的浏览量显示。

Q3: 安企CMS统计的浏览量是否包含机器人(爬虫)访问? A3: 安企CMS在设计流量统计功能时,会尝试进行基础的机器人和爬虫过滤,以尽可能地统计真实用户的访问。然而,由于网络环境复杂,新型爬虫层出不穷,我们无法保证100%过滤掉所有非人类访问。但通常情况下,它能提供一个相对准确的用户访问量参考。