How to automatically add hyperlinks to URLs and email addresses in article content of AnQi CMS?

In content management and website operation, automatically converting URLs and email addresses in text to clickable hyperlinks not only greatly enhances user experience but also optimizes the internal link structure of the website to some extent.For AnQiCMS users, achieving this feature is not through simple backend settings, but through the specific 'filter' provided by its powerful template engine.This design approach gives website owners great flexibility and control, allowing them to finely manage the generation of links according to the needs of different content areas.

Understand the automatic link mechanism of AnQiCMS

One of AnQiCMS's core strengths is its high-performance template engine, which draws on the syntax of Django templates.The feature of automatically adding hyperlinks to URLs and email addresses in this architecture is not executed immediately when you save the article content.On the contrary, it is dynamically completed by applying specific template filters when the content is 'rendered' (i.e., displayed) on the front-end page.

This means that when you edit articles in the background, even if you enter them directlywww.anqicms.comor[email protected]Such plain text, AnQiCMS will not store it in the database either<a>Tags. The benefit of this is that it maintains the purity of the content, and it hands over the rendering logic of the link to the front-end template, thus allowing different link processing rules to be applied in different pages or content blocks, such as where links are needed and where they are not.

Core function:urlizeFilter

To implement automatic hyperlinks for URLs and email addresses on the front-end page, AnQiCMS provides a namedurlizeThe built-in filter. This filter is specifically used to identify URLs in text (including those withouthttp://orhttps://such aswww.example.comandexample.com) and email addresses, and wrap them automatically in<a>Tags within. To comply with SEO**practices,urlizeThe filter will also automatically add to these generated linksrel="nofollow"attributes, which help inform search engines that these links do not pass weight, and avoid unnecessary SEO risks.

For example, if you include the following text in the article content field (usuallyarchive.Content) as follows:

欢迎访问 AnQiCMS 官方网站：https://en.anqicms.com，
或者通过邮箱联系我们：[email protected]，
我们还提供文档：www.kandaoni.com。

If you output directly in your template file,{{ archive.Content }}These URLs and email addresses will still be plain text. But if you applyurlizea filter like this:

{{ archive.Content|urlize|safe }}

Then when the page loads, this content will be rendered as:

欢迎访问 AnQiCMS 官方网站：<a href="https://en.anqicms.com" rel="nofollow">https://en.anqicms.com</a>，
或者通过邮箱联系我们：<a href="mailto:[email protected]" rel="nofollow">[email protected]</a>，
我们还提供文档：<a href="http://www.kandaoni.com" rel="nofollow">www.kandaoni.com</a>。

Please note that an additional|safefilter was used. This is becauseurlizeThe filter will convert plain text to text containing HTML tags(<a>The text, while AnQiCMS template engine defaults to escaping all output content for security reasons to prevent XSS attacks. If there is no|safeYour link may be displayed as plain text.<a href="...Therefore, when you are sure.urlizeWhen the content generated by the filter is safe and needs to display HTML tags, be sure to use them in conjunction.|safefilter usage.

urlizeThe filter also supports an optional parameter to control whether the link text is escaped. By default, the link text is kept unchanged. If it is set totrueIf the special characters in the link text are escaped; if set tofalse(or not set), no additional escaping will be performed on the link text. Usually when used in article content, you would want to retain the original text display, so it is usually not necessary to set this parameter or set it tofalse. For example:

{# 链接文本不会被转义，显示为原始URL或邮箱 #}
{{ archive.Content|urlize:false|safe }}

Advanced Application:urlizetruncFilter

For scenarios that may contain long URLs, AnQiCMS also providesurlizetrunca filter. Its function is tourlizeSimilar, but it adds an additional feature: you can specify a numeric parameter to truncate the text displayed in the hyperlink. When the length of the URL exceeds this specified value, the excess part will be...Replace it, thus maintaining the page layout.

For example, if you have a very long URL:https://en.anqicms.com/this-is-a-very-very-long-article-title-that-results-in-a-very-long-url-example.htmlIf you want to limit the display length to 20 characters, you can use it like thisurlizetrunc:

{{ archive.Content|urlizetrunc:20|safe }}

This code may render the above long URL as:

<a href="https://en.anqicms.com/this-is-a-very-very-long-article-title-that-results-in-a-very-long-url-example.html" rel="nofollow">https://www.anqic...</a>

This is especially useful in limited space areas such as news lists, article summaries, or comment sections, where it can provide link functionality without destroying the visual balance of the page.

How to effectively utilize in content

In order to effectively utilize these automatic hyperlink functions on your AnQiCMS website, you need to edit the website template files. Usually, the article detail page (such asarchive/detail.html) and single page detail page (such aspage/detail.html**The output part of the content in**)

Find the tags (such as**) that display the article or page content in your template.{{ archive.Content|safe }}or{{ page.Content|safe }})，then change it to：“

{# 为文章内容自动添加超链接 #}
{% archiveDetail articleContent with name="Content" %}
    {{ articleContent|urlize|safe }}
{% endarchiveDetail %}

{# 或者为单页内容自动添加超链接 #}
{% pageDetail pageContent with name="Content" %}
    {{ pageContent|urlize|safe }}
{% endpageDetail %}

If you want to truncate the link text：“

{# 为文章内容自动添加超链接并截断链接文本至40个字符 #}
{% archiveDetail articleContent with name="Content" %}
    {{ articleContent|urlizetrunc:40|safe }}
{% endarchiveDetail %}

In this way, all the articles and page content on your website, as long as it contains recognizable URLs or email addresses, will be automatically converted into clickable hyperlinks on the front-end, greatly enhancing the user experience and accessibility of information.

Points to note

• change at the template levelRemember, these are all template-level operations. If you are not familiar with the template file structure of AnQiCMS or the GoLang template engine, it is recommended to seek professional help or carefully read the AnQiCMS template development document to avoid unnecessary errors.
• |safefilter is crucialWhen you output content that may contain HTML tags (such as byurlizeorurlizetruncGenerated<a>tags) be sure to use|safeA filter to ensure that HTML code is parsed correctly by the browser and not displayed as plain text.
• Flexibility and controlThis dynamic rendering method allows you to precisely control which content areas need to be automatically linked, as well as the display style of the links, thereby better serving your website's operational strategy.

By reasonably utilizing the AnQiCMS providedurlizeandurlizetruncFilter, you can make your website content more interactive while maintaining SEO-friendly and providing a smoother browsing experience for users.

Frequently Asked Questions (FAQ)

1. Why does the URL I input in the background while editing an article automatically become a hyperlink on the front end? Where is this set?AnQiCMS does not set a global 'auto-link' switch in the background.This feature is implemented through a specific "filter" in the front-end template file.When your article content is displayed on the front page, if the template has applied to the contenturlizeorurlizetruncA filter that dynamically recognizes URLs and email addresses in text and converts them into clickable hyperlinks.

2. Why does the URL show up after I follow the tutorial?<a href="...">Such plain text, not clickable links?This is usually because you have applied in the templateurlizeorurlizetruncAfter filtering, forget to add after it|safeThe filter. The AnQiCMS template engine, to prevent potential security risks (such as XSS attacks), defaults to escaping all output HTML tags.|safeThe filter tells the template engine that this content is safe, does not require escaping, and thus allows the browser to correctly parse and display it as a clickable hyperlink.

3. Will automatically added hyperlinks affect the SEO of the website?AnQiCMS'urlizeandurlizetruncThe filter automatically adds hyperlinks to the links generated.rel="nofollow"The attribute tells the search engine that these links should not pass 'link juice', that is, they should not be counted in the search engine's ranking weight.This is generally considered a good SEO practice, especially when generating links automatically or when the link target is not the core content of the website, which can avoid unnecessary SEO risks and maintain the overall health of the website's link structure.