How to get and display the carousel or advertisement images on the homepage using the `bannerList` tag?

In the operation of a website, the homepage carousel or advertising images are undoubtedly the golden area to attract visitors' attention, convey core information, and promote important content.They not only enhance the visual appeal of a website, but are also key to guiding user behavior and promoting content consumption.bannerList.

bannerListThe design初衷 of the tag is to help website managers easily obtain and display the carousel image collections configured in the background.It allows you to flexibly display these carefully designed images at any location on the website, especially in the key areas of the homepage, bringing your website content to life.

To usebannerListLabel, first you need to understand its basic structure and working mode.It will package all the image data that meets the conditions from the background into a list (or an array), which you can iterate over and display in the template.bannersthen cooperate withforLoop through each image in the list one by one:

{% bannerList banners %}
    {# 这里是您循环输出每个 banner 详情的代码块 #}
{% endbannerList %}

In this code block,bannersThat is the name specified for the carousel list we obtain. When you usefor item in bannersthis structure,itemit will represent the detailed data of a picture or advertisement in each loop.

bannerListThe tag also provides some parameters that allow you to finely control which images to retrieve:

• typeparameters:This isbannerListOne of the core functions of the label.In the Anqi CMS backend management interface, you can set a 'group name' for each uploaded carousel image or advertisement image.For example, you can create a group named "Home Slide" for the home page image carousel, and then create a "Sidebar Ad" group for displaying small promotional images.typeFor example, parameters,{% bannerList banners with type="首页幻灯" %}Thus,bannersThe variable will only include all images under the "Home Slider" group. This grouping mechanism greatly enhances the flexibility of image management.
• siteIdparameters:If your Anqi CMS system is configured with multi-site management functionality and you want to call the carousel data of another site in the current template, you can usesiteIdParameters are used to specify the ID of the target site. For most single-site users, this parameter is usually set to default and does not require manual setting.

OncebannerListTags retrieve image data.bannersIn the variable, you can pass throughitemAccess the detailed properties of each image to build a complete HTML structure:

• item.Id:The unique identifier ID of each image in the system.
• item.Logo:This is the actual URL of the carousel or advertisement image, you need to put it in<img>label'ssrcthe attribute.
• item.Link:If this image needs to jump to another page after clicking, the target link is stored here.
• item.Alt:Image alternative text (Alt Text), which is important for website SEO and accessibility improvement