In AnQiCMS template design, we often encounter situations where we need to display content but do not want to show the HTML tags included.For example, we may need to extract the plain text summary of the article, or display unformatted category descriptions on the list page.Directly outputting content that includes HTML may disrupt the page layout and even pose security risks.AnQiCMS powerful template engine provides a concise and efficient solution, helping us accurately remove HTML tags and retain only plain text information.
Understanding the "unsung heroes" behind text processing
AnQiCMS's template system borrows the syntax features of Django template engine, which includes a rich set of filters (Filters) for various variable processing, including text formatting and purification. When we talk about removing HTML tags, we will mainly use two very practical filters:striptagsandremovetags.
1.striptagsFilter: One-click clean up all HTML tags
When our goal is to completely remove all HTML, XML, and PHP tags from the content, leaving only pure text information,striptagsFilter is our first choice. It's like a professional cleaner, able to remove all tag structures from the content, leaving no trace.
The usage method is very intuitive:Suppose we have a variablearchive.ContentIt includes the full HTML content of the article. If you want to display only the plain text part of this content in the template, you can use it like this:
{{ archive.Content|striptags }}
With this simple operation,archive.Contentall of<p>,<div>,<strong>,<img>All HTML tags will be removed, leaving only the text content inside them.
Why should it be coordinated?|safeWhy should the filter be used?In AnQiCMS templates, to prevent security issues such as cross-site scripting (XSS), the template engine defaults to escaping all output content to HTML entities. This means that if your original content contains something like<or>Such special characters (even if they are not part of the tag, but text content), they may also be escaped into<or>.
striptagsFilter although it removes the tags, but if the original text already contains HTML entities (such as&representing&symbols),striptagsit will not convert it back to the original character. More importantly,striptagsProcessed plain text contains<or>Characters such as these, by default, the escaping mechanism will escape them again. To ensure that the final output is the plain text we expect and to avoid unnecessary double escaping, we usually willstriptagsThen add one later|safeFilter.|safeThe filter tells the template engine that this part of the content is safe and does not require additional HTML entity escaping processing.
Therefore, the recommended usage is:
{{ archive.Content|striptags|safe }}
So, it removes HTML tags and ensures that the final text content output is not escaped again by the template engine.
2.removetagsFilter: Precisely remove specified tags
Sometimes, we may not need to remove all HTML tags, but instead, we may want to retain certain specific tags while removing all others. In this case, removetagsThe filter comes into play. It allows us to specify one or more HTML tags to be removed.
Usage:InremovetagsAfter filtering, list the names of the tags to be removed in the form separated by commas. For example, if you want to remove<b>and<i>Tags can be written like this:
{{ archive.Description|removetags:"b,i"|safe }}
This operation will removearchive.Descriptionall of<b>and<i>Tags, but if the content contains<p>or<span>These other tags will be retained. Similarly, to avoid unnecessary escaping, it is recommended inremovetagsafter that|safeFilter.
Example of practical application scenarios
These filters are widely used in the daily content operation of AnQiCMS.
Display a concise summary on the list page:When we need to display the summary of each article on the article list page without any formatting:
<div class="article-summary">
<p>{{ item.Description|striptags|safe }}</p>
</div>
Extract a plain text introduction on the category page:If the category descriptioncategory.ContentMay contain rich text formatting, but we only want to display the plain text part at a specific location:
<h2 class="category-title">{{ category.Title }}</h2>
<div class="category-plain-text-intro">
<p>{{ category.Content|striptags|safe }}</p>
</div>
Whether it is article content, category description, single-page content, or any other custom field that may contain HTML, as long as you want to extract its plain text information, these two filters can provide strong support.
By using flexibilitystriptagsandremovetagsFilter, we can easily control the display format of page content, ensuring clarity and tidiness of information, while maintaining the overall beauty and functionality of the website.
Common Questions and Answers (FAQ)
Q1:striptagsandremovetagsWhat are the main differences between these filters?
A1: striptagsThe filter will remove all detected HTML, XML, and PHP tags from the text content, with the purpose of obtaining pure text information without any formatting.removetagsThe filter provides more refined control, removing only the HTML tags you explicitly specify, while retaining other unspecified tags. If your goal is to thoroughly cleanse the content and remove all formatting, please usestriptags；If you want to retain part of the tags, for example, only remove the script tag while retaining the paragraph tag, you should useremovetags.
Q2: I used|striptagsa filter, but why can text like this still be seen in the output text&or<such characters?
A2: striptagsThe filter is responsible for removing HTML tag structures (such as<p>/<div>) and it does not handle HTML entities (such as&/<). If the original content you have already contains these HTML entities,striptagsWill origin