How to set custom title attributes ( `title `) for the home and end page links in AnQiCMS?

AnQiCMS (AnQiCMS) as an efficient and flexible content management system, while providing powerful functions, also pays attention to many details in website operations, such as links oftitleProperty settings.titleAlthough the attribute is not directly visible on the page, it plays a "touch of color" role in improving user experience, assisting search engines in understanding link content, and enhancing website accessibility.It can provide additional information to visitors hovering over the mouse, and also provides navigation context to screen reader users.

Today, let's delve into how to cleverly set custom links for the homepage and endpage in AnQiCMS.titleAttribute, let your website show professionalism in detail.

Understand the link data structure in AnQiCMS

In AnQiCMS, whether it is a navigation menu created through the backend or a list generated dynamically through tags, the system will maintain a set of structured data for each linkable entity (such as articles, products, categories, single pages, etc.). This data usually includes a link address (LinkDisplay textTitleDescription informationDescriptionAnd some other related attributes (such as the image'sAltText). It is these built-in data fields that allow us to flexibly customize the linkstitleProperties provide a solid foundation.

Navigation links at the home and end pages.titleProperty customization

The homepage and footer often carry the most important navigation structure and core content entry of a website. In AnQiCMS, these navigation links are usually managed through the "website navigation settings" feature and throughnavListTemplate tags are rendered on the front end.

Backend configuration: Assign a 'description' to the navigation link.

Firstly, we need to add the corresponding description information for the navigation link in the AnQiCMS backend. Enter.“Back-end Settings” -> “Website Navigation Settings”. Here, you will see various navigation categories you have created, such as “Default Navigation” or the custom “Footer Navigation”.

Click to edit a specific navigation link, and you will find a field named 'Navigation Description' here. This is where you set your linktitleThe position of the attribute. For example, if your navigation item is 'About Us', you can fill in 'Learn about the mission and vision of Anqi CMS' in the 'Navigation Description', or 'View our team and development history'.These descriptions will be displayed as tool tips when the mouse hovers over them, enhancing user experience and providing richer context for search engines.

Template Implementation: Smart UsenavListTag

In your front-end template file (usually the homepage templateindex.htmlor public headerpartial/header.html, public footerpartial/footer.html), you may have usednavListtag to render the navigation menu.

navListA tag will return an array containing multipleitem) with eachitemcarryingTitle(Display name),Link(link addresses) as well as the keyDescription(Navigation description). In the template, we can do it like this toitem.Descriptionbind the value dynamically to the link'stitleattribute:

{# 示例：渲染主导航菜单 #}
{% navList navs with typeId=1 %}
    <ul>
        {%- for item in navs %}
            <li>
                <a href="{{ item.Link }}" title="{{ item.Description }}">{{ item.Title }}</a>
                {# 如果存在子导航，这里可以继续循环 inner.NavList #}
                {%- if item.NavList %}
                <dl>
                    {%- for inner in item.NavList %}
                        <dd>
                            <a href="{{ inner.Link }}" title="{{ inner.Description }}">{{ inner.Title }}</a>
                        </dd>
                    {% endfor %}
                </dl>
                {% endif %}
            </li>
        {% endfor %}
    </ul>
{% endnavList %}

{# 示例：渲染页脚导航（假设你有一个typeId=2的页脚导航） #}
{% navList footerNavs with typeId=2 %}
    <ul class="footer-links">
        {% for item in footerNavs %}
            <li><a href="{{ item.Link }}" title="{{ item.Description }}">{{ item.Title }}</a></li>
        {% endfor %}
    </ul>
{% endnavList %}

In this way, the navigation description configured on the back-end will elegantly appear in the front-end linktitlethe attribute.

Linked to dynamic contenttitleProperty customization

In addition to fixed navigation links, the homepage and footer often display the latest articles, popular products, friendship links, or brand partners, and other dynamic content. This content is usually througharchiveList/pageList/linkList/bannerListTag dynamic call.

Content management: enrich the description of links.

For articles, products, single pages, categories, tags, and other content, AnQiCMS usually provides fields such as "Document Description" (Description), "SEO Title" (SeoTitle), or "Tag Description" in the background editing interface. For image link types (such as Banner), there will beAltText field. These can be used to fill in linkstitleValuable resources of properties

• Article/Product/Single page:When editing a document or page, be sure to carefully fill in the "Document Summary" or "SEO Title" in addition to filling in the title.
• Categories/Tags:When creating or editing a category/label, fill in the "category profile" or "label description".
• Friendship Links:Under the function management, each link in the "Friendship Link" has a "Link Name" and a "Link Note", the latter is a good place to settitleproperties.
• Home page Banner:In image resources or specific Banner management, the image'sAlttext and description fields can be used astitlethe source of the attribute.

Template implementation: Apply properties in a loopitemof the attribute

When you usearchiveList/pageListorlinkListWhen a label loop displays content, each loop item (item) contains its own