When using AnQiCMS for website content management and template development, we often encounter scenarios where we need to clean up or adjust the HTML structure of the content.removetagsThe filter is a very practical tool, but many users are concerned about how it works specifically, especially whether it will remove the content inside the tag along with the tag when removing labels.

This article will delve deeply into the AnQiCMS template engine.removetagsFilter behavior, and help everyone clearly understand its function through examples.

removetagsFilter: Precisely remove specified tags

Firstly, it is clear that the AnQiCMS template engine'sremovetagsfilter removes tags andwill notRemove the content inside the label.Its design purpose is to provide a 'scalpel-like' precise control, which only targets the specified HTML tag itself for removal operation, while the text wrapped by the tag or other HTML elements are preserved.

which means that if you have a segment of HTML text, such as<strong><i>你好，AnQiCMS！</i></strong>，and decided to useremovetagsFilter out the<i>tags, then the final output will be<strong>你好，AnQiCMS！</strong>. Look, <i>The label has been removed, but the text "你好，AnQiCMS！"it contains is still perfectly intact and remains under the label.<strong>enclosure.

The advantage of this way of working is that it allows you to flexibly adjust the presentation of content or remove unnecessary style tags without losing any actual text information. For example, when content is imported from other platforms, it may contain styles that do not match your website's style.fontLabel or irregularspanthen,removetagsIt can be put to use, quickly clearing these 'junk' tags for you without affecting the core content.

How to useremovetagsFilter

removetagsThe usage of the filter is very intuitive, its basic syntax is:

{{ 变量 | removetags:"标签名1,标签名2,..." | safe }}

Among them:

  • 变量It is the HTML string that you want to process.
  • 标签名1,标签名2,...It is the name of one or more HTML tags that you want to remove, separated by English commas,Split. Please note that only the label name needs to be written, not the angle brackets.
  • | safe: This is crucial. BecauseremovetagsThe filter processes HTML content and expects the final output to still be parsed as HTML, so it is necessary to add it at the end of the filter chain.| safeFilter. Otherwise, the processed HTML code may be automatically escaped by the template engine and displayed as plain text on the page instead of being rendered by the browser.

Example: Remove specific tags

Suppose you have a section of content from the article detailsarticleContentwhich may include<b>(bold) and<u>(underline) tags, and you want to remove them to unify the style:

{# 假设 articleContent 的值为 "这是一段<b>重要的<u>文本</u></b>内容。" #}
{{ articleContent | removetags:"b,u" | safe }}

The code will output:这是一段重要的文本内容。

removetagsWithstriptagsdifferences

In the AnQiCMS template filter, there is also a function similar but different in behaviorstriptagsFilter. Understanding the difference between the two will help you choose the most suitable tool:

  • striptagsFilterThe term 'strip' means to strip away.striptagsIt aims to strip away the contents of the string.allHTML tag, does not differentiate between types. Its goal is to obtain plain text content and remove any HTML structure.
    • For example:{{ "这是一段<b>重要的<u>文本</u></b>内容。" | striptags | safe }}It will output这是一段重要的文本内容。
  • removetagsFilterThen provide finer control, you can explicitly specify which to removespecifictags, while retaining other tags.

In short, when you need to extract plain text from HTML content, usestriptagsWhen you need to selectively remove certain specific tags while retaining most of the HTML structure and text,removetagsIt is the more suitable choice.

Use suggestions

  1. Always use|safe:As mentioned earlier,removetagsThe output of the filter is expected to be HTML, be sure to add it after|safeThe filter to prevent the content from being automatically escaped.
  2. Remove tags cautiously:Althoughremovetagsvery useful, but still need to consider the potential impact when removing tags. For example, removing<h1>/<h2>The title tag may affect the semantic structure of the content, thereby affecting search engine optimization (SEO). For<a>Link label, removing it will only retain the link text, but the hyperlink function will be lost.
  3. Specify precisely:Only the tags you list will be removed. If the tag has attributes, for example<div class="some-class">,removetags:"div"will also remove the entiredivelement (including its attributes), only retaining its content.

PassremovetagsFilter, AnQiCMS provides a powerful and flexible tool for content operators and template developers, helping us manage and present website content more effectively, ensuring users get an** excellent** reading experience.

Common Questions (FAQ)

1.removetagscan be removed<script>Label? Will the JavaScript code remain after removing it?Yes,removetagscan be removed<script>Label. Will it remain after removal?<script>The JavaScript code within the tag will be preserved as the content of the tag, but since<script>The tag itself is removed, the browser will not execute these JavaScript codes. If you need to completely remove the script content and its functionality,removetagsit is valid.

2.removetagsDoes it support removing tags with specific attributes? For example, only remove tags with specific attributes?class="danger"ofdivTags? removetagsThe filter matches and removes based on the tag name, and it does not provide matching and removal based on tag attributes (such asclass/id/styleThe function to conditionally remove based on the specified criteria. When you specify to removedivtags, alldivLabels will be removed regardless of whether they have specific attributes.If you need more complex condition filtering, it may be necessary to process it before the content is stored, or to dynamically handle it on the front end using JavaScript.

3. After removing the tags, if there are any whitespace characters (such as newline characters, spaces) between the original two tags, how will these whitespace characters be handled? removetagsThe filter will retain all characters between tags after removing them, including whitespace characters, newline characters, and so on. For example,<div> 内容A </div><div> 内容B </div>after removingdivtags, it may become内容A 内容B(Depending on the number of whitespace characters in the original text). If you want to further clean up these extra whitespace characters, you can consider using such asremovetagsafter that, and combine with such astrimFilter or custom string replacement logic.