How to set the page title (Title) in AnQiCMS template and automatically append the website name?

In website operation, the page title (Title) is an extremely important element, as it not only directly affects the user's willingness to click in the search engine results page (SERP), but is also a key indicator for search engines to judge the relevance of page content.A clear, standardized title that includes the website brand name, which can effectively enhance the professionalism and brand recognition of the website.

AnQiCMS provides a flexible and powerful mechanism for setting website titles, allowing you to easily control the title of each page and automatically append the website name. This is very beneficial for maintaining brand consistency and optimizing search engine visibility.

Understand the page title hierarchy in AnQiCMS

In AnQiCMS, the generation of page titles follows certain priority rules.This means you can set titles at different levels, the system will intelligently select and combine the most appropriate titles based on the specific situation of the current page.

1. Content-level SEO title:Whether it is an article, product detail page, or a standalone page, AnQiCMS provides the 'SEO Title' field. If you enter content here, it will be prioritized as the page's<title>Label content. This allows you to customize the independent title for each specific page to best fit the SEO strategy.
2. The title of the content itself:If "SEO title" is not set, the system will use the actual title of the content by default, such as the article title, product name, or single page name.
3. Category-level SEO Title:For category pages, you can set the 'SEO Title' in the category management. This allows you to define a unique title for a specific category list page.
4. Website Global Title Setting:In the website backend's "Global Settings", you can find the "Website Name" field.This name is usually used as a website brand identifier, appended to the page title.The TDK (Title, Description, Keywords) of the homepage can also be independently configured in the 'Homepage TDK Settings'.

After understanding these levels, we can accurately control the display of page titles through the powerful template tags provided by AnQiCMS.

Core tags:tdkThe use of tags

AnQiCMS template usagetdkTag to retrieve the page's Title, Keywords, and Description information. We mainly focus on setting the page title and automatically attaching the site name.tdklabel'sname="Title"Parameter.

Here is the basic usage:

<title>{% tdk with name="Title" %}</title>

In the above code,{% tdk with name="Title" %}Will intelligently obtain the optimized title of the current page (based on the priority mentioned above).

Automatically attach the website name.

To make the page title automatically append the "Website Name" you configured in the "Global Settings" backend, you just need to intdkthe tag withsiteName=truethe parameter.

<title>{% tdk with name="Title" siteName=true %}</title>

WhensiteName=trueWhen, the system will automatically add the website name to the end of the current page title, for example: "Article Title - Your Website Name."

Custom title separator

By default, the page title and website name are separated by a hyphen-to separate. If you want to use a different symbol, such as an underscore_or a vertical line|can be accessed throughsepSet the parameter:

<title>{% tdk with name="Title" siteName=true sep="_" %}</title>

This will display your page title as: "Article Title_Your Website Name".

Display parent category title

In some cases, especially for deeply nested category pages, you may want the title to include the name of the parent category to provide more complete context information. At this time, you can useshowParent=trueparameters:

<title>{% tdk with name="Title" siteName=true showParent=true %}</title>

For example, if your category structure is "Product > Electronic Products > Phone", when you visit the "Phone" category page, the title may display as: "Phone - Electronic Products - Your website name."}

Set the title in different page types

Considering the template file structure of AnQiCMS, you usuallybase.htmlin such a public template file<head>set the title in the regional area. BecauseextendsTags are the foundation of template inheritance, allowing you to define a global skeleton and override specific parts as needed in child templates.

For example, in yourbase.htmlthe file<head>The part can be set like this:

<!DOCTYPE html>
<html lang="{% system with name='Language' %}">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{% tdk with name="Title" siteName=true sep=" - " showParent=true %}</title>
    <meta name="keywords" content="{% tdk with name="Keywords" %}">
    <meta name="description" content="{% tdk with name="Description" %}">
    {%- tdk canonical with name="CanonicalUrl" %}
    {%- if canonical %}
    <link rel="canonical" href="{{canonical}}" />
    {%- endif %}
    <!-- 其他头部信息 -->
    <link rel="stylesheet" href="{% system with name="TemplateUrl" %}/css/style.css">
</head>
<body>
    <!-- 网站内容 -->
</body>
</html>

After this setting:

• Home (index.html):The title will display as "The title you set in the TDK settings on the backend home page - Your website name".
• Article/Product Details Page (archive/detail.html):The title will be displayed first according to the 'SEO title' of the article or product.If not set, then display the title of the article/product itself and add the website name.For example: “In-depth analysis of AnQiCMS template creation - Your website name”.
• Category list page (category/list.html):The title will display as the "SEO Title" (or category name) and append the website name. IfshowParent=trueIt will also include the parent category name. For example: "Electronic Products Category - Your Website Name".
• Single page (page/detail.html):The title will display as the 'SEO Title' (or page name) of a single page, along with the website name. For example: 'Contact Us - Your Website Name'.

In this way, you do not need to repeat the logic on each page template, justbase.htmlconfigure once, and you can achieve standardized and automated management of the entire site page titles.

Frequently Asked Questions (FAQ)

1. I modified the 'Website Name' in the background 'Global Settings', why hasn't the page title changed?

Make sure you are using it in the<title>tag correctlysiteName=truefor example:<title>{% tdk with name="Title" siteName=true %}</title>If this parameter is not provided, or the parameter isfalseThe system will not automatically append the website name. Additionally, after changing the background settings, it may be necessary to clear the website cache or refresh the page to see the latest effects.

2. Why are some page titles long while others are short and do not include the website name?

This usually has to do with the priority of the title. If a page (such as an article, category, or single page) has set the "SEO title" during editing, and you did not specify it intdkthe tags.siteName=trueOrsiteNameWithfalseIf the system will only display the custom "SEO title" without appending the website name. To ensure that the website name is appended to all pages, make sure yourbase.htmlin the filetdktag includessiteName=trueParameter.

3. How do I make certain pages not display the website name suffix?

If you only want a few specific pages not to display the website name suffix, you can use the overlay strategy. In the templates of these specific pages (for examplearchive/detail.htmlorpage/detail.html), you can redefine<title>Label, andsiteNamethe parameter tofalse:

{# 在特定页面的模板中，例如 archive/detail.html #}
{% extends 'base.html' %}

{% block title %}
    {# 覆盖 base.html 中的标题设置，不附加网站名称 #}
    <title>{% tdk with name="Title" siteName=false %}</title>
{% endblock %}

{# 其他内容块 ... #}

Or, directly enter the complete title, including or not including the website name, in the 'SEO Title' field, as it has the highest priority.