How to set up image or video resources for the home page Banner in Anqi CMS backend?

Calendar 👁️ 58

As an experienced website operations expert, I am happy to provide you with a detailed explanation of how to set up image or video resources for the home page banner on the Anqi CMS backend, and offer some practical content operation suggestions.AnQi CMS, with its simple and efficient design philosophy, provides users with powerful and flexible content display capabilities, and the home page Banner is a key element that attracts users' attention.


Optimize the website facade: Set the homepage Banner image and video resources in the Anqi CMS backend

The homepage banner is the 'face' of the website, not only carrying the display of the brand image, but also an important area to attract users, convey core information, and guide user behavior.Our CMS is well-versed in this field, providing an intuitive and feature-rich Banner management function, allowing you to easily configure captivating image or video sliders for the homepage of your website.

Anqi CMS Banner feature overview

In Anqi CMS, the settings of the home page Banner mainly revolve around its powerfulTemplate tag systemExpanding, especiallybannerListThe tag allows you to flexibly call the Banner list configured in the background template. It is worth mentioning that AnQiCMS supports the operation of BannerGroup ManagementThis means you can create independent banner groups for different display scenarios (such as home page banners, event page banners, sidebar advertisements, etc.) andtypeParameters are called. Each Banner item can not only be static images but also more attractive video resources, and can be configured with jump links, descriptions, and Alt text for better content marketing and SEO optimization.

Back-end operation process: easily configure the home page Banner

To set a Banner for your Anqi CMS website home page, you can follow the following steps:

Step 1: Prepare high-quality image or video materials

Before setting up the banner, make sure you have prepared beautiful and clear images or video files.Please note that the size and proportion of the image should match your website design and avoid stretching or blurring.For videos, it is recommended to choose a lightweight and compatible format (such as MP4) and control the file size to ensure loading speed.

These materials can be accessed through the Anq CMS backend’s “Page Resources" menu under the "Image Resource ManagementThe function for uploading and unified management. Here, you can create different categories to organize your media files, making it convenient for future search and use.

Step two: Enter the Banner management area and create (or edit) a Banner group

Based onbannerListlabel'stypeParameter design, the Anqi CMS backend usually provides a specialBanner ManagementorAd Space ManagementModule. You can find similar entries under the following menusContent ManagementorBackend settingsetc.

After entering this module, you will see the existing Banner group list, which may contain one nameddefaultThe default group. You can choose to edit this default group or create a new Banner group as needed (for example, named “homepageTo clearly manage the home page Banner. When naming Banner groups, it is recommended to use concise and meaningful English or pinyin, which will correspond tobannerListin the labeltypeParameter value.

Step 3: Add and configure a single Banner resource

Under the selected Banner group, you can start adding specific Banner items. Each Banner item's configuration is very critical:

  1. Logo/Photo/Video AddressThis is the core resource of the Banner display. You can associate the prepared image or video file with the current Banner item by clicking the upload button or selecting it from the existing 'Image Resource Management'.
  2. Link AddressSet a URL for the Banner to redirect to after clicking.This can be an in-site page (such as a product detail page, event page) or an external link.Reasonably guiding users to click is the key to Banner operation.
  3. Description: Briefly describe the Banner content, which is usually used for screen readers or as a tooltip, enhancing the user experience.
  4. Alt text (Alt)This is a brief description of the image content, which is crucial for image SEO and accessibility. Search engines read the Alt text to understand the image content, and it is recommended to include keywords.

After completing these settings, save your configuration.

How to call the Banner in the home page template

Configure the Banner resources on the back-end, the next step is to display them on the homepage template. The template files of Anqi CMS are usually stored in/templateIn the directory, the homepage template is generally namedindex/index.htmlorindex.htmlThe specific organization mode of your template can be referenceddesign-director.mdthe document).

You need to edit the homepage template file and usebannerListTag to call the Banner group you configured in the background:

