How to accurately call the navigation links under the new navigation category after creating it in the template?

AnQiCMS is an efficient content management system, one of its core advantages lies in its powerful content organization and template customization capabilities.As a website person proficient in AnQiCMS operation, I know the importance of a flexible navigation system for user experience and website structure optimization.When you create a new navigation category in the background and want to present it accurately on the website front-end template, AnQiCMS provides intuitive and powerful template tags to meet this need.

Understanding the navigation management mechanism of Anqi CMS.

In the AnQiCMS management backend, the navigation system is highly configurable.You can access the 'Navigation Settings' under 'Background Settings' to manage the website's navigation structure.Here not only has the system default main navigation, but it also allows you to create custom navigation areas through 'Navigation Category Management'.For example, in addition to the conventional top navigation, you may also need a navigation specifically designed for the footer, sidebar display, or a specific marketing campaign.

Creating a new navigation category is a very simple process: Click on "Navigation Category Management" page, then click "Add New Navigation Category", and name your new navigation category (for example, "Footer Navigation") and save. After saving, the system will assign a unique identifier to this new category, namelytypeIdAfter that, you can add specific navigation links to this new category just like you would manage other navigation.These links can be to the "category page link" of the in-site article classification, the "built-in link" to specific content, or the "external link" to external websites, fully satisfying your content display needs.

Core: The key tag for invoking custom navigationnavList

In the template system of AnQiCMS,navListThe tag is a core tool for retrieving and rendering the navigation list. This tag is designed to be very flexible, allowing you to accurately retrieve any defined navigation category according to your needs.navListThe power of labels lies in itstypeIdThis is the bridge that associates the specific navigation category created in the background with the frontend template. After creating a new navigation category in the background, the system will assign one to ittypeId. In the template, you just need to specify thistypeId,navListtag to accurately retrieve all navigation links under the category.

navListThe usage method of the tag is usually{% navList 变量名称 with typeId="您的导航类别ID" %}, and ends with:{% endnavList %}end. You can use within the tag.forLoop to traverse the obtained navigation items. Each navigation item (usually named in the loop)item) contains a series of useful properties, such asTitle(Navigation title),Link(navigation link),IsCurrent(Whether the current page link is), and for handling multi-level navigation,NavListetc.

The steps to accurately call the new navigation category in the template

To display the new navigation category you created in the AnQiCMS backend on the website front end, you need to follow the following steps:

First, in your AnQiCMS backend, go to "Backend Settings" -> "Navigation Settings". In the "Navigation Category Management" section, find the new navigation category you just created (such as "Footer Navigation") and note down the correspondingtypeIdThis ID is automatically generated by the system and is the unique identifier for calling the navigation. Assume thistypeIdIs2The default navigation is usually1The newly created will be other numbers). Next, make sure you have added at least one navigation link to the new navigation category.

Then, open the template file you want to display this navigation. AnQiCMS template files are usually located in/templateIn the directory of your theme folder. For example, if you want to display this navigation in the footer of the website, you may need to editpartial/footer.htmlorindex.htmletc. Insert at the position where you want to display the navigationnavListLabel, and throughtypeIdParameters specify the navigation category ID you recorded.

A typical call example would be like this:

<nav class="footer-nav">
    <ul>
        {% navList footerNavs with typeId="2" %} {# 假设您的“页脚导航”的 typeId 是 2 #}
        {%- for item in footerNavs %}
        <li class="footer-nav-item {% if item.IsCurrent %}active{% endif %}">
            <a href="{{ item.Link }}" title="{{ item.Title }}">{{item.Title}}</a>
            {%- if item.NavList %} {# 如果存在子导航 #}
            <ul class="sub-footer-nav">
                {%- for subItem in item.NavList %}
                <li class="sub-footer-nav-item {% if subItem.IsCurrent %}active{% endif %}">
                    <a href="{{ subItem.Link }}" title="{{ subItem.Title }}">{{subItem.Title}}</a>
                </li>
                {% endfor %}
            </ul>
            {% endif %}
        </li>
        {% endfor %}
        {% endnavList %}
    </ul>
</nav>

In this example,footerNavsIs the variable name you define for the navigation list,typeId="2"This ensures that the link being accessed is under the "Footer Navigation" category you created. ThroughforLoop throughfooterNavseach one in theitemYou can accessitem.Titleanditem.LinkTo generate navigation links. At the same time, throughitem.IsCurrentproperty, you can add a special CSS class to the navigation item corresponding to the current visited page (for exampleactiveThus, enhancing the user's perception of the current location. If your navigation category supports secondary navigation,item.NavListthe properties will also include a sub-navigation list, you can nestforto render them in a loop.

After completing the template modification, save the file. If your AnQiCMS has enabled template caching, you may need to clear the cache in the "Update Cache" feature on the backend to ensure that the changes take effect immediately.Refresh your website page, and you will find that the new navigation categories have been presented on the front end according to your design.

**Practice and Precautions

In practice, to better manage and maintain the website, it is recommended to use clear and explicit names for different navigation categories and to correspond accurately in the templatetypeId. At the same time, to make use ofitem.SubTitleoritem.DescriptionProperties such as, you can add more auxiliary information to navigation links to enrich the user experience. In a multi-site environment,navListTags also supportsiteIdParameter, allows you to retrieve navigation data under a specific site, which is particularly important for managing enterprises with multiple sub-sites or multi-language sites.

In this way, AnQiCMS greatly simplifies the process of creating and invoking custom navigation, allowing website operators to focus more on content presentation and user experience optimization, rather than on cumbersome code writing.

Frequently Asked Questions (FAQ)

How to determine the navigation category I have just createdtypeId?The AnQiCMS backend will not usually display directly when you create a new navigation categorytypeId. You can first create a new navigation category and add some links to it. Then, you can check the tables in the database related to navigation such asnav_typeOr a similar table structure, the specific table name may vary depending on the version), or in some cases, by viewing the source code of the backend page, you can find the ID corresponding to the new navigation category.The most direct method is to click on 'Edit your new navigation category' on the 'Navigation Settings' page, usually the URL will contain the ID of the navigation category.

My navigation link is not displayed in the template, how should I investigate?First, please checktypeIdIs it correct. Make sure you are innavListin the tag usedtypeIdIt is completely consistent with the actual navigation category ID created on the back-end.Secondly, confirm that the navigation category you are calling has indeed added navigation links.If the link is empty, the front end will naturally not display any content.In addition, check if the template file path is correct, as well as whether there are syntax errors causing the template to fail to parse.Finally, don't forget to clear the AnQiCMS system cache to ensure that the latest templates and data are loaded.

navListDoes the tag support creating navigation menus with more than two levels?According to AnQiCMS design,navListThe label currently supports up to two levels of navigation links. This means you can have a main navigation, as well as a sub-navigation under the main navigation.If you need a deeper level of navigation structure, you may consider custom template logic, or design the sub-navigation as an independent navigation category, and combine it with JavaScript to implement more complex interaction effects on the front end.