In website content management, we often encounter such situations: we painstakingly type multiple lines of text in the background editor, pressing the enter key between each line, hoping that they will maintain the same line break effect on the front page.However, after the content was published, it was found that all the line breaks had disappeared and the text was cramped together.This is because web browsers default to treating consecutive newline characters as a single space and do not automatically convert them into visually noticeable line breaks.

For friends using AnQiCMS, solving this problem is actually very simple and elegant, especially when you make use of its powerful Markdown editor features.AnQi CMS fully considers the needs of content creators and provides a variety of mechanisms to ensure that the layout of the content can be accurately displayed in front of users.

Core solution: Anqi CMS's Markdown editor

AnQi CMS is a modern content management system that supports Markdown syntax.Markdown is a lightweight markup language that allows you to write documents using a plain text format, then the system will convert it into structured HTML.This means that every newline you enter in the Markdown editor will be intelligently converted to HTML by AnQi CMS<p>tags (paragraphs) or<br/>Tags (enforce line breaks) to perfectly preserve your formatting intentions.

To enable this feature, you just need to find the "Content Settings" option in the Anqi CMS backend "Global Settings" and make sure the Markdown editor is enabled. Once enabled, when you write content in modules such as "Add Document", "Page Management", or "Document Classification" and use Markdown syntax, for example in the document'sContentField input content, when the system renders this content on the front-end, it will automatically execute the conversion from Markdown to HTML, naturally handling line breaks.

Example: How to use Markdown in document content and implement line breaks

Assuming you have entered the following content in the Markdown editor of the document content:

这是第一段文字。

这是第二段文字。

---

这是第三段文字,
这里有一个手动换行。

When AnQi CMS renders this content on the front end, it automatically converts it into a similar HTML structure:

<p>这是第一段文字。</p>
<p>这是第二段文字。</p>
<hr>
<p>这是第三段文字,<br/>这里有一个手动换行。</p>

This content will be displayed correctly on the web page with paragraphs and line breaks.

More flexible control:renderThe magic of parameters

The AnQi CMS template tags provide extremely high flexibility. Even if you have not enabled the Markdown editor globally, or in certain specific scenarios where you need to force a field to be rendered in Markdown, archiveDetail/pageDetailandtagDetailsuch as tags,ContentThe field supports a namedrenderthe parameter.

ThisrenderParameter acceptstrueorfalsetwo values:

  • render=true:Enforces the currentContentConvert the content to Markdown to HTML, even if the Markdown editor is not globally enabled on the backend.
  • render=false: Prevent the currentContentThe content of the field is converted from Markdown to HTML, even if the Markdown editor is globally enabled on the backend.

This provides great convenience for content operators, you can fine-tune the rendering control of individual content fields according to your actual needs. Please note that when content is rendered with Markdown, the output is HTML code. In order for the browser to parse it correctly rather than display it as plain text, you need to use it in conjunction with the template.|safefilter.

Example: userenderParameter control content rendering

{# 假设archive是当前文档对象 #}

{# 强制渲染Markdown内容,并确保HTML安全输出 #}
<div>
    <h3>文档内容 (强制Markdown渲染):</h3>
    {% archiveDetail articleContent with name="Content" render=true %}
    {{ articleContent|safe }}
</div>

{# 如果不想渲染Markdown,即使编辑器开启 #}
<div>
    <h3>文档内容 (不渲染Markdown):</h3>
    {% archiveDetail pureTextContent with name="Content" render=false %}
    {{ pureTextContent }} {# 这里通常不需要|safe,因为它被当作纯文本处理 #}
</div>

Fallback solution for plain text content:linebreaksandlinebreaksbrFilter

Markdown rendering is the most recommended way to handle line breaks in content.However, there are always some special cases where we may need to perform simple line breaks on plain text content, or some fields are not stored in Markdown format, but are simply multiline text.For these plain texts, AnQi CMS provides two practical filters:linebreaksbrandlinebreaks. They are equivalent to thenl2brfunction, which can convert line breaks in text to HTML.<br/>.

  • linebreaksbrFilter:This is a relatively direct conversion method. It will simply replace each newline character in the text with\n)<br/>Label. Whether you have line breaks in your text or continuous multiple line breaks, it will generate them one by one.<br/>.

  • linebreaksFilter:Compared tolinebreaksbr,linebreaksThe filter is more intelligent. It will convert single line breaks in the text into<br/>And two consecutive line breaks (i.e., blank lines) will be converted into a pair<p>A paragraph enclosed in tags. This method can generate more semantically appropriate HTML when dealing with plain text with paragraph structure.

Similarly, since these two filters output HTML tags, you need to cooperate|safewith filters to ensure that HTML is correctly parsed by the browser.

Example: uselinebreaksbrandlinebreaksFilter

Assuming some content fielddescriptionContains the following plain text:

这是一行描述。
这是第二行描述。

这是一个新的段落。

UselinebreaksbrFilter:

<div>
    <h3>描述 (linebreaksbr 转换):</h3>
    {{ description|linebreaksbr|safe }}
</div>

The output HTML will be:

<div>
    <h3>描述 (linebreaksbr 转换):</h3>
    这是一行描述。<br/>这是第二行描述。<br/><br/>这是一个新的段落。<br/>
</div>

UselinebreaksFilter:

<div>
    <h3>描述 (linebreaks 转换):</h3>
    {{ description|linebreaks|safe }}
</div>

The output HTML will be:

<div>
    <h3>描述 (linebreaks 转换):</h3>
    <p>这是一行描述。<br/>这是第二行描述。</p><p>这是一个新的段落。</p>
</div>

Summary and suggestions

In AnQi CMS, handling the line break conversion from Markdown to HTML, the most recommended way is to make full use of the built-in Markdown editor.It automates and intelligently handles most layout requirements, greatly improving content creation efficiency.For scenarios that require special control,renderThe parameter provides the ability to enable or disable Markdown rendering on demand. And for truly plain text, which does not involve Markdown syntax, linebreaksandlinebreaksbrThe filter is a simple and effective solution.

Master these methods, and you can ensure that every piece of content you publish on AnQi CMS will be presented to your website visitors with the layout effect that best suits your preferences.


Frequently Asked Questions (FAQ)

Q1: I have enabled the Markdown editor and the content is also written in Markdown syntax, but the line breaks in my content are still not working, why is that?

A1: The most common reason is that you forget to use|safeThe filter. The content rendered by Markdown is HTML code, and browsers default to escaping it and displaying it as plain text instead of parsing HTML.Please check your template code, make sure it looks like{{ archiveContent|safe }}such as adding|safe.

Q2:linebreaksandlinebreaksbrWhat is the difference between filters, and which one should I choose?

A2: The main difference lies in the handling of 'blank lines':

  • linebreaksbr: All single-line breaks (\n) are replaced with<br/>. For blank lines (two consecutive blank lines),\nit will generate two<br/>.
  • linebreaksReplace a single line break with<br/>But it will convert two consecutive line breaks (i.e. one blank line) into a pair<p>tags, which are more in line with semantic paragraph structure.

If you want simple line breaks between lines without distinguishing paragraphs, you can chooselinebreaksbr. If you want empty lines to create new HTML paragraphs, making the structure clearer, thenlinebreaksWould be a better choice.

Q3: Can I manually write HTML tags in Markdown content?<br/>or<p>Can I use HTML tags?

A3: Yes, Markdown syntax usually supports embedding native HTML tags. This means you can write HTML directly in Markdown content.<br/>Force a newline or use<p>Labels define paragraphs. The Anqi CMS Markdown renderer will also recognize and retain these native HTML tags. This is useful when it is necessary to refine the content locally.