`twig {% bannerList banners with type=“default” %} {# If you have created other groups, please replace ”default” with your group name, such as ”homepage” #}

<div class="homepage-banner-slider"> {# 假设您有一个轮播容器 #}
{% for item in banners %}
    <div class="banner-item">
        <a href="{{item.Link}}" target="_blank" title="{{item.Description}}">
            {% if item.Logo %} {# 假设 Logo

Related articles

Does the `bannerList` tag support displaying according to the backend sorting of Banner?

As an experienced website operations expert, I fully understand your concern for the display order of the core element - Banner image on the website.Banner is not only a visual facade, but also an important window for guiding users and conveying marketing information.How to flexibly control the display of these contents in a content management system has always been the key to operational efficiency.Today, we will discuss whether the `bannerList` tag supports displaying according to the backend sorting of Banner?This topic delves into the implementation mechanism of AnQiCMS (AnQiCMS).###

2025-11-06

How to overlay custom text title and introduction on the home page banner?

As an experienced website operation expert, I am deeply familiar with the various functions and content operation strategies of AnQiCMS (AnQiCMS), and I am willing to elaborate in detail on how to elegantly overlay custom text titles and introductions on the homepage Banner, and share some practical operation insights.On the homepage of the website, the Banner image serves as the visual focus, its importance is self-evident.It is not only a window to display the brand image, promote core products or services, but also a guide for users to enter the deep content of the website.However, a beautifully crafted image is often not enough to carry rich information

2025-11-06

If the `type` parameter is not set, which Banner group will `bannerList` default to calling?

As an experienced website operations expert, I often deal with various content management systems in my daily work and deeply understand the impact of each detail function on the efficiency of website operations.AnQiCMS (AnQiCMS) stands out among many CMS systems with its lightweight, efficient, and flexible features.Today, let's delve into a common issue that often arises when developing templates or conducting content operations with AnQiCMS: When the `bannerList` tag is not set with a `type` parameter, which Banner group will it default to?

2025-11-06

How to limit the `bannerList` tag to only display the first N data in the home page Banner list?

As an experienced website operations expert, I know that how to flexibly control content display is the key to improving user experience and operational efficiency.AnQiCMS, with its powerful template tag system, provides us with rich customization possibilities.Today, let's delve deeply into a common requirement: how to limit the display of the homepage Banner list to only show the first N data items.

2025-11-06

Does the 'Description' field of the homepage banner support HTML content output?

As an experienced website operations expert, I know that the homepage banner plays a crucial role in the website.It is not only the first sight that attracts users' eyes, but also an important position for conveying brand information and promoting core products or services.Therefore, the richness and flexibility of Banner content is crucial for improving user experience and conversion rates.

2025-11-06

How to debug the Banner data structure and content obtained from the `bannerList` tag in the template?

As an experienced website operation expert, I know that understanding and correctly using various tags is the key to ensuring that the website functions and content display are correct during the template development and debugging process in AnQiCMS (AnQiCMS).Today, we will focus on the commonly used `bannerList` tag, and delve into how to effectively debug the Banner data structure and content it retrieves in the template.

2025-11-06

The `bannerList` tag's `siteId` parameter needs to be manually specified in what circumstances?

As an experienced website operations expert, I have a deep understanding of the multi-site management and template tag functions of AnQiCMS.Today, let's talk about a seemingly simple but crucial parameter in the `bannerList` tag - `siteId`, in what circumstances do we need to specify it manually.AnQiCMS is a content management system designed specifically for small and medium-sized enterprises, self-media, and multi-site operation teams, and its 'multi-site management' function is undoubtedly one of its core highlights.

2025-11-06

How to implement image lazy loading (Lazy Load) in the home page Banner list to optimize performance?

As an experienced website operations expert, I am well aware of the importance of website performance for user experience and search engine rankings.AnQiCMS (AnQiCMS) provides a solid foundation for website operators with its high efficiency, lightweight nature, and SEO-friendliness.However, even the most efficient system cannot do without refined operational strategies to continuously optimize.Today, let's discuss an essential aspect of website performance optimization - how to implement image lazy loading (Lazy Load) in the home page Banner list.

2025-11-06