In Anqi CMS template design, dynamically displaying the document title of the current page is a fundamental and important feature.It not only concerns the intuitive feeling of users when browsing the website, but is also an indispensable part of search engine optimization (SEO) strategy.A quiet CMS provides a concise and efficient way to meet this need, let's explore how to flexibly use it in templates.
Understanding the template context of AnQiCMS
In AnQi CMS template rendering mechanism, the system intelligently provides the relevant data context for each page.This means that when you visit a document detail page, all the information of the document (including title, content, category, etc.) will be encapsulated in a specific variable and can be used directly in the template.
The most direct way to obtain the document title
For the document detail page, Anqi CMS usually maps all the data of the current document to a name calledarchiveon the template variable. Therefore, the most direct and most commonly used method to dynamically display the title of the current document is to use it directly in the template.{{ archive.Title }}.
For example, if you want to display a large title (usually) at the top of the document content<h1>label), you can write it like this:
<h1>{{ archive.Title }}</h1>
Herearchiverepresenting the document object of the current page,TitleThis is the title field of the document object. This method is concise and clear, and is the preferred method for handling the document title of the current page.
UsearchiveDetailTag to get the document title
In addition to accessing the context variable directlyarchive，SafeCMS also provides powerfularchiveDetailtags to get detailed information about documents. Although{{ archive.Title }}It is already very convenient, but in some scenarios, such as when you need more fine-grained control, or to obtain the title of a specific document that is not on the current page,archiveDetailtags are particularly useful.
Get the current page document title:
When you use the parameter on the document detail pagearchiveDetailtags, if omittedidortokenIt will default to getting the document information of the current page. To get the title, you can specifyname="Title":
<p>当前文档标题：{% archiveDetail with name="Title" %}</p>
Get the title of the specified document:
If you need to display the title of a specific document on other types of pages (such as the homepage, category list page) you can specify the document throughidortokenparameters to specify the document:
<p>ID为1的文档标题：{% archiveDetail with name="Title" id="1" %}</p>
Of course, you can also assign the retrieved title to a custom variable so that it can be used multiple times in the template or for further processing:
{% archiveDetail myDocTitle with name="Title" %}
<p>我的自定义标题变量：{{ myDocTitle }}</p>
In<title>Used in tagstdkLabel optimizes page title
Page's<title>Tags are the first window through which search engines and users understand the theme of a page. Anqicms provides this fortdkThe tag can dynamically retrieve the title of the current page and can flexibly combine the website name with a custom separator to achieve better SEO effects and user experience.
usually,you will in the template<head>partly usedtdktag to build the complete page title:
<head>
<meta charset="UTF-8">
<title>{% tdk with name="Title" siteName=true sep=" - " %}</title>
<!-- 其他 meta 标签或 CSS 链接 -->
</head>
Here:
name="Title"indicationstdktag to get the document title of the current page.siteName=trueThe website name will be automatically appended to the document title (configured in the background system).sep=" - "Then it defines the separator between the document title and the website name, you can set it to other characters as needed, such as_or|.
Bytdktags, you can ensure that each page has<title>It includes the core document title, while also considering brand recognition and SEO requirements. If the current document has set the "SEO title",tdkThe tag will prioritize using this custom SEO title, thereby providing stronger SEO optimization capabilities.
Integrated application: Display the document title correctly on the page.
In actual website design, we usually combine these methods to ensure that the page title is displayed appropriately in different positions.
A typical page structure may look like this:
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>{% tdk with name="Title" siteName=true sep=" - " %}</title>
<meta name="keywords" content="{% tdk with name="Keywords" %}">
<meta name="description" content="{% tdk with name="Description" %}">
<!-- 引入样式文件 -->
<link rel="stylesheet" href="{% system with name="TemplateUrl" %}/css/style.css">
</head>
<body>
<!-- 网站顶部导航和Logo等内容 -->
<header>
<a href="{% system with name="BaseUrl" %}">
<img src="{% system with name="SiteLogo" %}" alt="{% system with name="SiteName" %}">
</a>
<!-- 其他导航链接 -->
</header>
<main>
<section class="document-detail">
<!-- 当前页面的文档大标题 -->
<h1>{{ archive.Title }}</h1>
<!-- 文档的其他元信息，如发布时间、分类等 -->
<div class="meta-info">
<span>发布于：{{ stampToDate(archive.CreatedTime, "2006-01-02") }}</span>
<span>分类：<a href="{% categoryDetail with name="Link" id=archive.CategoryId %}">{% categoryDetail with name="Title" id=archive.CategoryId %}</a></span>
</div>
<!-- 文档内容，通常需要 |safe 过滤器以防止HTML被转义 -->
<div class="content">
{{ archive.Content|safe }}
</div>
</section>
</main>
<!-- 网站底部信息 -->
<footer>
<p>{% system with name="SiteCopyright" %}</p>
<a href="https://beian.miit.gov.cn/" target="_blank">{% system with name="SiteIcp" %}</a>
</footer>
</body>
</html>
In this example, we usetdkThe tag is for the entire HTML document's<title>Element dynamically generates the title, and at the same time passes through the page content area{{ archive.Title }}To display the H1 large title of the document. This approach meets the requirements of SEO and also provides a clear page structure for users.
By using the above method, you can easily dynamically display the document title of the current page in the Anqi CMS template, thereby building a more attractive and SEO-friendly website.The strength and flexibility of AnQi CMS are manifested in these seemingly trivial but crucial functional implementations.
Frequently Asked Questions (FAQ)
1. Why to use on a certain page{{ archive.Title }}Does not display any content?
Answer:This is usually because the page you are visiting is not the document detail page, or the current page context has not mapped the document information toarchivethe variable.archiveVariables are mainly available on document detail pages (such as article, product detail pages). If you try to use them directly on other types of pages (such as home pages, category list pages, single pages){{ archive.Title }}It may be empty. On these pages, you may need to usearchiveListtags to loop through the document list, or usepageDetail/categoryDetailtags to get the title of the page or category.
2. I want the page on theH1The title and the title displayed in the browser tab (<title>) are different, can AnQi CMS achieve this?
Answer:Yes, this can be achieved completely. The title displayed in the browser tab (<title>) is usually bytdkLabel generation, it can optionally use the document's 'SEO title' (if set) or the default title, and concatenate the website name. While the page content containsH1the title can be used directly{{ archive.Title }}To display the original title of the document, or if you set the "SEO title" when you publish the document in the background, and you wantH1Also use this SEO title, then in the document detail page,{{ archive.SeoTitle }}you can also get it. In this way, you can optimize the title display separately for SEO and user experience.
3. In addition to the document title, I can also get througharchiveWhat information can the variable get from the document?
Answer: archiveThe variable is an object that contains all the information of the current document. In addition toTitle(Title), You can also get many other useful fields, such as:archive.Content(Document content),archive.Description(Document summary),archive.Keywords(Keywords),archive.CreatedTime(Publish time),archive.Views(Views),archive.Link(Document Link),archive.Thumb(Thumbnail) etc. Specific field names available can be checked in thetag-/anqiapi-archive/142.htmldocument.nameThe available field list parameter.