When building a website, we often need to process various text content displayed on the page, such as limiting the length of article abstracts, unifying the case format of user input, or ensuring that the content submitted by users can be safely displayed on the page without damaging the page structure.The template filter feature provided by AnQiCMS (AnQiCMS) offers powerful capabilities to efficiently and conveniently complete these tasks.
The filter is a very practical tool in the AnQi CMS template, which can help us quickly process and format the data displayed on the page. Its usage is very intuitive, usually by adding a pipe symbol after the variable name|Then follow the name of the filter and optional parameters. For example,{{ 变量名|过滤器名称:参数 }}Now, let's take a detailed look at several commonly used text processing filters.
Text truncation: Make long content more concise
In website operation, we often need to display the abstract of multiple contents on a single page, such as article lists or product descriptions.This is an example of content that is too long. It not only affects the appearance of the page but also reduces the efficiency of user browsing.The text truncation filter of AnQi CMS can help us easily solve this problem.
Firstly,truncatecharsThe filter can truncate text based on the specified number of characters. It counts from the beginning of the text and truncates it after reaching the specified number of characters, adding an ellipsis at the end....)。For example, if we have a text such as 'AnQi CMS is an enterprise-level content management system based on the Go programming language, dedicated to providing efficient, customizable, and easy-to-expand content management solutions.'{{ item.Description|truncatechars:15 }}。Output will be 'AnQi CMS is a Go-based...'。Note that,truncatecharsWhen truncating, word integrity will not be considered, and it may result in half a word being truncated.
Withtruncatecharsis similar,truncatewordsThe filter truncates text based on the number of words. It counts the number of words in the text and truncates to the specified number of words, adding an ellipsis at the end. For example,{{ item.Description|truncatewords:5 }}It may output "SafeCMS is a Go language-based..." This filter is more suitable for English content as it better maintains word integrity.
When dealing with rich text content that includes HTML tags, directly usingtruncatecharsortruncatewordsIt may destroy the HTML structure, causing the page to display abnormally. To avoid this, Safe CMS provides a specialtruncatechars_htmlandtruncatewords_htmlFilter.These filters will intelligently close HTML tags while truncating text, ensuring that the truncated HTML content remains valid.This is very useful for displaying article summaries or user comments and other rich text content, which can avoid page chaos caused by truncation.
case conversion: normalize text format
In some scenarios, we need to standardize the case format of text, such as converting the user's input to the first letter capitalized, or converting the title to uppercase to emphasize.The case conversion filter of AnQi CMS can meet these requirements.
upperThe filter can convert all English characters in the text to uppercase. For example,{{ item.Title|upper }}The content of 'anqicms template' will be converted to 'ANQICMS TEMPLATE'.
On the contrary,lowerThe filter can convert all English characters to lowercase.{{ item.Title|lower }}The 'ANQICMS TEMPLATE' will be converted to 'anqicms template'.
If we only need to capitalize the first letter of a string, we can usecapfirsta filter. For example,{{ item.Introduction|capfirst }}It will convert “anqicms is committed to providing” to “Anqicms is committed to providing”.
whiletitleThe filter is more suitable for title-like content, which will capitalize the first letter of each word in the text.{{ item.Name|title }}It will convert 'anqicms is awesome' to 'Anqicms Is Awesome'.These filters help us maintain the consistency and professionalism of text formatting when dealing with multilingual content, especially English content.
HTML escaping and unescaping: Ensuring content safety and display effects
In web development, security is a very important consideration when handling user input content.To prevent cross-site scripting attacks (XSS), AnQiCMS defaults to escaping variables output in templates.</>/&等特殊字符,它们会被自动转换为 HTML 实体(如</>/&),从而避免浏览器将其解析为实际的 HTML 标签或脚本。
Most of the time, we don't need to explicitly useescapeorea filter, because AnQiCMS has already handled it by default. However, if we areautoescape offin the environment, or you need to explicitly escape a variable, you can useescapeor its abbreviationeFor example,{{ "<script>alert('xss');</script>"|e }}will convert malicious scripts into harmless text format for display.
But sometimes, we need to display on the page content generated by a rich text editor, which includes HTML tags, and we want these HTML tags to be normally parsed and rendered by the browser with styles, rather than being displayed as source code directly. In this case, we need to usesafeFilter.safeThe filter tells AnQiCMS that the content of this variable is safe and does not require HTML escaping, and can be output directly as raw HTML. For example,item.Contentthe variable contains<p>这是<b>加粗</b>的文字</p>,directly{{ item.Content }}would display the source code due to default escaping, but by using{{ item.Content|safe }}the page will display the styled text normally.
It is worth emphasizing that usingsafeFilter with caution.Only use when you completely trust the content source and are sure that it does not contain any malicious code to prevent potential security risks.autoescapeTags, through{% autoescape on %}or{% autoescape off %}to enable or disable automatic escaping.
Useful Tips and Considerations
The filter function of AnQi CMS is very flexible, we can connect multiple filters together to form a processing chain. For example, to convert a piece of text to lowercase first, and then truncate it to a specified number of characters, it can be written as follows:{{ item.Title|lower|truncatechars:20 }}The filter will execute in the order from left to right.
It is very important to understand whether the filters accept parameters (such as truncation length, case conversion type, etc.) when using them. Parameters are usually passed through colons:Connected after the filter name. At the same time, we also need to understand the type of the variable itself to ensure the correct use of the filter and avoid unnecessary errors.
These template filters greatly enhance the ability of AnQi CMS template to process data, making content operation and website development more efficient.By flexibly using them, we can better control the way content is presented, enhance user experience, and ensure website security.
Common Questions (FAQ)
问:Why is the HTML content, such as images or links added through a rich text editor, displayed as code directly in the template instead of the normal style? Answer:This is usually because the security CMS performs HTML encoding on all output variables by default for security reasons,
<special characters to<auto,导致浏览器将其识别为纯文本。如果您确定这些 HTML 内容是安全的,并且希望它们能正常渲染,请在该变量后加上|safeFilter, for example{{ item.Content|safe }}.auto问:我使用
truncatecharsFilter truncated a piece of text, but found HTML tags were damaged, resulting in a chaotic page display. How to solve it? Answer:When you need to truncate rich text content containing HTML tags, you should not usetruncatecharsortruncatewords. Please usetruncatechars_htmlortruncatewords_htmlFilter. These two filters will intelligently handle HTML tags, ensuring the correct closure of tags during truncation to avoid destroying the page structure.问:Can I use multiple filters on a single variable at the same time? What is the execution order of them? Answer:Yes, AutoCMS supports using multiple filters for the same variable, separated by the pipe character.
|The execution order of filters is from left to right. For example,{{ item.Title|lower|truncatechars:10 }}Will first convert the title to lowercase and then truncate it to 10 characters.