In the presentation of website content, the formatting of text is often the key to user reading experience. We often encounter such needs: the text content obtained from the background database usually only contains simple newline characters (\n),if displayed directly on the web page, the browser will not intelligently convert these line breaks to the HTML paragraphs we expect (<p>) or line breaks (<br>English label, causing the content to be squeezed together and lose the original structure and readability.

AutoCMS (AutoCMS) fully considers this point in template design, it provides a series of convenient built-in filters that can help us easily convert newline characters in plain text to standard HTML tags, ensuring that the content is presented naturally and beautifully on the front-end page.These filters are like intelligent formatting tools, which can easily solve complex text layout problems.

Core mechanism: Understanding the text processing filter of AnQiCMS.

The template engine of AnQi CMS adopts syntax similar to Django, one of its core advantages being the flexible "filter" function.The filter allows us to modify and format the output content of variables.linebreaksandlinebreaksbrThese two filters, each is suitable for different text formatting needs.

1.linebreaksFilter: Smart Segmentation and Inline Wrapping

When processing articles, long descriptions, or comments, we expect them to be automatically paragraphed on the web, just like traditional text, and for line breaks within paragraphs to be preserved.linebreaksThe filter is an ideal choice.

linebreaksThe working principle is as follows:

  • contains two consecutive newline characters\n\n)Convert to HTML paragraph tags<p>...</p>.This means that in the original text, if you create an empty line by pressing the Enter key twice,linebreaksIt will recognize it as a new paragraph.
  • Will convert the single newline character (\n) to an HTML line break tag<br>.If you press the Enter key once within a paragraph, you hope that the content will continue on the next line, but you do not want to start a new paragraph.linebreaksit will add a<br>Label.

For example, suppose the background passes in text contentitem.descriptionAs follows:

这是一段产品描述。
产品特点一。
产品特点二。

这是另外一段说明。
请注意相关事项。

In the template, you can use it like this:linebreaksFilter to output:

{{ item.description|linebreaks|safe }}

Here,|safeFilter is crucial. Because it tells the template engine,linebreaksThe processed content is safe HTML and does not require default HTML entity escaping (such as converting<p>Escaped into&lt;p&gt;),thus ensuring that the browser can correctly parse and render these HTML tags.

After such processing, the final HTML structure rendered on the web page will be: “`html”}]

This is a product description.
Feature one of the product.