AnQi CMS: The secret to transforming plain text product introductions into rich text displays

On the day when digital marketing is increasingly important, simply a product introduction in plain text is no longer able to attract the attention of users.A beautifully formatted, rich text product introduction with pictures, which can not only greatly enhance the user's reading experience, but also effectively convey the value of the product, and even has a positive effect on search engine optimization (SEO).AnQi CMS is well-versed in this, providing a smooth mechanism that allows you to easily convert seemingly ordinary plain text product introductions into expressive rich text for display.

Why do we need rich text displays?

Imagine if your product introduction were just a dense block of text, with no titles, no paragraphs, no images, the user might be put off.The limitations of plain text lie in its lack of expressiveness, making it difficult to highlight key points and ineffective in guiding users' reading.

And rich text display is completely different. By using bold, italic, lists, quotes, inserting images, videos, and hyperlinks, etc., the product introduction becomes:

  • Visually more attractive:A rich and colorful layout can catch the user's eye instantly.
  • Information is easier to read:Reasonable paragraph division and key points make it easy for users to quickly understand the highlights of the product.
  • The content is more vivid:The integration of images and videos, directly displaying the product's appearance and features, enhances the appeal.
  • The structure is clearer:Helps search engines better understand the structure of page content, thereby improving SEO performance.

AnQi CMS implements the core mechanism for automatic conversion.

The AnQi CMS can efficiently convert text to rich text, thanks to its flexible content management features, advanced editor, and powerful template rendering capabilities.

First, the flexible content model of Anqi CMS is the foundation of everything.You can create a content model specifically for "product" and define fields such as "product nameFor fields like 'Product Introduction' or 'Product Details' that require rich expression, the visual editor built into Anqi CMS is the key.When you write this content in the background, every operation such as bolding, inserting images, creating lists, and so on, is actually quietly generating standard HTML code in the background.This means that what you see in the editing interface is what you get, and the content is already in HTML format.

Further, AnQi CMS also supports the use of Markdown editors. If you are accustomed to using Markdown, a lightweight markup language to write content, for example, using## 亮点Indicates a second-level title, using* 优点Indicates a list item, so when displayed on the front end, the Anqi CMS template engine can automatically parse and render the corresponding HTML structure.This provides great convenience for users who pursue efficient writing.

Finally, this HTML content, which has been edited or converted from Markdown, will be displayed on your website through the powerful template system of AnQi CMS.The specific tags in the template are responsible for extracting this content and outputting it to the web page.

Specific operation steps: Make the product introduction 'alive'

To achieve the magnificent transformation from plain text to rich text, you just need to follow the following simple steps:

1. Configure or check your product content model

First, make sure that your 'product description' field is ready to accept rich text content.

  • Log in to the Anqi CMS backend, navigate to the 'Content Management' under 'Content Model'.
  • Find the model you use to manage products (for example, the default "Product Model" or a custom model you have created).
  • Edit the model to view the fields used to store product descriptions, such as the field named "Content" or "Product Description".
  • Ensure that the field uses the visual editor provided by Anqi CMS during editing, or you have explicitly selected the Markdown editor.These editors will be responsible for converting the content you enter (including formatting and media elements) into HTML.

2. Write your product description in the backend.

Now, you can start entering the product introduction content.

  • In the background, go to 'Content Management' to enter 'Publish Document' (if it is a product model, it may display as 'Publish Product').
  • Find the product introduction field you have configured.
  • If you are using the visual editor:Directly use various tools for formatting in the editor.For example, use the buttons on the toolbar to bold text, set title levels, create ordered or unordered lists, insert product images, add external links, and so on.All these operations will automatically generate the corresponding HTML code when the content is saved.
  • If you are using the Markdown editor:Write in Markdown syntax. For example, use#/##/###to indicate different levels of headings, use*or-to create lists, use**文字**Bold, to insert an image. The Anqi CMS will recognize these tags after you save.

3. Display content correctly in the front-end template.

This is a crucial step to achieve "auto-translation", ensuring that your content can be correctly parsed and displayed as rich text by the browser.

  • Open the template file used on the front end of your website to display product details. This is usually located/templatein the directory, for exampledefault/product/detail.html.
  • Find the location in the template where you want to display the product introduction. You will usearchiveDetailThe template tag is used to obtain content.
  • The key is to use the product introduction content field whenrender=trueparameters (if the content is in Markdown format) and|safeFilter. For example, if your product description field isContentand you may have used Markdown:
    
{% archiveDetail productDescription with name="Content" render=true %}
    {{ productDescription|safe }}
{% endarchiveDetail %}
    • name="Content": Specify the name of the content field to be called.
    • render=trueThis parameter tells the Anqi CMS template engine, ifContentthe field contains Markdown syntax, please render it (convert it) into HTML.
    • |safeThis is a filter of the Pongo2 template engine. By default, to prevent cross-site scripting attacks (XSS), the template engine will escape all output content (for example, converting<to&lt;）。But the rich text content itself contains HTML tags, we need|safeThe filter makes it clear to the template engine that this content is safe and can be directly output as HTML without escaping.

By following these steps, whether you are directly entering rich text through a visual editor or writing text using Markdown syntax, AnQi CMS can efficiently and accurately convert it into rich text content with HTML paragraphs and beautifully present it on your website.This greatly simplifies the content publishing process, making your product introduction more attractive.

Frequently Asked Questions (FAQ)

Q1: If I paste a product introduction with HTML tags directly in the backend editor, can the front end display it normally? A1:Can be.If you paste HTML code directly into the Anqi CMS rich text editor, the editor will save it as existing HTML content.|safeFilter (such as{{ productContent|safe }}), a browser can correctly parse and display this HTML without treating it as plain text.

Q2:render=trueand|safeFilters are used to display HTML; what are the differences between them? A2:They serve different purposes but are often used together.render=trueThe parameter is specifically designed for Markdown.