In the daily operation and content management of websites, we often encounter situations where we need to view system logs, user-submitted reports, or various detailed records.These records usually contain a large amount of text information, some of which are even very long messages.When these long messages are displayed directly on the management backend or report page without processing, they often bring some reading inconvenience: the page layout may be stretched, causing difficult-to-handle horizontal scroll bars, or key information may be compressed and difficult to recognize.
AnQi CMS provides a series of practical template filters to help us optimize the display of content, including one namedwordwrapThe filter, which can effectively solve the problem of long text display.
UnderstandingwordwrapThe principle of the filter.
wordwrapThe filter, as the name implies, is mainly used to automatically wrap long text content to a specified length.Its goal is to improve the readability of text, avoiding long lines that require the user to scroll horizontally to read it completely.
Use in AnQi CMS templatewordwrapWhen filtering, we need to provide it with two main pieces of information: the text content to be processed, and the maximum length of each line. Its basic usage is{{ obj|wordwrap:数字 }}. Here,objIt is the long text variable to be processed, and数字which is the maximum length of characters per line you expect.
For example, if your log variable name islogMessageAnd you hope that each line of text does not exceed 80 characters, you can use it like this:
<div>
{{ logMessage|wordwrap:80 }}
</div>
By this means,logMessageThe text is automatically split into multiple lines when displayed, each line not exceeding 80 characters, greatly enhancing the reading experience.
wordwrapActual application in AnQi CMS logs or reports
Optimize system log displayThe system log of AnQi CMS, such as error reports, performance monitoring records, etc., may contain detailed stack trace information, error descriptions, or long operation procedures.This information, if not processed with line breaks, may cause the log page to become disorganized, making it difficult to quickly locate problems.By applying to the log message field
wordwrapThe filter can keep each log item within a fixed width, making the log list neat and orderly, and convenient for operation personnel to quickly browse and analyze.Improve user submitted reports or feedbackIn some cases, users may submit long text content through website forms, such as detailed product inquiries, feedback, or complaints.If this content is displayed directly on the background report or review interface without processing, it is likely to disrupt the page layout and affect management efficiency.
wordwrapThe filter ensures that the long text submitted by these users is displayed in good format, avoiding damage to the table structure, and making it more comfortable for operations personnel to review and handle.Improve the experience of the content review interfaceFor self-media operators or users managing multiple sites, content review is a common procedure.The content pending review may include draft articles, comments, messages, etc., among which there are lengthy texts and even texts with irregular formatting.On the content review detail page, use these long text fields
wordwrapIt can ensure that the content is presented in a tidy paragraph format, reducing the visual burden on the content reviewer and improving review efficiency.
UsewordwrapPoints to note when doing so
ThoughwordwrapThe filter is powerful, but there are also some key points to note when using it to ensure the display effect:
- Line break is based on spaces:
wordwrapThe filter mainly breaks lines between words (i.e., at spaces). This means that if a piece of text contains continuous long strings without spaces (such as a very long URL, a string of consecutive alphanumeric characters, or a long Chinese sentence without punctuation),wordwrapThe filter cannot split it because it cannot find the 'word boundary'. In this case, the long string will still exceed the line width you have set. - Combined with HTML display:
wordwrapThe filter itself only changes the structure of the string; it does not automatically insert HTML at line breaks.<br/>Label. If your log or report is displayed on an HTML page and you want the line break effect to be visually apparent, you usually need towordwrappass the result through|linebreaksbrThe filter processes, or places the text in<pre>tags to preserve the original whitespace and line breaks. For example:{{ logMessage|wordwrap:80|linebreaksbr|safe }}.safeThe filter is necessary because it will convertlinebreaksbrGenerated<br/>tags into HTML elements.
By reasonable applicationwordwrapThe filter allows Anqi CMS users to significantly improve the ease of use of the backend management interface and the readability of data reports, making content operation work more efficient and smooth.
Frequently Asked Questions (FAQ)
Q1:wordwrapHow to use filters with HTML tags to achieve line breaks on the page?
A1:wordwrapThe filter itself only performs logical line breaks at the string level, it does not add HTML's<br/>tags. To actually see the line break effect in the browser, you need to convertwordwrapPass the filtered result to|linebreaksbrA filter that converts logical line breaks to<br/>Tags. At the same time, sincelinebreaksbrIt generates HTML tags, you also need to use|safeA filter to prevent these tags from being escaped, ensuring they are correctly parsed by the browser. A complete usage example is{{ 变量|wordwrap:数字|linebreaksbr|safe }}. Additionally, if you wish to preserve the original text format, including all whitespaces and line breaks, you can also place the text content inside<pre>HTML tags.
Q2: If my long message is continuous Chinese,wordwrapCan the filter still work?
A2:wordwrapThe filter primarily relies on word boundaries (i.e., spaces) for line breaks. If your long message is a continuous Chinese text without spaces or recognizable punctuation marks as separators, thenwordwrapThe filter will not be able to perform effective automatic line breaks on it.It treats the entire Chinese long string as a 'word', even if it exceeds the set length, it may not wrap to the next line either.In this case, you may need to consider other text processing methods, or avoid entering long continuous Chinese paragraphs when entering content.
Q3:wordwrapFilters andtruncatecharsWhat are the differences between filters? How should I choose?
A3: These two filters have different purposes.
wordwrapIt is designed to split long text into multiple lines for better readability, while retaining all the content of the text.truncatecharsIt is to truncate the long text to a specified length and add an ellipsis (...) at the end, which will discard the content beyond that. Which filter to choose depends on your needs: if you need to display all the information in full, just want to make it more beautiful and readable, thenwordwrapIt is a better choice. If you just want to display a part of the text as a summary or preview, and do not care about whether the content is complete, thentruncatecharsit is more appropriate.