How do the `urlize` and `urlizetrunc` filters automatically convert URLs in text to clickable links?

Calendar 👁️ 80

It is crucial to present information efficiently and aesthetically in website content operation.Especially when the content contains a large number of URLs or email addresses, manually converting them into clickable links is not only inefficient but also prone to errors.AnQiCMS (AnQiCMS) is well-versed in this, its template system providesurlizeandurlizetruncThese two practical filters can automatically identify URLs in text and intelligently convert them into clickable hyperlinks, greatly enhancing user experience and content management efficiency.

Understanding the template filters of Anqi CMS

In the Anqi CMS template system, filters play the role of a content 'formatting assistant'.They can perform various operations on variables, such as converting text to uppercase, truncating parts of content, or, as we will discuss today, converting plain text URLs into clickable links.usually follow the use of filters{{ 变量名 | 过滤器名称: 参数 }}such as this.

urlizeFilter: Make links clickable immediately

urlizeThe core function of the filter is to intelligently identify URLs and email addresses in text and automatically wrap them in HTML's<a>Tags within it make it clickable hyperlinks. It can also recognizehttp://orhttps://full URLs starting withwww.domain names, even common email addresses.

What's more worth mentioning is,urlizeThe filter will also automatically take care of converting these links<a>tagsrel="nofollow"Properties. For content operators, this means that the website can more effectively manage the loss of external link weight, which helps to concentrate its own SEO value and indicates to search engines that these links should not be tracked or pass on weight, especially suitable for handling scenarios with a large number of external links such as user comments, forum posts, etc.

Usage example:

Assuming your article content contains the following plain text URLs:

<p>我的博客地址是:http://www.anqicms.com,欢迎访问。</p>
<p>您也可以访问我们的官网:www.anqicms.com。</p>
<p>或者直接联系我们:[email protected]。</p>

afterurlizeAfter the filter is processed, cooperate|safeBecause the filterurlizeIt will generate HTML tags, you need|safeTell the template engine that these HTML is safe and can be output directly, avoiding being escaped), the code is as follows:

<p>{{ "我的博客地址是:http://www.anqicms.com,欢迎访问。"|urlize|safe }}</p>
<p>{{ "您也可以访问我们的官网:www.anqicms.com。"|urlize|safe }}</p>
<p>{{ "或者直接联系我们:[email protected]。"|urlize|safe }}</p>

The rendering result will be:

<p>我的博客地址是:<a href="http://www.anqicms.com" rel="nofollow">http://www.anqicms.com</a>,欢迎访问。</p>
<p>您也可以访问我们的官网:<a href="http://www.anqicms.com" rel="nofollow">www.anqicms.com</a>。</p>
<p>或者直接联系我们:<a href="mailto:[email protected]">[email protected]</a>。</p>

Furthermore,urlizeThe filter also supports a boolean parameter to control the escaping of link content. When the parameter istruefor exampleurlize:true),the special characters in the link text (such as&)will be escaped as HTML entities (&amp;); when the parameter isfalsefor exampleurlize:false) it will not be escaped. When processing raw input from users, it is usually recommended to keep the default escaping behavior to enhance security.

urlizetruncFilter: Balance of beauty and practicality

Sometimes, the URL address in the text may be very long, and displaying it directly on the page may take up a lot of space, affecting the aesthetics and reading experience of the overall layout. In order to solve this problem, Anqi CMS providesurlizetruncfilter.

urlizetruncFilter is onurlizeBased on further optimization, it can automatically recognize and convert URLs, and also allows you to specify the maximum length of the link display text. When the displayed text of the URL exceeds the length you set, the extra part will be smartly omitted with an ellipsis....Alternative. Although the displayed text is truncated,hrefthe attribute is still the complete original URL, and the user will still be redirected to the correct address when clicked.

This feature is especially useful in scenarios where space needs to be saved, such as in news list summaries, sidebar recommendations, or content blocks with limited widths. It makes the page look cleaner without losing the availability of links.

Usage example:

Assuming your text contains a very long URL:

