In daily website operation, content editors often need to manually add hyperlinks to URLs or email addresses in articles and descriptions. This task is not only time-consuming but also prone to errors, affecting the efficiency and accuracy of content publishing. Fortunately, AnQiCMS provides a very practical template filterurlizeIt can help us automate this process, greatly reducing the workload of manually adding links.

urlizeWhat is a filter?

In simple terms,urlizeThe filter is a powerful tool in the AnQiCMS template system, its main function is to automatically identify URLs (website addresses) and email addresses in text content and convert them into clickable links<a href="...">Hyperlink. This means that your content editor only needs to enter the plain text URL or email address, without manually writing the HTML link tag.

Even more exciting is,urlizeThe filter also intelligently adds an automatic external link during link conversionrel="nofollow"Property. This is very beneficial for the SEO optimization of the website, as it helps control the transmission of 'link weight' and avoid distributing unnecessary weight to external websites.

Why should we useurlize?

  1. Significantly reduce workload:Imagine you have an article with ten or so URLs. Manually adding links one by one not only takes time, but is also prone to missing or mistyping. UseurlizeEnsure that the URL is written correctly, and the system will automatically complete the link conversion.
  2. Improve the accuracy and consistency of links:Automated processing eliminates human error, all recognized links will be presented in a uniform format, ensuring the overall professionalism and standardization of the website.
  3. Optimize SEO performance:Automatically addedrel="nofollow"The attribute is particularly suitable for handling links in user comments, external references, and other content, which helps the website better manage the quality of external links and maintain its SEO weight.
  4. Handle special characters better:For URLs containing special characters (such as quotes in query parameters),urlizeit can also perform appropriate processing to ensure the availability of the link.
  5. Optimize the display of long links:CombineurlizetruncFilter, you can also set the display length of the link, truncating long URLs and replacing...them to make the page layout cleaner and improve the user reading experience.

How to use in AnQiCMSurlize?

AnQiCMS's template system (based on the Django template engine syntax of Go language) enablesurlizeThe application is very intuitive. You just need to add after the text variable you need to process|urlizethe filter.

However, there is a very important point to note: AnQiCMS's template system, for security reasons, defaults to escaping all output HTML content (that is,<to&lt;due to the fact thaturlizeThe filter generates HTML link tags, in order for these tags to be correctly parsed and displayed as clickable links by the browser, you also need to use them immediately after.|safefilter.

The correct usage is as follows:{{ 您的内容变量 | urlize | safe }}

Examples of application scenarios:

The following are some applications you can use in the AnQiCMS template:urlizeSeveral common locations of filters:

  • Article detail page (archive/detail.html)For the main content of the article, it usually contains a large number of URLs that may need to be converted to links.

    <div class="article-content">
    {%- archiveDetail articleContent with name="Content" %}
    {{ articleContent | urlize | safe }}
</div>

  • Single-page content (page/detail.html)pages such as "About Us

    <div class="page-content">
    {%- pageDetail pageContent with name="Content" %}
    {{ pageContent | urlize | safe }}
</div>

  • Category or tag description (category/list.html,tag/detail.html)The category or tag description may occasionally include URLs that need to be automatically linked.

    <div class="category-description">
    {%- categoryDetail categoryDescription with name="Description" %}
    {{ categoryDescription | urlize | safe }}
</div>

Handle special cases:

  1. Avoid escaping the content of links:By default,urlizeThe filter will remove certain characters from the link text (such as"Escaping as an HTML entity. If you want the link text to remain unchanged, you can addurlizeafter the filter:falseParameter.

    {# 示例：处理包含特殊字符的链接文本，不进行转义 #}
<p>{{ "www.kandaoni.com/test=\"test\" lorem ipsum" | urlize:false | safe }}</p>

    Please note that this is usually used when you are very sure that the link content is safe and does not require browser escaping.

  2. Truncate long links:Directly displaying a long link address can affect the aesthetics of the page.urlizetruncThe filter can help you truncate the link text after a specified length and...indicating.

    {# 示例：将链接文本截断为 30 个字符 #}
<p>{% filter urlizetrunc:30 | safe %}</p>
<p>这是一个非常长的链接地址：https://www.example.com/very/long/path/to/specific/resource?param1=value1&param2=value2</p>
<p>{% endfilter %}</p>

Tips: urlizeThe filter is applicable to articles, comments, descriptions, etc.Unstructured, generated by editors or usersText content. For website navigation, friend links, etc., precise control and styling are requiredStructured linksWe usually still go through the navigation management or friend link management function of the AnQiCMS backend to set it up, and usenavListorlinkListtags to call instead of relying onurlizefilter.

By proper useurlizeFilter, your content editor will be freed from the tedious manual link work, allowing them to focus more on content creation itself, while also enhancing the professionalism and user experience of the website content.

Frequently Asked Questions (FAQ)

Q1: Why did I use in the template{{ 变量 | urlize }}after, the page displays the original<a href="...">code instead of a clickable link?

A1:This is because the AnQiCMS template system, for security reasons, defaults to escaping all output HTML content, to<to&lt;,>to&gt;etc.urlizeThe filter will generate HTML tags, if you want these tags to be correctly parsed by the browser, you need to addurlizea filter after|safethe filter. The correct syntax is{{ 变量 | urlize | safe }}.|safeTell the template system that you are sure this content is safe and does not need to be escaped.

Q2:urlizeWhat types of text does the filter automatically recognize and convert to links?

A2: urlizeThe filter will mainly identify the following three types of text:

  1. Start withhttp://orhttps://Complete URLs at the beginning.
  2. Start withwww.URLs at the beginning (it will automatically complete them)http://)
  3. Standard email address format (such as[email protected]), and convert it tomailto:links.

Q3:urlizeandurlizetruncWhat are the differences between the filters? Which one should I choose?

A3:

  • urlizeThe filter will convert recognized URLs and email addresses into complete hyperlinks, with the link text being the original URL or email address.
  • urlizetruncThe filter, in addition to havingurlizeIn addition to all its features, it also allows you to specify a length parameter. When the link text exceeds this specified value,urlizetrunc