How to troubleshoot when the front page banner image is uploaded and the front page is not updated to display?

As an experienced website operations expert, I completely understand the anxiety you feel when you upload a beautiful homepage banner image on the AnQiCMS (AnQiCMS) backend, only to find that the front page remains unchanged and still displays old content.This is indeed a minor插曲 that is often encountered during content update, but it is usually not a big problem.I will lead you step by step to check, hoping to help your website banner get a new look.

How to troubleshoot when the front page banner image is uploaded and the front page is not updated to display?

When you carefully upload a new homepage Banner image on the AnQiCMS backend and eagerly refresh the front page, only to find that it is still the old scene, it is undoubtedly confusing.But please be assured, this is usually not a system failure, but some minor details that we overlooked in certain links.As a content operation expert, I know that every detail may affect the final presentation.Let's investigate the most common to the deepest causes one by one.

Step 1: Confirm that the Banner image has been successfully uploaded and configured

Firstly, we need to go back to the root of the problem - AnQiCMS back-end. Please log in to the back-end and navigate toPage Resources>Image Resource ManagementCheck whether the new Banner image you uploaded really exists. If the image has already been successfully displayed in the image library, there should typically be no problem with the file upload.

Next, we need to confirm that these images have been correctly associated with the display location of the homepage Banner. In AnQiCMS, the management of the homepage Banner is usually inBackend settingsorfunction managementFind an option named "Home Banner" or "Carousel". Check:

1. Has the image been selected and added to the Banner list?Many CMS systems require you to upload images first, then select and add them to the carousel list in the Banner management interface.
2. Is the Banner enabled?Make sure the status of the newly added Banner is "Enabled" or "Visible".
3. Have you set up a Banner group?Based ontag-/anqiapi-other/3498.htmlDescription of the document, Banner supports sorting bytypeThe parameter is grouped for calling. If your homepage template specifies a specific group (such astype="幻灯"Make sure your new Banner is added to the correct group. If it is added to the wrong group, the front end will not be able to call it.
4. Is the banner order correct?If you want the new image to appear immediately, please check if its order is sufficient.

If the above configuration is confirmed to be correct, the Banner image looks normal in the background, then we can proceed to the next step of troubleshooting.

Step 2: Clean up the ubiquitous cache.

Once the basic situation is confirmed, what we will face next is the "root of all evil" in website operations - caching. This is almost the primary suspect for all unupdated content issues on the front-end.

1. Browser Caching:Just like in our daily lives, when you open a web page and find that the content has not been updated, the simplest method is to clear the browser cache.For web updates, simply refreshing with F5 may not be enough. Please try usingCtrl + F5 (Windows/Linux) or Cmd + Shift + R (Mac)Perform a hard refresh, which will force the browser to download all resources from the server instead of using local cache.If the hard refresh does not change, then we need to consider the server-side issues.

2. AnQiCMS system cache:AnQiCMS as a high-performance CMS, in order to improve access speed, it will use a large amount of system cache.After you have updated the Banner image or related configuration, the system may still be providing old cached content.You need to log in to the AnQiCMS backend, find the menu on the left side of theUpdate CacheOptions (based onhelp-index.mdDocument description). Click it to perform a comprehensive system cache cleanup operation. This will clear the old data stored internally, forcing the system to regenerate the latest content.

3. CDN cache (if used):If your website uses CDN (Content Delivery Network) services to accelerate access, then CDN will also cache your website's static resources, including Banner images.Even if you clear the browser and server cache, the CDN node may still be distributing old images.You need to log in to your CDN service provider's console, find the corresponding domain, and perform a "refresh cache" or "preheat" operation.Generally, you can choose to refresh a single URL or the entire directory.

Step 3: Deeply check the homepage template code

If cache clearing does not solve the problem, then we need to turn our attention to the website's template files.This is the 'skeleton' of AnQiCMS display content, any display issues may be related to the template code.

Based ondesign-director.md, the homepage template is usually located/templateUnder the directoryindex/index.htmlorindex.html. You can access the back-end oftemplate designin the feature, edit or view these files online.

We need to pay special attention to the call tag of the Banner image. According totag-/anqiapi-other/3498.htmlthe document, the tag used by AnQiCMS to call the home page Banner is{% bannerList %}. Please check:

1. bannerListDoes the label exist correctly?Make sure your homepage template includes a code snippet similar to the following:

   
   {% bannerList banners %}
       {% for item in banners %}
       <a href="{{item.Link}}" target="_blank">
           <img src="{{item.Logo}}" alt="{{item.Alt}}" />
           <h5>{{item.Title}}</h5>
       </a>
       {% endfor %}
   {% endbannerList %}
   

2. typeDo the parameters match?If your background Banner is set to group and in the templatebannerListthe tag broughttypeParameters (for examplewith type="幻灯"), make sure that thetypevalue matches the Banner group name configured in the background completely.
3. Is the image URL field correct? tag-/anqiapi-other/3498.htmlSpecify the URL of the Banner image through{{item.Logo}}Obtain. Please confirm the template in<img>label'ssrcWhether the attribute is used correctly{{item.Logo}}.
4. Is there a conditional judgment to prevent display?Check{% for item in banners %}Are there any conditions inside the loop?{% if %}Judgments based on conditions, these judgments may fail due to certain conditions not being met, resulting in the image not being rendered.

Step 4: Check the image processing and storage configuration.

AnQiCMS provides rich image processing features (reference)help-setting-content.md), these settings may also affect the normal display of images:

1. WebP conversion or automatic compression:InBackend settings>Content settingsIn Chinese, if you have enabled options such as 'Whether to start Webp image format' or 'Whether to automatically compress large images', then the newly uploaded images will be processed.If an error occurs during the process, it may cause the image to fail to generate or load.You can temporarily turn off these options and re-upload the picture to see if the problem is solved.
2. Image URL check:Use the browser developer tools (usually press F12), switch to the "Network" tab, and refresh the page.Find the loading request for the Banner image and check its HTTP status code.
   • 200 OK:The image is loaded normally. If it still does not display, it may be a CSS or JS issue.
   • 404 Not Found:The image file does not exist. This may mean that the image was not generated successfully, the path is incorrect, or there is a file permission issue.Check the complete URL of the image displayed in the developer tools, is it consistent with the URL in the background 'Image Resource Management'?
   • 5xx Server Error:Server error, possibly involving image processing failure, file system permissions, etc.
3. File storage permissions:Images uploaded by AnQiCMS are usually stored in/public/uploadsthe directory. Make sure that the directory and its subdirectories are accessible to Web server users (such aswwwThe user has read and write permissions. Insufficient permissions may cause images to fail to upload or for the server to fail to read.

Step 5: Check server environment and reverse proxy issues.

For