In website operation, images are an important component of content attractiveness. AnQiCMS (AnQiCMS) understands this and provides powerful image processing capabilities, among whichthumbThe filter is one that everyone often uses. It helps us easily generate and call image thumbnails, making page loading faster and layout neater.

In most cases, we would use it like this in the templatethumbFilter to display thumbnails: for example, you might see something similar in article lists, product display pages, or category pages{{ item.Logo|thumb }}or{{ archive.Thumb }}Such code. Hereitem.Logoorarchive.ThumbPoints to the original image file path.

Then, when the original image does not exist for some reason, or the image path is incorrectly configured,thumbHow will the filter handle it?In the operation of a website, image files may become inaccessible due to factors such as server migration, accidental deletion, and path adjustments.If the system simply displays a broken image icon, it will undoubtedly affect the user experience and even make the website look unprofessional.

Fortunately, AnQi CMS has given very thoughtful consideration to this situation and built-in a set of intelligent fault-tolerant mechanisms. The core of this mechanism is in the background of the “Default thumbnailSettings.

You can find in the Anqi CMS backend.Content Management" -> "Content settingsFind the option "Default thumbnail" here. Here you can upload a preset image as a substitute for all missing or path error images.

WhenthumbThe filter does not return a failure result or display a broken icon in the browser when it attempts to process a non-existent or incorrect image URL. Instead, it willAutomatically detects the unavailable status of the original image and intelligently switches to the default thumbnail you have preset in the backgroundThis means that even if the thumbnail of an article is accidentally lost, the page will not display an embarrassing broken image, but will neatly display a unified default placeholder image.

In two cases, you may see the browser's default broken image icon on the front end: one is in the "Content Settings" of the Anqi CMS backgroundThere was no upload and no default thumbnail was setSecondly, although the path of the original image exists, the actual file content is corrupted, unreadable, or an empty file, leading tothumbThe filter is also unable to process normally.

This feature is crucial for maintaining the overall aesthetics and user experience of the website.It avoids affecting the visual consistency of the entire page due to individual image issues, maintaining the professionalism and cleanliness of the website interface.Therefore, we strongly recommend that you set a representative 'default thumbnail' in the background when building a website, as a solid support for the content.

Frequently Asked Questions (FAQ)

  1. Question: I have set the default thumbnail, why is the broken image icon still displayed on the page?Answer: There are usually several possibilities.Firstly, make sure that the default thumbnail you have set is valid and accessible.Next, check if the original image exists and if the path is really completely unrecognizable.thumbThe filter may still not work properly, resulting in broken display. Also, make sure you have used it correctly in the template.thumbThe filter is used to process images instead of directly calling the potentially corrupted original image URL.

  2. Question:thumbDoes the filter automatically optimize the size and quality of the image?Answer: Yes,thumbThe filter combines the 'Thumbnail size' and 'Thumbnail processing method' in the background 'Content settings' when generating thumbnails.This includes ways such as scaling proportionally by the longest side, filling by the longest side, or trimming by the shortest side.These settings are designed to reduce the size of images, speed up page loading, and improve user experience.

  3. Question: Besides,thumbFilter, does the Anqi CMS have other ways to get article images?Answer: Of course. In the document details page or list items, besides{{ item.Thumb }}other than getting thumbnails,{{ item.Logo }}Used to obtain the cover image of the article. If the article content contains multiple images,{{ item.Images }}You can get an array of images to display on the front end in a loop.In addition, if you do not manually upload a thumbnail when publishing the document, Anqi CMS will also intelligently extract the first image from the document content as a thumbnail.