During the template creation process of Anqi CMS, we often encounter scenarios where we need to format and align text content.Whether it is a list display of product names and prices or the layout of article titles and dates, a uniform layout can significantly enhance the professionalism and user experience of the website.The Anqi CMS template engine supports syntax similar to Django, providing a series of powerful filters to help us meet these needs.Today, let's delve into two very practical string processing filters:ljustandrjustThey are used to implement the left and right alignment of strings.

UnderstandingljustandrjustThe role of the filter

ljustandrjustThe core function of the filter is to perform operations on strings.Blank fillingAlign text to achieve the specified target length for alignment.

  • ljust(Left Justify) Filter ljustAs the name implies, it means 'left-aligned'. It will place the given string to the left and, according to the specified target length, fill the string on the right with spaces.Fill on the right side with spaces.Until the total length of the string reaches the value we preset.

    • How to use: {{ 字符串变量 | ljust:目标长度 }}
    • Example:
      
      {# 假设商品名称“AnQiCMS”长度为7,我们希望它占据10个字符的空间并左对齐 #}
      {{ "AnQiCMS"|ljust:10 }}
      
      The output will be:"AnQiCMS "(The string "AnQiCMS" followed by 3 spaces)
  • rjust(Right Justify) Filter rjustIt is "right-aligned", it will place the given string to the right and, according to the specified target length, in the string'sleft padding spacesto reach the total length we set.

    • How to use: {{ 字符串变量 | rjust:目标长度 }}
    • Example:
      
      {# 假设商品价格“99.00”长度为6,我们希望它占据8个字符的空间并右对齐 #}
      {{ "99.00"|rjust:8 }}
      
      The output will be:" 99.00"(String "99.00" preceded by 2 spaces)

Key feature: Length processing rule

While usingljustandrjustWhen filtering, there is a very important feature that needs to be paid attention to:

If the length of the original string has alreadyexceededthe target length you specified, thenljustandrjustFilter andit will not truncateyour string, but willAs isOriginal string. This means they are mainly used to extend short strings to achieve alignment, rather than shorten long strings.

  • Example:
    
    {# 目标长度为5,但原始字符串长度为7 #}
    {{ "AnQiCMS"|ljust:5 }}
    
    The result will be:"AnQiCMS"(The string is returned as is)

Application scenarios in practice

These filters are widely used in template development, especially in scenarios where structured or tabular data needs to be created:

  1. Display of table data:When you need to display multi-column data in plain text or pre-formatted text and want each column to be neatly aligned,ljustandrjustCan fully show off. For example, on an order detail page, you can align the product name and price like this:

    {% for item in order.items %}
        <p>商品名称:{{ item.name|ljust:20 }}单价:{{ item.price|rjust:8 }} 数量:{{ item.quantity|rjust:4 }}</p>
    {% endfor %}
    

    This will make the 'Product Name', 'Unit Price', and 'Quantity' in each row visually form a column, enhancing readability.

  2. Fixed width layout: In certain specific scenarios, such as generating reports, printing templates, or integrating with certain fixed-width systems, it is necessary for text blocks to strictly adhere to a specific width. In such cases, filling with spaces for alignment is very useful.

  3. Visual effects optimization:Alignment can make the page elements look more orderly and professional. For example, when displaying points or balance in the user's personal center, the right alignment of numbers can be unified.

The difference with related filters

The Anqi CMS template engine also provides other filters related to string length and alignment, understanding their differences can help us make better choices:

  • centerFilter:withljustandrjustsimilar,centerUsed to achieve centered alignment of strings. It fills spaces on both sides of the string.
  • truncatecharsandtruncatewordsFilter:These filters are used to truncate overly long strings and add an ellipsis at the end....They are mainly used to shorten text, not to fill. Therefore, when the string exceeds the target length,ljustandrjustthe original string will be retained, whiletruncatecharsetc. will be truncated.

Summary

ljustandrjustThe filter is a powerful tool in Anqi CMS template for string alignment.By simply setting the parameters, we can make the text content more orderly and visually appealing, thereby enhancing the overall beauty and user experience of the website.Master their usage and characteristics, allowing your safe CMS template to be more finely crafted in the details.


Frequently Asked Questions (FAQ)

1.ljustandrjustDoes the filter truncate a string that exceeds the target length?No. If the length of the original string has already exceeded the target length you specified,ljustandrjustThe filter returns the original string unchanged, without any truncation. It is mainly used to fill spaces on both sides (or one side) of a short string to achieve alignment.

2. In addition to spaces, I can use other characters to fillljustandrjustfilter?Currently, in the Anqi CMS templateljustandrjustThe filter is set to default and only supports usingspacesFill in the blank. If you need to use other characters for filling or more complex alignment logic, you may need to combine other string processing filters or perform data preprocessing on the backend.

3. How to achieve the effect of center-aligned text in strings?AnQi CMS template engine providescentera filter to achieve center-aligned text. Its usage is similar toljustandrjustfor example:{{ "居中文字"|center:20 }}.centerThe filter will add spaces on both sides of the string to center it within a specified length.