When using AnQiCMS for website content management, we often encounter situations where we need to make some minor adjustments to the displayed content, such as when the title of an article is too long and we want it to display only a part with an ellipsis at the end; or when we want some text to be displayed in uppercase or lowercase uniformly.AnQiCMS powerful template filter function can easily meet these needs without modifying any backend code, and can be completed directly at the template level.

Template filters are a practical tool in AnQiCMS template language, allowing us to transform, format, or process the value of template variables and then output them to the page. The usage is very intuitive, usually by adding a pipe symbol after the variable.|），再跟上过滤器的名称，如果过滤器需要参数，则在过滤器名称后面使用冒号（English）:）传递。例如，{{ 变量名 | 过滤器名称 : 参数 }}.

内容的截断处理

In many cases, we may need to truncate long text content to maintain the neatness of the page layout or to provide a brief introduction.AnQiCMS provides several convenient filters to handle the truncation of strings and HTML content.

If we are dealing with plain text, we can usetruncatecharsortruncatewordsFilter.truncatecharsThe string will be truncated based on the number of characters, and an ellipsis will be added at the end. For example, you have an article title{{ item.Title }}English translation: Hope it displays no more than 15 characters, it can be written like this: {{ item.Title | truncatechars:15 }}This will truncate the title to a maximum of 15 characters (including an ellipsis), if the original title is less than 15 characters, it will not change.

whiletruncatewordsThen it is truncated by word count. If you want the title to display a maximum of 5 words, you can do it like this:{{ item.Title | truncatewords:5 }}This filter ensures that truncation occurs at word boundaries and an ellipsis is added at the end.

If our content contains HTML tags and we want to truncate without destroying the HTML structure, AnQiCMS also provides the corresponding HTML safe truncation filter:truncatechars_htmlandtruncatewords_html.They are similar to plain text truncation filters, but they intelligently handle HTML tags to ensure that the truncated HTML code is still valid.{{ item.Description | truncatechars_html:50 | safe }}Here are thesafeThe filter is very important, it tells the template engine that this output is safe HTML, which does not need to be escaped, so that the browser can correctly parse the truncated HTML.

The case conversion of strings

The unified display format is crucial for enhancing user experience and website professionalism. AnQiCMS's filter can help us easily achieve case conversion.

The most direct case conversion isupperandlower.upperIt will convert all the English letters in the string to uppercase:{{ item.Title | upper }}whilelowerIt will convert all the English letters to lowercase:{{ item.Title | lower }}

In addition to converting everything, sometimes we only need to capitalize the first letter of a string, in which case we can usecapfirst. It will only capitalize the first letter of the string and keep the rest unchanged:{{ "hello world" | capfirst }}it will be displayed asHello world.

If you want the first letter of each word in a string to be capitalized and the rest to be lowercase,titlethe filter will be your good helper:{{ "anqicms is a great cms" | title }}it will be displayed asAnqicms Is A Great Cms. This is very useful for formatting article titles or names.

Other commonly used string processing techniques

In addition to truncation and case conversion, AnQiCMS also provides a series of practical string processing filters that can meet our diverse content operation needs.

  • Remove characters (cut)：If you want to remove a specific character or substring from a string,cutthe filter can do that. For example, to removeAnQiCMSthei，it can be written as{{ "AnQiCMS" | cut:"i" }}，the result isAnQCMS.
  • replace character (replace)When you need to replace a part of a string with another part,replacethe filter comes in handy. The syntax is{{ obj | replace:"旧内容,新内容" }}For example,{{ "Hello World" | replace:"World,AnQiCMS" }}It will outputHello AnQiCMS.
  • remove spaces (trim,trimLeft,trimRight)These filters are used to remove spaces or specified characters from the beginning and end, or the left or right side of a string.{{ " AnQiCMS " | trim }}Will becomeAnQiCMS.
  • Concatenation and Splitting (join,split):splitYou can split a string into an array by delimiter,joinThen you can concatenate the array into a string with a separator. This is very convenient when dealing with list data such as tags, keywords, etc. For example,{% set tags = "tag1,tag2,tag3" | split:"," %}You can convert a string into an array, and then{% for tag in tags %}{{ tag }}{% endfor %}output in a loop.
  • Get length (length): When you need to know how many elements a string, array, or object has,lengththe filter can quickly provide the answer.{{ item.Title | length }}it will return the number of characters in the title.

These filters can be used individually, or chained together, meaning multiple filters can be applied sequentially to a single variable, with the order of processing from left to right. For example:{{ item.Description | truncatechars:100 | lower | safe }}This will first truncate the description, then convert the truncated text to lowercase, and finally output it as safe HTML.

Master these filters, allowing us to have greater flexibility and fine control in AnQiCMS template design and content display, thus better presenting website content and enhancing user experience.

Common Questions (FAQ)

  1. 问：过滤器可以用于所有类型的变量吗？答：The filter is mainly used to process data types such as strings, numbers, arrays (or slices in Go language), maps (or maps in Go language), and so on.But, each filter has its specific application scenarios and expected input types.upper过滤器只对字符串有效，而lengthThe filter can be used for strings, arrays, or mappings. In actual use, if the input type does not meet the requirements of the filter, it may cause the filter to fail to work normally or output an empty value.
  2. 问：If I need to truncate content containing HTML without losing its style or structure, which filter should I use?答：In this case, you should usetruncatechars_htmlortruncatewords_htmlFilter.These filters will intelligently handle HTML tags, ensuring that the truncated HTML structure remains valid and that styles are not lost.|safeFilter, tells the template engine that this is a safe HTML fragment, to prevent the content from being escaped again and causing HTML tags to be displayed directly.
  3. 问：Can I apply multiple filters at the same time? What is the execution order of them?Answer: Yes, you can apply multiple filters to a variable, which is called 'chaining'.The execution order of the filter is from left to right.This means that the first filter will process the value of the original variable, and then the second filter will process the output of the first filter, and so on.{{ "HELLO WORLD" | lower | truncatechars:5 }}Will first convert the string to lowercase ("hello world"), then truncate it to 5 characters ("hello…").