In website operation, we often need to format content meticulously to enhance user experience and page aesthetics.Especially when dealing with article titles, if each word's first letter can be automatically capitalized, it will undoubtedly make the title look more standardized and professional.So, as a user of AnQiCMS, can we achieve this requirement through its powerful template function?

The good news is that the Anqi CMS built-in Django style template engine indeed provides such a feature, which is what we are going to introduce todaytitleFilter. This filter is specifically designed to capitalize the first letter of each word in a string while converting the rest to lowercase, which is very suitable for formatting article titles.

Core function reveals: AnQiCMS'stitleFilter

titleThe filter is a convenient tool in the Anqi CMS template system, its function is to traverse a string, find each word in it, and convert the first letter to uppercase and the rest to lowercase.This keeps the title visually consistent and gives a sense of standard and professionalism.

Here is a simple example, if the title of your article is “hello world in anqicms”, aftertitleThe filter will be processed and will become 'Hello World In Anqicms'. This is the effect we want to achieve.

It is very intuitive to use it in the template, you just need to add it after the variable displaying the title|titleand it is done. For example, if the variable for your article title isarchive.Title, then you can write it like this in the template:

<h1>{{ archive.Title|title }}</h1>

However, there is a point that needs special attention here. titleThe filter is mainly designed for English strings. If you try to apply it to Chinese titles, such as{{ "你好世界"|title }}The output will still be 'Hello World', and the capitalization format of Chinese characters will not change.Therefore, this filter is more suitable for English websites or for formatting English titles.

How to apply in the templatetitleFilter

applytitleThe filter is very simple, whether you are displaying the article title on the article detail page, or displaying the article summary title on the homepage or list page, it can be easily applied.

Assuming you are editing a template for an article detail page, typically the article title is displayed througharchive.TitleRetrieve such a variable. If you want the title to be displayed with each word capitalized, you can write the code like this:

<div class="article-header">
    <h1>{{ archive.Title|title }}</h1>
</div>

Similarly, for the TDK (Title, Description, Keywords) settings at the top of the page, if you wish<title>The content within labels also follows the rule of capitalizing the first letter of each word, and you can also applytdk.Titlevariable applicationtitleFilter:

<head>
    <title>{{ tdk.Title|title }}</title>
    <meta name="keywords" content="{% tdk with name="Keywords" %}">
    <meta name="description" content="{% tdk with name="Description" %}">
</head>

In this way, no matter which page the user visits, as long as the template is applied|titleFilter, related English string titles will be automatically formatted.

Practical suggestions and precautions

  • Language applicability:Emphasize again,titleThe filter is most suitable for English content. It does not produce any visible effect for Chinese titles. Therefore, it is important to specify the language type of your content before using it.
  • In conjunction with other filters:If your requirement is not limited to capitalizing the first letter of each word, for example, you may need to capitalize the entire title (upper) or only the first letter of the sentence (capfirst), AnQi CMS also provides the corresponding filters. Understanding these diverse tools can help you more flexibly meet various content formatting needs.
  • Scope of application: titleThe filter can be applied to any string variable that you want to format with the first letter of each word capitalized, not just article titles, but also product names, category names, etc., as long as they are mainly in English words.

Visible, Anqi CMS'titleThe filter is a very practical tool that can help us easily enhance the professionalism and reading experience of the website content.Master these little tricks and it will make our website operation more efficient.

Frequently Asked Questions (FAQ)

Q1: If I only want the first letter of the article title to be capitalized, not the first letter of each word, which filter should I use?

A1:If you only need to capitalize the first letter of the entire title (like sentence case), you can usecapfirsta filter. For example:{{ archive.Title|capfirst }}.

Q2: Besides capitalizing the first letter of each word, what are some common formatting treatments I can apply to an article title?

A2:AnQi CMS provides various filters to handle string formatting:

  • upper: Convert all letters to uppercase. For example:{{ archive.Title|upper }}.
  • lower: Convert all letters to lowercase. For example:{{ archive.Title|lower }}.
  • truncatechars:N: Truncate the string to a specified length and end with “…”. For example:{{ archive.Description|truncatechars:100 }}.

Q3: Why did my Chinese title use|titleThe filter did not change at all?

A3:This is becausetitleThe filter is mainly designed to process English strings. Chinese characters do not have uppercase and lowercase, so the filter is invalid for Chinese titles and will not produce any formatting changes.