{% filter urlizetrunc:30|safe %}
我的博客文章地址是:https://en.anqicms.com/category/1/anqicms-tutorial-how-to-use-urlize-and-urlizetrunc-filters.html,欢迎访问。
{% endfilter %}

Hereurlizetrunc:30Indicating that the link text is displayed at most 30 characters.

The rendering result will be:

`html The address of my blog post is:https://en.anqicms.com/

Related articles

How do the `truncatechars` and `truncatewords` filters control the truncation display of long text and add an ellipsis?

In website content operation, we often encounter such situations: In order to maintain the neatness and consistency of the page layout, we need to truncate the long text, such as in article lists or product summaries.If cut off simply and brutally, it may not only result in incomplete meaning of the text, but may also destroy the text structure containing HTML tags, affecting the aesthetics and functionality of the page.AnQi CMS, with its flexible template engine, provides us with an elegant solution to this problem.Through built-in text filters, we can easily control the display length of long texts and add ellipses at appropriate positions

2025-11-07

How does the `slice` filter accurately extract the specified part of a string or array for display?

In the daily content management of Anqi CMS, we often need to accurately trim the text or data list displayed on the website to better adapt to different layouts, provide content previews, or optimize the user reading experience.At this point, the `slice` filter has become a very practical tool, which can help us flexibly extract the specified part of a string or array.### Core Function: Basic Usage of `slice` Filter The `slice` filter is like a tailor, capable of cutting according to the "scissors" position you provide

2025-11-07

How `list` and `split` filters convert a string to an array and how to process it in a template?

In the powerful template system of Anqi CMS, flexible data processing is the key to building dynamic websites.At times, the data we retrieve from the backend, such as tags, keywords, or custom field values, may be stored as comma-separated strings, but we want to treat them as individual items in the frontend template.At this point, the `list` and `split` filters provided by Anq CMS are particularly important, as they help us convert strings into arrays, thereby enabling more refined control and display in templates.Why do we need to convert a string to an array

2025-11-07

How to effectively use `if` and `for` tags for conditional judgment and data looping in AnQiCMS templates?

In AnQiCMS template development, `if` and `for` tags are undoubtedly the core tools for building dynamic content and flexible layouts.They allow us to display content based on specific conditions or efficiently loop through data, thereby transforming static templates into rich, user-responsive pages.AnQiCMS uses syntax similar to the Django template engine, making these operations intuitive and powerful.

2025-11-07

In which scenarios must the `safe` filter be used to prevent HTML content from being automatically escaped?

When using AnQiCMS for website content management and template development, we often encounter a problem related to HTML content display: Why does the rich text content I edit in the background display as a pile of original code with angle brackets on the front end, rather than a beautifully formatted effect?This is actually the "auto-escape" mechanism of AnQiCMS template engine at work, and to solve this problem, the `safe` filter has become the key tool we must master.### Why does automatic escaping occur? AnQiCMS

2025-11-07

How do the `removetags` and `striptags` filters remove specific or all HTML tags from HTML content?

In Anqi CMS, when managing website content, we often encounter such situations: articles imported from outside, comments submitted by users, or code generated by rich text editors may contain various HTML tags.These tags are sometimes necessary, but more often, they may disrupt the page layout, introduce unnecessary styles, and even pose potential security risks. 幸运的是,AnQiCMS provides two very practical template filters —— `removetags` and `striptags`

2025-11-07

How does the `add` filter work for adding numbers or concatenating strings in templates?

In AnQi CMS template design, we often need to perform some simple data processing, such as adding several numbers to display the total sum, or combining different text fragments into a complete sentence.At this time, the `add` filter is particularly convenient, as it is like a universal connector, capable of handling everything from arithmetic operations on numbers to the combination of text, making your template more flexible and dynamic.

2025-11-07

How `default` and `default_if_none` filters set a default display value for possibly empty variables?

In website content management, we often encounter situations where variable values may be empty.These empty values, if displayed directly on the front-end page, may lead to incomplete content display, page layout disorder, and even a bad user experience.AnQiCMS (AnQiCMS) as a powerful content management system, the Django template engine syntax it adopts provides us with a flexible way to handle such issues.

2025-11-07