How to control the automatic compression of large images and the generation of thumbnails in AnQiCMS?
In website operation, images play a crucial role.They are not only elements that attract users' attention, but also directly affect the website's loading speed, user experience, and even the performance of search engine optimization (SEO).Manage website images, especially the compression of large-sized images and the generation of thumbnails, is a key factor in improving website performance and aesthetics.AnQiCMS (AnQiCMS) fully understands this and provides flexible and powerful image processing functions in its content management system, allowing you to easily control the automatic compression of large images and the generation of thumbnails.
Why is image processing so important?
Imagine a website that loads slowly, often because it contains a large number of unoptimized images.Users may lose patience and directly close the page.Search engines also tend to prefer websites with fast loading speeds.Therefore, effectively managing images, including compressing large images to reduce file size and generating thumbnails of different sizes to adapt to different display scenarios, is crucial for improving the overall performance of the website.The AnQi CMS is designed to help users solve these pain points, providing a simple and efficient image processing solution.
Control the automatic compression of large images
To prevent users from uploading large images that cause the page to load slowly, AnQi CMS provides a feature to automatically compress large images.This setting can be found under the "Background Settings
In the 'Content Settings', you will see an option named 'Whether to automatically compress large images'.By default, this feature may be disabled.If you want the system to automatically process all large images uploaded, just enable it.Once enabled, the system will check the size of the image when it is uploaded and compress it according to the rules you set.
Right away, you will find the setting item 'Auto-compress to specified width'.Here you can define the maximum width of the large image after automatic compression.For example, the default value may be 800 pixels.This means that any image with a width exceeding 800 pixels will be automatically compressed after uploading, ensuring that the width does not exceed 800 pixels while maintaining the aspect ratio of the image.This feature is very practical because it can reduce the file size of the image while ensuring the visual effect of the image, thereby speeding up the loading speed of the web page and saving storage space.
The precise customization of thumbnail generation method
In addition to large image compression, thumbnail generation is another important feature that can significantly optimize the display of a website.The AnQi CMS not only supports automatic extraction and setting of thumbnails (for example, when you publish a document without manually uploading a thumbnail, the system will intelligently extract the first image from the article content as a thumbnail), but also provides various refined thumbnail processing methods to meet different design and display requirements.These settings are also located on the 'Content Settings' page.
Thumbnail processing method:AnQi CMS provides three mainstream thumbnail generation algorithms:
- Scale proportionally to the longest side:This is the most commonly used way.It will resize the image according to the thumbnail size you set, maintaining the original aspect ratio.This means that one side (length or width) of the thumbnail will match the set size, while the other side will be adjusted proportionally.The original content is preserved completely, without any cropping or white space.
- Pad to the longest edge:If you need to fix the size of the thumbnails (for example, all thumbnails must be 150x150 pixels) and want the image content to be displayed completely, then 'pad to the longest side' would be the ideal choice.The system will resize the image proportionally to the closest size set, then fill the insufficient part with white (or other preset colors) to make the thumbnail reach the set fixed size, and display the image content centered.
- Trim to the shortest edge:When you aim for all thumbnails to be perfectly filled to a fixed size and visually compact, you can choose to "crop to the shortest side".The system will center the image and then crop along the shortest edge until the image completely fills the specified size.This method may cut off part of the original image's edge content, but it can ensure that the thumbnail's height and width match the set values exactly.
Thumbnail size:Here, you can specify the thumbnail size required for your website, for example, "200x150".The system will generate the corresponding image based on the thumbnail processing method you choose and this size.Setting the thumbnail size appropriately helps unify the visual style of the website layout and further optimize the image loading performance.
Default thumbnail: This is a very considerate feature.If some content does not have a specific thumbnail, the system can automatically use the 'default thumbnail' you upload here for display.This ensures that even if the content lacks images, the page will not appear empty or with broken illustrations, enhancing the overall professionalism of the website.
Batch regenerate thumbnails:During the operation, you may adjust the thumbnail size or processing method.This is when the 'Batch regenerate thumbnails' feature provided by Anqi CMS comes into play.Click this button, the system will reprocess all thumbnails on your website according to the latest settings, ensuring the consistency of the website image display.
Further optimization: WebP format and automatic extraction
The considerations of AnQi CMS in image processing are not limited to this.In the "Content Settings", you will also see the option to enable the Webp image format.WebP is a modern image format that can provide smaller file sizes at the same quality compared to traditional JPG and PNG.Enable this feature and new uploaded images will be automatically converted to WebP format, while the system also provides tools for batch conversion of existing images to further improve website performance.
At the same time, as previously mentioned, if no thumbnail is manually uploaded when you publish a document, the system will also intelligently extract the first image from the document content as a thumbnail.This reduces the steps of manual operation and improves the efficiency of content publishing.
Call images and thumbnails in the template
At the template design stage, you can easily call these processed images through the tags provided by Anqi CMS. For example, for document content, you usually can{{item.Logo}}Call the cover image of the document, pass{{item.Thumb}}Call the thumbnail. If you need to dynamically generate a thumbnail of a specific size based on the original large image (for example, a special size not set uniformly in the background), you can also utilizethumbFilter. Just pass the image URL in{{ image_url|thumb }}The system will dynamically generate the thumbnail address according to the preset rules in the background and display it on the page.
In summary, Anqi CMS has well-designed and practical features for image management, whether you are pursuing the ultimate website loading speed or hoping to have a unified and beautiful visual presentation, these tools can provide you with strong support.By making reasonable use of these features, you can make the website's image content management easier and more efficient.
Frequently Asked Questions (FAQ)
1. Have I already optimized the image, and do I need to enable the automatic compression of large images in AnQi CMS?Answer: It depends on whether the optimized image you have pre-optimized meets the actual display requirements of your website.If the image you upload is already small and of moderate size, you can choose not to enable automatic compression to maintain the original quality of the image.But if your image sources are diverse and you cannot guarantee that each one is strictly optimized, then enabling the automatic compression feature can act as a safety net to ensure that even if there are images uploaded without optimization, it will not have a significant impact on website performance.
2. Does AnqCMS support setting different thumbnail sizes and processing methods for different content models (such as articles and products)?Answer: In the current content settings of Anqi CMS, the thumbnail size and processing method are global settings that apply to all document model thumbnails. If you need to display thumbnails of different sizes for different content models (or different page areas), you can do so through the template bythumbA filter that takes the corresponding image URL to dynamically request the generation of thumbnails in specific sizes. This way, even if the background global settings are unified, the front-end display can be flexible and diverse.
3. Will the previously uploaded images be updated immediately if I change the thumbnail processing method or size?Answer: Changing the thumbnail processing method or size will immediately take effect on the images uploaded after that.The images that have already been uploaded will not be updated immediately.You need to go to the "Content Settings