Can I set multiple Banner groups in AnQiCMS and display them at different positions separately?

In AnQiCMS, you can completely set up multiple Banner groups and display them flexibly in different positions according to the website layout.AnQiCMS provides a multi-dimensional way to manage and call these important visual elements to help you better organize website content and attract visitors.

One, the core concept of Banner management in AnQiCMS

AnQiCMS demonstrates high flexibility and customization in Banner management.It not only allows you to configure exclusive Banner carousels for specific parts of the website (such as category pages or single pages), but also supports creating and naming different Banner groups through a unified Banner management mechanism, so that they can be called at any location on the website.This design is aimed at meeting various content display needs, whether it is the large carousel on the homepage, the thematic recommendation on the article list page, or the promotional information on the product detail page, a suitable solution can always be found.

Two, how to set up Banner in AnQiCMS backend: two main methods

AnQiCMS offers two main banner setting methods to accommodate different management granularity and display scenarios.

1. Add a Banner for Specific Pages and Categories

For category pages and independent single pages on the website (such as "About Us", "Contact Information", etc.), AnQiCMS allows you to upload exclusive Banner images directly in the editing interface of these pages.

  • Category Banner SettingsIn the background, go to the "Content Management" -> "Document Category" page, and when editing or creating a new category, you will see an option for a "Banner Image".Here, you can upload multiple images, which will be used as the exclusive Banner carousel for the category page.The system will suggest using pictures of the same size to maintain consistency in display.
  • Single Page Banner SettingsSimilarly, when editing or creating a single page under "Page Resources" and "Page Management", there is also a "Banner Image" area.You can upload multiple images for each single page, and these images will be used as the carousel banner for that page.

This approach's advantage lies in the close binding of the Banner with specific content entities, making it convenient for management and content association.

2. Create and manage custom Banner groups

In addition to the page and category-specific Banners, AnQiCMS also allows you to create generic, named Banner groups. Although the document does not directly display the specific menu path for "Banner Group Management", it can be inferred from the design of the template tags (especiallybannerListin the labeltypeParameters can be inferred, there is a centralized Banner management entry there:

  • Define the group nameFor example, you can create different groups named "Home Main Carousel", "Product Page Promotion", "Sidebar Advertisement", etc.
  • Upload images to the group: Upload the pictures you want to display in a specific group to the corresponding group, and you can set links, descriptions, and Alt text for each picture.

In this way, you can manage banners that are not attached to a specific category or page uniformly, and call these groups at any required location on the website.

Three, call the Banner on the website front-end as needed: flexible template tags

AnQiCMS through intuitive template tags, allows you to easily call different types of Banners on the website front-end.

1. Call page/category exclusive Banner

When you need to display the exclusive Banner on the category page or single page, you can use the corresponding detail tag to obtain the image data.

  • Call category BannerIn the template file of the category (such as{分类模型}/list.htmlIn it, you can usecategoryDetailGet the details of the current category by tag, andImagesField to get the list of banner images.

    {% categoryDetail categoryImages with name="Images" %}
    {% if categoryImages %} {# 判断是否有Banner图 #}
    <div class="category-banner-slider">
        {% for image in categoryImages %}
        <img src="{{ image }}" alt="分类Banner" />
        {% endfor %}
    </div>
    {% endif %}
    
  • Call single page BannerIn the single-page template file (for examplepage/detail.htmlIn it, you can usepageDetailtag to get the details of the single page and throughImagesField to get the list of banner images.

    {% pageDetail pageImages with name="Images" %}
    {% if pageImages %} {# 判断是否有Banner图 #}
    <div class="page-banner-slider">
        {% for image in pageImages %}
        <img src="{{ image }}" alt="单页面Banner" />
        {% endfor %}
    </div>
    {% endif %}
    

2. Call the custom Banner grouping

You can use the general Banner group created in the backgroundbannerListCall the tag.

  • Call the default groupIf you do not specify a specific group name for Banner, it will default to the "default" group.

    {% bannerList banners %} {# 调用默认分组Banner #}
    <div class="default-banner-slider">
        {% for item in banners %}
        <a href="{{item.Link}}" target="_blank">
            <img src="{{item.Logo}}" alt="{{item.Alt}}" />
            <h5>{{item.Title}}</h5> {# 如果有标题内容 #}
        </a>
        {% endfor %}
    </div>
    
  • **Call