How to safely remove all or part of specified tags from HTML content in AnQiCMS templates?

When using AnQiCMS to build a website, we often need to finely control the content displayed on the page.Especially when dealing with user submitted content, articles imported from different sources, or simply to maintain consistency in page style, you may encounter the hassle of HTML tags.These tags may contain unnecessary formatting, styles, or even potential security risks.It is fortunate that AnQiCMS template system provides a flexible mechanism to help us safely and efficiently remove all or part of the specified tags from the HTML content.

Why is it necessary to remove HTML tags?

In content management, the need to remove HTML tags is diverse:

• Uniform content display:for example, we may want to display plain text summaries in the article list instead of HTML paragraphs with complex styles, or we may want to standardize the title style, removing any potentially included content in the article<h1>to<h6>Title label.
• Enhance user experience:Removing unnecessary tags can make page loading faster and reduce layout issues caused by external style conflicts.
• Enhance content security:Although AnQiCMS defaults to HTML-escaping content to prevent common cross-site scripting (XSS) attacks, manually removing certain potentially dangerous tags can still provide additional security in some scenarios where raw content needs to be output directly.
• Adapt to different scenarios:The same content may need to be presented in different forms in different template sections, for example, in the article detail page, you need complete rich text content, while in the sidebar recommendation module, you only need plain text title and abstract.

AnQiCMS template system, its syntax is similar to Django template engine, which provides several powerful filters (Filters) to achieve this goal, among which the most commonly used isremovetagsandstriptags.

Precise打击：Remove specified tag (removetags)

When we need to selectively remove specific tags from HTML content while retaining other tags and text,removetagsThe filter can be used. This filter allows us to list the tag names to be removed, separated by commas.

For example, suppose we have a piece of content<strong><i>你好！</i>这是一个<p>段落</p></strong>. We might want to remove the italic<i>tags but keep the bold<strong>and paragraphs<p>Tag.

We can use it like thisremovetagsFilter:

{{ "<strong><i>你好！</i>这是一个<p>段落</p></strong>"|removetags:"i"|safe }}

here|removetags:"i"Indicate the template engine to remove all<i>tags and their content. The final output will be:

<strong>你好！这是一个<p>段落</p></strong>

If we need to remove multiple tags, just list them separated by commas:

{{ "<strong><i>你好！</i>这是一个<p>段落</p></strong>"|removetags:"i,p"|safe }}

This will remove<i>and<p>Label, output:

<strong>你好！这是一个段落</strong>

It should be noted that,removetagsIt will remove the entire tag, including its content. If you only want to remove the tag while keeping the text within it, you will need a more complex processing, which is beyondremovetagsThe direct function of the filter.

Comprehensive cleaning: Remove all tags (striptags)

Sometimes, our goal is to obtain completely pure text content without any HTML tags. At this time,striptagsThe filter is a good choice. It removes all HTML tags from the content, including their attributes, leaving only plain text.

Keep using the above example, if we want to get<strong><i>你好！</i>这是一个<p>段落</p></strong>the plain text content:

{{ "<strong><i>你好！</i>这是一个<p>段落</p></strong>"|striptags|safe }}

by applyingstriptagsthe filter, all tags will be removed, the output will be:

你好！这是一个段落

striptagsIt is a very convenient tool, especially suitable for displaying article summaries, descriptions, or any place that only requires plain text.

About|safeImportant notes on the filter

When usingremovetagsorstriptagsThe filter may notice that a sample code is often followed by|safeFilter.This is because AnQiCMS's template system defaults to escaping all output content to prevent XSS attacks.|safe, even if you remove some tags, the remaining HTML structure (such as<strong>) will also be escaped into<strong>Display on the page rather than being interpreted by the browser as bold text.

For example:

{# 移除 i 标签，但不使用 |safe #}
{{ "<strong><i>你好！</i>这是一个<p>段落</p></strong>"|removetags:"i" }}

The output will be:

<strong>你好！这是一个<p>段落</p></strong>

In order to pass throughremovetagsorstriptagsProcessed HTML content (if anyremovetagsThe HTML left) can be normally parsed by the browser, we need to explicitly tell the template engine that this content is 'safe' and does not need to be escaped, and that's when it comes into play|safeFilter.

Therefore, when you want the remaining HTML structure to render normally after removing a specific tag, be sure to add it to the end of the filter chain|safe.

Actual application scenario

These filters are widely used in the AnQiCMS template, especially in displaying document content (archive.Content), document description (archive.Description), or custom fields.

We need to display article summaries on a list page and do not want any HTML tags in the summaries:

{% archiveList archives with type="list" limit="10" %}
    {% for item in archives %}
        <div class="article-item">
            <h3><a href="{{item.Link}}">{{item.Title}}</a></h3>
            <p>{{item.Description|striptags}}</p> {# 摘要只显示纯文本 #}
        </div>
    {% endfor %}
{% endarchiveList %}

If our article content uses the Markdown editor and renders it to HTML (for examplearchive.Content|render:true), then these tags removal filter can also be applied to the rendered HTML content for further refined control.

Summary

AnQiCMS template in theremovetagsandstriptagsThe filter provides us with powerful content control capabilities.Whether it is necessary to completely remove all HTML tags to obtain plain text, or selectively remove specific tags to standardize content display, these filters are very practical tools.|safeFilter, we can ensure that the content is both secure and rendered as expected.It is recommended to always conduct thorough testing when using these tools to ensure that the content display meets the design and functional requirements of the website.

---

Common Questions (FAQ)

1.removetagsandstriptagsWhat are the differences between filters?

striptagsThe filter will remove all HTML tags from the HTML content and only keep plain text. For example,"<b>Hello</b> World"|striptagsIt will output"Hello World". WhileremovetagsThe filter allows you to specify one or more HTML tag names, removing only these specific tags while retaining the other tags and their content. For example,"<b>Hello</b> <i>World</i>"|removetags:"i"It will output"<b>Hello</b> World".

2. Why do I need to addremovetagsorstriptagsafter|safea filter?

AnQiCMS template system is designed to prevent cross-site scripting (XSS) attacks by default, which will escape all output variable content. This means that HTML tags will be converted to<and>Entities characters, rather than being parsed by the browser. When you useremovetagsorstriptagsafter, if you want the remaining HTML content (such asremovetagsthat may be retained after<strong>Labels can be parsed by the browser normally instead of displaying the raw HTML code, you need to use|safeThe filter explicitly tells the template engine that this content is safe and does not need to be escaped. If your goal is plain text,striptagsthen add|safeFiltering is a good habit, although it may not change the final visual effect for plain text output, it makes the process clearer.

**3.removetagsIs the filter