When using AnQiCMS to build a website, we often need to handle the display of various text content.How to make the text from article details to product descriptions both beautiful and easy to read, while also being able to correctly parse the formats they contain, is a very important detail in content operation.Today, let's talk about two very practical template filters -wordwrapandsafeand how they work together.
UnderstandingwordwrapFilter: Smart line break of text.
wordwrapThe filter, as the name implies, mainly helps us to automatically wrap long text.Imagine if a long piece of content on your page, such as a line of URL without spaces or a long foreign word, goes beyond the container boundary and affects the overall layout of the page.wordwrapYou can set a character length. When the text reaches this length, it will wrap at the nearest space.If it encounters continuous Chinese characters or other characters without spaces, it will treat this long string as a 'word' and will not easily break it up.This is very helpful for improving the readability of long text and avoiding layout errors.It is also very intuitive to use, for example{{ content|wordwrap:20 }}It can display up to 20 characters per line.
UnderstandingsafeFilter: Ensure HTML content is parsed correctly
AndsafeThe filter plays different roles, but is equally important. In the AnQiCMS template, for security reasons, the system defaults to escaping all HTML tags and JavaScript code in the output content, such as<script>Will be displayed<script>This is a good practice to prevent cross-site scripting attacks (XSS).However, when we want to display content that already includes HTML formatting, such as the body text of an article edited through a rich text editor, or a description obtained from an API with HTML tags, if it is not processed, these HTML tags will be displayed as is, rather than being parsed by the browser. At this point,safeThe filter comes into play. By adding it after the variable|safeWe can tell the template engine that this content is 'safe', and it can be output directly as HTML. For example{{ article.Content|safe }}Of course, it should be particularly reminded that once usedsafeThis means you are responsible for the source and security of the content, ensuring that it does not contain malicious code.
wordwrapwithsafeCollaborative work: balancing layout and parsing
Then,wordwrapFilters can be andsafeDo filters work together? The answer is yes, and in many practical scenarios, they work even better when used together.Imagine you have an article content containing HTML tags, where some paragraphs or list items may be poorly formatted on the page due to the inclusion of particularly long words or URLs.You want this content to be correctly parsed as HTML and automatically wrapped in line breaks where appropriate.
In this case, you should use firstwordwrapa filter to handle the line breaks in the text, then usesafeA filter to ensure that HTML tags are rendered correctly. For example, the documentation of AnQiCMS provides a very clear example:
{{ "Lorem ipsum dolor sit amet, consectetur adipisici elit."|wordwrap:2|linebreaksbr|safe }}
This example cleverly demonstrates the chained use of filters: first,wordwrap:2Try to break long text into lines every 2 characters (although the effect is not obvious here because English words do not have spaces, the principle is the same); next,linebreaksbrConvert the newline characters after processing to<br/>tags; finally,safeEnsure that the entire output HTML structure is parsed and displayed correctly by the browser, rather than being escaped.
The logic of doing this is:wordwrapIt is a text processing filter that changes the structure of the string itself, such as inserting line breaks. AndsafeIt is an HTML parsing control filter that determines how the template engine treats the HTML content in the string.Only by completing the text structure processing first, and then informing the template engine how to parse, can we achieve the effect we expect.If a newline character is encountered in the content being processed,wordwrapor `line