In the template development of Anqi CMS, we often encounter the need to process content output by rich text editors. This content usually contains various HTML tags, such as those used for emphasizing<strong>used for italicized<i>or something like<em>/<span>/<div>Wait. Although these tags are given rich styles during editing, in certain specific display scenarios, we may need to remove some of them to ensure the uniformity of the page style or to achieve a specific display effect.

The Anqi CMS template system has a syntax design very similar to the Django template engine, providing powerful filter functions to handle such needs. When the content contains HTML tags and needs to be displayed correctly on the front-end page, we usually use|safeA filter tells the template engine that this content is safe and does not require HTML entity escaping, so the browser renders it as normal HTML code.But if our goal is to remove certain specific HTML tags, we need to introduce another powerful tool.

UnderstandingremovetagsFilter: A Precision Removal Tool

AnQi CMS providesremovetagsA filter that can accurately remove all specified HTML tags from the content.This is particularly useful for maintaining the neatness and consistency of the page layout, or when certain tags (such as inappropriate tags entered by users) may destroy the page structure.

removetagsThe basic usage of a filter is:

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

For example, suppose we have a piece of article content stored inarchive.Contenta variable, and this content may contain<i>and<strong>Tags, but we want to remove them when displaying and keep other such as<p>or<a>tags. We can use them like thisremovetagsFilter:

<div>
    {{ archive.Content | removetags:"i,strong" | safe }}
</div>

This code will traversearchive.Contentall HTML tags in it, and all<i>and<strong>The tag itself is removed, but the text inside these tags is retained. Then,|safeThe filter ensures that the processed content can be rendered as HTML by the browser. Please note that if you need to remove multiple tags, just use English commas to separate the tag names.,Separate them.

You can remove any standard HTML tags, such as:

  • Remove italics and emphasis:removetags:"i,em,strong"
  • Remove generic containers:removetags:"span,div"
  • Remove images and links (if you do not want them to appear):removetags:"img,a"

In this way, you can flexibly control which HTML tags can be displayed and which should be cleaned up.

striptagsFilter: Another option for a thorough cleaning

exceptremovetags, Anqi CMS also providesstriptagsFilter. It isremovetagsThe difference lies in,striptagsIt will remove content inallHTML tags (including XML and PHP tags), retaining only plain text content.

striptagsThe basic usage of a filter is:

{{ 内容变量 | striptags | safe }}

For example, ifarchive.DescriptionThe field may contain HTML, but we only want to display plain text summaries, then we can use: 

<p>
    {{ archive.Description | striptags | safe }}
</p>

striptagsIt is suitable for the scenario where it is necessary to completely remove all formatting and only obtain the original text. However, if your goal is to selectively retain some HTML tags and simply remove others, thenremovetagsIt will be a more precise and suitable choice.

Some considerations in practical application.

There are some important details to note when applying these filters in the template:

  • The order of the filter chain is crucial:Make sure toremovetagsorstriptagsFilter is on|safeApplied first. If|safeThe filter is executed first, the HTML tags in the content will be recognized as real HTML elements by the browser, thenremovetagsCannot perform operations on it anymore. The correct order is to process the HTML structure first, and then mark it as safe output.

  • Case of tag name:Although HTML tags are typically case-insensitive, it is recommended to use lowercase tag names in the filter to ensure compatibility and avoid potential issues.removetagsUse lowercase tag names consistently in the filter.

  • Security and content source:Removing tags can help you control page styles, but it cannot completely replace the security review of user input content.If your content comes from an unreliable external source, even if you remove specific tags, you should continue to be vigilant about potential cross-site scripting (XSS) attack risks.In some cases, it may be necessary to combine other security measures or to filter the content source more strictly.

By flexible applicationremovetagsandstriptagsThese filters allow you to better control the display of content in the Anqi CMS template, making your website more unified and professional while maintaining rich content.

Frequently Asked Questions (FAQ)

  1. Q: Remove<i>or<strong>After the tag is removed, will the style of the content text (such as italic, bold) be retained?A: No.removetagsThe filter will remove the tag itself, which means that the styles associated with these tags (such as <i>The italic, brought<strong>The bold) will no longer be displayed. However, the text content within the tags will be retained intact.

  2. Q: If I want to remove HTML tags but not use|safea filter, is that possible?A: Yes. If you don't use|safeThe filter, the template engine will default to escaping HTML entities in the content.This means that all HTML tags (including the ones you want to retain) will be displayed as plain text, rather than as renderable HTML elements.When dealing with rich text content, it is usually necessary|safeCan it render the allowed HTML tags correctly.

  3. Q:removetagsCan you remove HTML tags with attributes? For example.<a href="link.html">?A: Yes,removetagsThe filter is based on tag name matching and removal, regardless of whether the tag contains attributes, as long as the tag name matches, the entire tag (including all its attributes) and its internal text content will be processed. If you specify removalaTags, then<a href="link.html">文本</a>Will only remain文本.