How to embed Breadcrumb navigation (`BreadcrumbList`) structured data in Json-LD?

Embed breadcrumb navigation in Json-LD (BreadcrumbList) Structured Data: AnQiCMS Practice Guide

As an experienced website operations expert, I am well aware of the importance of structured data in modern SEO optimization.It not only helps search engines better understand the content of the page, but also has the opportunity to obtain "rich snippets" in the search results, thereby improving click-through rates and bringing more high-quality traffic.BreadcrumbListStructured data is a point of optimization that we cannot ignore.

Today, we will delve into how to elegantly embed breadcrumb structured data in Json-LD format using the powerful template functions and built-in tags of AnQiCMS (AnQiCMS).This not only makes your website structure clearer, but also further optimizes its performance in search engines.

WhyBreadcrumbListStructured data is so important?

In website operation, breadcrumb navigation usually exists in the form of "Home u003e Category u003e Subcategory u003e Current Page", which clearly shows the user's position in the website.This is an excellent navigation aid for users, helping them understand the website structure and easily return to the previous level page.

For search engines, especially mainstream search engines like Google,BreadcrumbListStructured data plays a more critical role. By embedding Json-LD data that conforms to Schema.org standards in the page code, we can:BreadcrumbListJson-LD data, we can:

1. Define the website hierarchy:Directly inform the search engine of the page organization, helping it to better crawl and index content.
2. Improve the visibility of search results:Google may replace the traditional URL with breadcrumb paths in search results, making the search results more attractive. Users can immediately see the position of the page within the website, thereby increasing the click-through rate.
3. Improve user experience:Even if breadcrumbs are not displayed directly on the page, their structured data can provide users with more accurate contextual information at the search engine level.

AnQi CMS forBreadcrumbListProvided unparalleled support

Anq CMS is an enterprise-level content management system developed in Go language, which took full consideration of SEO optimization needs from the beginning of its design. It provides a flexible template engine and rich built-in tags, which makes it easier for us to handleBreadcrumbListIt has great convenience when structuring data.

The core lies in two powerful tags:

• {% breadcrumb %}Tags:This label can intelligently parse the current page URL path, automatically return a list of complete breadcrumb path data. Each element in this list contains the link name (NameAnd the corresponding URL (Link) perfectly fits the constructionBreadcrumbListThe required core information.
• {% jsonLd %}Tags:A highlight of AnQiCMS is its native support for Json-LD. Through{% jsonLd %}Label, you can insert any valid Json-LD code in the template.It's even better that it supports a merge mechanism, where you can define custom fields that will be merged with the default Json-LD data generated by the system, thus achieving a high degree of customization.

The combination of these two tags, we can embed in AnQiCMS.BreadcrumbListStructured data paved the way.

Practical: Embedding in AnQiCMS templateBreadcrumbListJson-LD

Now, let's implement step by step in AnQiCMS templateBreadcrumbListStructured data embedding. Typically, this code is placed in the public header file of a website, for exampletemplate/你的模板目录/partial/header.htmlortemplate/你的模板目录/bash.htmlIn this way, it can be automatically loaded on each page.

Step one: Get breadcrumb navigation data

Firstly, we need to utilize{% breadcrumb %}The tag retrieves the breadcrumb path data of the current page. This tag will store the parsed breadcrumb entries in a variable you specify, for examplecrumbs.

{% breadcrumb crumbs with index="首页" title=true %}
{# `crumbs` 变量现在包含了面包屑列表数据 #}

here,index="首页"Defined the display name of the home page in the breadcrumb path, whereastitle=truethen it indicates that when in the document detail page, the current document title will be the last item in the breadcrumb.

Step two: BuildBreadcrumbListThe JSON-LD structure

Next, we will use{% jsonLd %}Tags to enclose our Json-LD code. Within this tag, we will traversecrumbsA variable, and structured according to Schema.org'sBreadcrumbListspecifications to build a JSON structure.

BreadcrumbListThe core isitemListElementAn array, each element representing a breadcrumb entry, containing@type(ListItem),position(Location in path),name(Display name) anditem(Link URL).