In AnQiCMS templates, when dealing with Markdown content, it is often necessary to first convert it to HTML, and then further filter or remove specific HTML tags on this basis.This is particularly useful when creating content summaries, generating plain text previews, or for achieving specific layout controls.The template tags and filters provided by Anqi CMS can help us complete these operations efficiently and flexibly.

第一步：将Markdown内容转换为HTML

The template engine of Anqi CMS is built with support for Markdown content rendering.When your content is entered through the Markdown editor, it is usually stored as Markdown formatted text.To display it as browsable HTML on the front-end page, you need to indicate the template engine to perform the conversion.

对于文档内容字段（English）archiveDetailofContent），English CMS默认在Markdown编辑器开启时会自动将其转换为HTML。但如果您需要更明确地控制转换过程，或者针对其他自定义Markdown字段进行转换，可以使用render=trueparameters orrenderFilter.

For example, in a document detail page, we usually display the article content like this:

{# 假设archiveDetail已经获取了当前文档详情 #}
{%- archiveDetail articleContent with name="Content" render=true %}
{{ articleContent|safe }}

Here,render=trueExplicitly indicate that the template engine willContentRender the Markdown text in the field as HTML.

Important reminder:The HTML string after transformation, if not processed|safeThe filter, may be escaped again by the template engine (i.e., <Converted to&lt;This leads to the direct display of HTML code on the page instead of rendering effects. Therefore, it is imperative to add after.render.|safeto ensure that the HTML content is correctly rendered in the browser.

If you have other custom fields that also store Markdown content and you want to render it as HTML,renderFilter:

{# 假设这是一个名为'custom_markdown_field'的自定义字段 #}
{% archiveDetail customMarkdownField with name="custom_markdown_field" %}
{{ customMarkdownField|render|safe }}

第二步：对生成的HTML进行标签移除

After converting Markdown to HTML, you may need to make further modifications to the generated HTML content, such as removing certain HTML tags, or directly obtaining plain text. The Anqi CMS provides two very practical filters to complete this task:striptagsandremovetags.

  1. Remove all HTML tags (striptags)If you need to completely remove all HTML tags, get the plain text form of the content (for example, for generating article summaries or SEO descriptions),striptagsThe filter is your preference. It removes all HTML, XML tags and HTML comments from the content.

    {# 假设'htmlContent'是Markdown转换后的HTML内容 #}
{% set pureText = htmlContent|striptags %}
<p>文章摘要：{{ pureText|truncatechars:100 }}</p>

    In this example,htmlContentAfterstriptagsAfter filtering, all HTML tags are removed, leaving only plain text, and then we usetruncatechars:100the first 100 characters as a summary.

  2. to remove specific HTML tags (removetags)When you need to control more finely, only remove specific tags from the HTML content (for example, retain paragraphs and headings, but remove images and links),removetagsThe filter provides powerful capabilities. You can specify the tag names to remove after the filter, separated by commas.

    {# 假设'htmlContent'是Markdown转换后的HTML内容 #}
{% set filteredHtml = htmlContent|removetags:"img,a,script" %}
<div class="filtered-content">{{ filteredHtml|safe }}</div>

    Here,filteredHtmlWill be removed<img>/<a>and<script>The HTML content after the label. Similarly, because the result is still HTML, it needs to be used again|safethe filter to ensure the browser renders it correctly.

Integrated Practice: Convert Markdown to HTML and Remove Tags

Now, let's combine these two steps to see how to implement Markdown to HTML in the AnQiCMS template, and then remove tags according to the requirements.

Assume you have an article content in Markdown format, and you hope:

  1. Convert it to HTML.
  2. Remove all images from the HTML (<img>）tags.
  3. Remove all hyperlinks (<a>）tags.
  4. The final display is the filtered HTML content.
{%- archiveDetail articleContentMarkdown with name="Content" render=true %}
{# 先将Markdown渲染为HTML，并标记为safe，否则removetags无法识别HTML标签 #}
{% set renderedHtml = articleContentMarkdown|safe %}

{# 对渲染后的HTML进行标签移除 #}
{% set finalHtml = renderedHtml|removetags:"img,a" %}

{# 输出最终处理过的HTML内容 #}
<div class="article-body-no-images-links">
    {{ finalHtml|safe }}
</div>

Through the above steps, your Markdown content is first rendered into standard HTML by AnQiCMS, then we applied to this HTML stringremovetagsFilter, removed all<img>and<a>Tags. Finally, the HTML content displayed on the page is without images and links.

Summary

The Markdown rendering ability of the AnQi CMS template engine combined with flexible filters provides great freedom for content display.Whether it is to filter HTML tags accurately to extract pure text abstracts, or to meet specific design requirements, these tools can help you easily implement them at the template level.renderParameters withrenderFilter,|safeFilter as well asstriptagsandremovetagsThe function and usage timing, is the key to making full use of AnQiCMS for content operation.

Common Questions (FAQ)

1. Why did I useremovetagsorstriptagsAfter that, were the HTML tags not removed?This is usually because you forgot to add in the conversion from Markdown to HTML afterremovetags/striptagsbefore adding|safeFilter. If the HTML content is not marked as “safe” (i.e., not processed|safe), the template engine may treat it as a regular string and automatically escape it, leading toremovetagsorstriptagsFilter cannot recognize and process the HTML tags within. Please make sure the HTML content converted from Markdown has been used.|safe.

2. I want to get the plain text summary of the Markdown content, **what is the practice?****The practice is to first convert Markdown content to HTML, then usestriptagsa filter to remove all HTML tags, and finally usetruncatecharsFilter text to the required length. For example：

{% archiveDetail articleContent with name="Content" render=true %}
{% set summary = articleContent|safe|striptags|truncatechars:150 %}
<p>{{ summary }}</p>

This ensures that the summary is based on the rendered HTML and does not contain any formatting tags, only retaining plain text, and controlling the length.

3. If I want to preserve some HTML tags (such as<strong>), but remove other tags (such as<img>), what should I do?Markdown itself does not directly handle “