在网站内容管理中,我们经常会遇到一个共同的需求:从富含格式的动态内容中,提取出纯粹的文本信息。这背后的原因多种多样,比如我们需要为搜索引擎生成简洁明了的元描述(Meta Description)、在列表页面展示不带格式的摘要,或者仅仅是为了数据分析而获取干净的纯文本内容。安企CMS作为一个灵活高效的内容管理系统,充分考虑到了这些场景,通过其强大的模板引擎和内置过滤器,为用户提供了优雅且实用的解决方案。

动态内容与HTML标签的共生

在安企CMS的后台,无论是编辑文章、产品详情、分类介绍还是单页面内容,我们通常都会使用功能丰富的富文本编辑器。这些编辑器允许我们方便地插入图片、链接、调整字体样式(如加粗、斜体)、创建列表等。在内容保存到数据库后,这些丰富多样的格式实际上都是通过HTML标签来呈现的。

当我们在网站前端的模板中通过archive.Contentcategory.Descriptionpage.Content这类变量来输出这些内容时,为了保留其原有的视觉效果,通常会配合|safe过滤器,例如{{ archive.Content|safe }}。这样做会指示模板引擎将内容作为安全的HTML直接输出,浏览器便会解析并渲染其中的HTML标签。然而,在某些特定的显示区域或数据输出场景下,这些HTML标签反而会显得多余,甚至可能破坏页面的布局或数据的纯粹性。

提取纯文本的核心工具:安企CMS内置过滤器

为了解决从动态HTML内容中移除标签的问题,安企CMS的模板引擎内置了几个非常实用的过滤器,其中最主要的是striptagsremovetags

striptags:彻底移除所有HTML标签

当您的目标是获取一段绝对纯净的文本,不希望保留任何HTML格式时,striptags过滤器是您的首选。它会遍历输入的字符串,并无情地将所有HTML标签(包括开标签和闭标签)都剔除干净,只留下标签之间的纯文本内容。

使用示例: 假设您的文章内容(archive.Content)中包含 <p>这是一段<strong>加粗</strong>的文字,还有<a href="#">一个链接</a>。</p>

如果您在模板中使用:

<p>文章纯文本内容:{{ archive.Content|striptags }}</p>

页面的输出将会是:

<p>文章纯文本内容:这是一段加粗的文字,还有一个链接。</p>

可以看到,所有的<p><strong><a>标签都被移除了。

适用场景:

  • 生成纯文本摘要:在文章列表页,您可能希望只显示文章的前几十个字的纯文本摘要。
  • SEO元描述:在页面的<head>部分,meta name="description"标签的值应为纯文本,避免搜索引擎抓取到HTML标签而影响显示效果。

removetags:精准移除指定HTML标签

striptags的“一刀切”不同,removetags过滤器提供了更精细的控制。它允许您指定一个或多个您希望移除的HTML标签,而对于您未指定的其他HTML标签,则会予以保留。

使用示例: 继续上面的例子,如果您的内容是 <p>这是一段<strong>加粗</strong>的文字,还有<a href="#">一个链接</a>。</p>

如果您只希望移除其中的链接标签<a>和段落标签<p>,但保留加粗标签<strong>,可以在模板中使用:

<p>部分HTML保留内容:{{ archive.Content|removetags:"p,a"|safe }}</p>

请注意,这里使用|safe是因为removetags处理后,可能仍有HTML标签被保留,需要浏览器解析。

页面的输出将会是:

<p>部分HTML保留内容:这是一段<strong>加粗</strong>的文字,还有一个链接。</p>

这里<a>标签被移除了,但<strong>标签得到了保留。

适用场景:

  • 内容局部格式调整:在某些展示区域,您可能希望保留某些核心的文本格式(如加粗),但移除不相关的或者可能导致布局问题的标签(如图片标签<img>或视频标签<video>)。
  • 数据清洗:在准备数据用于API输出时,可能需要移除一些特定的HTML标签以满足数据格式要求。

实际应用:让内容更符合展示要求

结合以上过滤器,我们可以在安企CMS中轻松应对各种纯文本提取需求:

  1. 在文章列表或产品展示卡片中显示纯文本摘要: 在首页或分类列表页,为了保持页面的整洁和统一,通常只显示文章标题和简洁的描述。

    {% archiveList archives with type="list" limit="10" %}
        {% for item in archives %}
        <div>
            <h2><a href="{{ item.Link }}">{{ item.Title|striptags }}</a></h2>
            {# 移除所有HTML标签后,再截取前100个字符 #}
            <p>{{ item.Description|striptags|truncatechars:100 }}</p>
        </div>
        {% endfor %}
    {% endarchiveList %}
    
  2. 优化SEO元描述(Meta Description): 通过tdk标签获取的页面描述,如果源内容来自富文本编辑器,最好再进行一次striptags处理,确保输出给搜索引擎的是纯文本。

    <meta name="description" content="{% tdk seoDescription with name="Description" %}{{ seoDescription|striptags|truncatechars:150 }}">
    

    这里即便seoDescription通常已经是纯文本,多一层过滤也能规避潜在风险,并结合truncatechars控制字数。

安全与**实践

  • |safe过滤器与标签移除|safe过滤器是为了防止HTML内容被自动转义,从而让浏览器正确解析显示。当您使用striptags彻底移除所有HTML标签后,内容已变为纯文本,理论上就不再需要|safe。但如果使用removetags后仍保留了HTML标签,则可能还需要|safe来确保这些被保留的标签能被正确解析。
  • 灵活选择过滤器:根据您对最终文本格式的精确控制程度,选择striptags进行全面清理,还是removetags进行有选择性的保留。
  • 结合截断功能:在移除HTML标签后,内容长度可能依然很长。此时,结合truncatechars(按字符截断)或truncatewords(按单词截断)过滤器,可以进一步控制显示文本的长度。
  • 特殊需求:保留HTML结构并截断:值得一提的是,如果您需要在截断内容的同时保留其HTML结构(例如,截断后仍然希望加粗的文字保持加粗),安企CMS还提供了`truncatechars_