In website content operation, a clear navigation path is crucial for user experience and search engine optimization.A good breadcrumb navigation can help users quickly understand the current page's position in the website structure and make it convenient for them to backtrack to the previous level or higher-level pages.autoCMS (AnQiCMS) fully understands this point, therefore it provides a powerful and easy-to-use breadcrumb navigation feature, allowing website administrators to easily generate and display multi-level breadcrumbs.

The core of implementing breadcrumb navigation in Anqi CMS lies in its built-inbreadcrumbLabel.This tag is designed to automatically generate the complete path from the current page to the homepage, greatly reducing the workload of template development.It will intelligently recognize the type of the current page (such as article detail page, category list page, or single page) and automatically build a navigation chain containing all parent paths based on the actual hierarchical structure of the website.

to usebreadcrumbLabel, you just need to insert the corresponding code at the appropriate position in the website template.usually, this is placed at the top content area of each page, near the bottom of the main navigation bar.{% breadcrumb crumbs with index="首页" title=true %}.crumbsis the variable name you define for the breadcrumb list, you can traverse this variable in the loop to display each navigation item.forloop to display each navigation item.

breadcrumbThe label provides several practical parameters, allowing you to flexibly control the display of breadcrumbs:

  • indexParametersThis parameter is used to define the name of the starting point of the breadcrumb navigation, which is the "home page" of the website. The default value is "home pageindex="我的网站主页".
  • titleParameters:It determines how the current page title is displayed in the breadcrumb navigation. If set totrue(default), the breadcrumb will include the full title of the current page. If set tofalse, then the current page title will not be displayed. In addition, you can also pass a custom string, such astitle="当前文章", then the last breadcrumb item will display the text you specify.
  • siteIdParametersFor users who have used the Safe CMS multi-site management function, this parameter can be used when you want to obtain data from other sites.In most cases, this parameter can be omitted, and the system will automatically recognize the current site.

For example, in your template file (such asbash.htmlor a specific page.detail.html)中,可以这样来渲染面包屑:

<div>
    <ul class="breadcrumb">
        {% breadcrumb crumbs with index="我的网站" title=true %}
        {% for item in crumbs %}
            <li>
                {% if forloop.Last %}
                    <span>{{item.Name}}</span>
                {% else %}
                    <a href="{{item.Link}}">{{item.Name}}</a>
                {% endif %}
            </li>
        {% endfor %}
        {% endbreadcrumb %}
    </ul>
</div>

In this code,forThe loop will iterate over thecrumbs变量中的每一个导航项。item.Link会获取该导航项的链接地址,item.Name则会获取其显示名称。我们还通过forloop.LastDetermine whether the current loop is the last element, usually the last item in the breadcrumb navigation is not linked, or it is displayed in a different style to indicate the current page clearly.

Anqi CMS'sbreadcrumbLabels can implement multi-level navigation, thanks to its good support for the hierarchical relationship between content models, categories, and documents.When you create a category, you can specify its parent category to build a clear tree structure.Articles and products are always categorized.breadcrumbLabels will automatically track these hierarchical relationships during parsing, for example, starting from the article detail page, it will first find the category to which the article belongs, then find the parent category of that category, and so on until the homepage of the website, thereby dynamically generating the complete path.This automated processing method greatly simplifies the website's structural maintenance and ensures consistency in navigation.

Reasonably using breadcrumb navigation can greatly enhance the browsing experience of users on the website, reduce the feeling of disorientation, and also have a positive impact on search engine optimization (SEO).It helps search engines better understand the hierarchy and association between web page content through clear internal link structures, improving page crawling efficiency.At the same time, breadcrumb navigation usually includes keywords, further enhancing the relevance of the page and helping to improve search engine rankings.breadcrumb标签正是这一理念的体现,它将复杂的技术细节封装起来,让运营者能够专注于内容的创作和用户体验的优化。

Common Questions (FAQ)

1. How do I fix it if my breadcrumb navigation does not display or displays incorrectly?

Firstly, please check if your template file is using it correctlybreadcrumbtags, including{% breadcrumb crumbs ... %}and the following{% for item in crumbs %}Loop structure.Next, confirm that your content (article, category) has been correctly set with the associated category and hierarchy.For example, an article must be associated with a category to correctly display its path.Finally, clear the system cache (in the background "Update Cache" feature) and the browser cache. Sometimes, cache issues can cause new template code or data updates not to take effect in a timely manner.

2. Does the breadcrumb navigation of Safe CMS support manual addition of custom links or modification of automatically generated levels?

breadcrumbnavListLabels (used for custom navigation lists) or directly write static links in the template, rather than relying onbreadcrumbLabel.

3. In certain specific pages, I only want to display a simple 'Home > Current Page' two-level breadcrumb, is it possible?

It is possible. You canbreadcrumbTagstitleparameter settingsfalseOr a custom phrase to control the display of the current page. You can also use it when iterating overcrumbsvariables by making judgmentsforloop.Firstorforloop.LastSelectively display or hide the middle-level breadcrumb. For example, you can only display the first and lastitem, or based onitem.Linklength oritem.NamePerform a translation, only output the level you want to display.However, the most direct way is to render the simplified breadcrumb code conditionally based on the page context (for example, by using template variables to determine whether the current page is the homepage or a specific type of detail page), or to completely hide the breadcrumb.