How does AnQi CMS manage and display website image resources, including categories and details?

In website operation, image resources play a vital role, not only directly affecting user experience, but also a key factor in the attractiveness of website content and Search Engine Optimization (SEO).A high-efficiency CMS system should provide a complete set of image management and display mechanisms.AnQiCMS (AnQiCMS) considers this aspect quite thoroughly, it provides a series of features to help users easily manage and optimize the image resources of their websites, from classification and archiving to intelligent processing and multi-scene display, striving to be simple and efficient.

Next, we will delve deeper into how Anqi CMS manages and displays website image resources.

1. Unified Management: The core function of the image resource library.

In the Anqi CMS backend, the management of image resources is concentrated in the 'Page Resources' under the 'Image Resource Management' module.This is the collection point for all the uploaded images and videos on the website, where users can directly view all the uploaded media files.

After entering the image resource management interface, the user will see a clear list displaying the thumbnail, file name, file type, upload time, file size, and image resolution of each file in detail.This makes it convenient to search for files and also allows users to have a comprehensive understanding of the media assets on the website.When you need to perform more detailed operations on a picture, just click the picture to enter its detail page, where you can view the original large image, even replace or delete the picture.It is worth mentioning that the image replacement feature allows users to update image files without changing the image URL address, which is very practical for maintaining the stability of image links and avoiding dead links.

This centralized management model greatly improves the reusability of image materials, avoids repeated uploads, and also allows managers to complete most daily operations related to images on a unified interface, greatly enhancing work efficiency.

Second, flexible classification: build a clear image organization structure

As the content of the website grows continuously, the number of image resources will also increase. If there is no effective organization, it will soon become disorganized and difficult to search and manage.AnQi CMS is well-versed in this, providing powerful classification functions for image resources.

Users can directly create and manage image categories on the "Image Resource Management" interface.For example, you can set different categories according to the usage scenario of the image (such as "product image", "article illustration", "Banner image"), the content theme (such as "technology", "life", "food"), or the time (such as "2023 event image").After creating a category, users can upload images to the specified category and can also transfer uploaded images in batches, assigning them to the corresponding category.

Through this flexible classification mechanism, the website's image resources can be organized clearly and logically.This not only helps managers quickly locate the required images, but also lays a solid foundation for the subsequent planning and maintenance of the website content.

Third, intelligent optimization and processing: ensure efficient image display

The loading speed of website images directly affects user experience and SEO performance.The Anqi CMS integrates multiple intelligent optimization functions in image upload and processing to ensure efficient display of images on the front end.These settings are mainly configured in the "Content Settings" module under the "Background Settings".

1. Automatic processing during upload:

   • Download remote image:The user can choose whether to download pictures from external links to the local.If enabled, all remote images referenced in the content will be automatically stored on the server, which helps improve the stability, controllability, and search engine crawling efficiency of the website.
   • WebP image format conversion:The AnQi CMS supports automatically converting uploaded JPG, PNG, and other images to WebP format.Images in the WebP format are usually smaller in file size than JPEG, PNG, and other formats at the same quality, significantly improving page loading speed.For images that have been uploaded but not converted, the system also provides a batch conversion tool for users to optimize in full.
   • Automatically compress large images:For high-resolution large images, the system can automatically compress them, reduce file size, and can also customize the target width to which they are compressed, such as uniformly compressed to 800 pixel width to meet web display requirements and save storage space.

2. Intelligent generation and management of thumbnails:

   • Multiple thumbnail processing methods:AnQi CMS provides three ways to process thumbnails:
     • Scale proportionally to the longest side:Maintain the aspect ratio of the image, and shrink the longest side to the specified size.
     • Pad to the longest edge:Set thumbnail size, image centered, fill with white for insufficient parts.
     • Trim to the shortest edge:Center-crop the image to fit a fixed size, with the shortest edge fully displayed. Each option is designed for different design needs, ensuring that the thumbnail is both aesthetically pleasing and fits the layout.
   • Custom thumbnail size:Users can accurately set the thumbnail size according to the template design requirements, and the system will automatically generate based on the selected processing method.
   • Default thumbnail: If the content does not specify a thumbnail, the system can automatically use the preset default thumbnail to fill in, ensuring consistent display effects.
   • Batch regenerate thumbnails:When the thumbnail size or processing method changes, users can use one key to batch regenerate all thumbnail images of the pictures, saving the trouble of a lot of manual operations.

3. Image copyright protection:To protect the copyright of original images, AnQi CMS also built-in image watermark function.Users can configure watermark style and position, automatically add watermarks when uploading images, effectively prevent image theft.

Four, multi-scene display: Let the pictures shine at every corner of the website

AnQi CMS seamlessly integrates the above managed and optimized image resources into various display scenarios of the website.

1. Insert image in content editing:Whether editing documents (articles, products, etc.), single pages, or categorized content, users can directly insert "uploaded image resources" through the rich text editor, or quickly reference images through the "paragraph material library materials".This makes the combination of images with text content very convenient.

2. Thumbnail display of content model:

   • Document thumbnail:In the add/edit interface of the document (such as articles, products), users can upload a "document image" as a thumbnail.If not manually uploaded, the system can also intelligently extract the first image in the content as a thumbnail.In the front-end template, you can use{{archive.Logo}}Get the large image link,{{archive.Thumb}}Get the thumbnail link to display.
   • Category and single page thumbnails:Similarly, in the category and single-page editing interface, users can also upload thumbnails (Logo/Thumb) and use them in the frontend{{category.Logo}}/{{category.Thumb}}or{{page.Logo}}/{{page.Thumb}}with tags.

3. **Banner and Group Images