When using the Safe CMS to manage website content, we often encounter scenarios involving image upload and display. In the data structure of documents (articles, products, etc.), categories, and even single pages,images/logoandthumbThese fields play different roles, working together to effectively present and optimize the website's visual content.Understanding their specific uses can help us better plan content and optimize the user experience.

images:Multi-image display and rich content

imagesfield is usually an array of image links (string[]Type),it is mainly used to store and display multiple images associated with specific content.Imagine you are releasing a product, you may need to show detailed images from different angles; or when writing a travel diary, you want to use multiple photos to link the entire journey.imagesfield is your ideal choice.

In Anqi CMS, when you go through the publish interface (such asarchivePublishUpload a set of images toimagesWhen a field is entered, the system will intelligently take this image arrayThe firstimage as the default for this contentlogo. This meansimagesIt not only provides a visual gallery but also indirectly determines the "cover image" of the content.

Actual application scenarios:

  • Article detail page:Displays articles with illustrations, albums.
  • Product details page:Display product images from multiple angles and details.
  • Category or single page:If you need multiple images to be displayed in a carousel as the page top Banner,imagesfields can also be used.

Rationally utilizeimagesField, which can greatly enrich the visual content of the page, providing users with more comprehensive information and a more immersive browsing experience.

logo: Main visual identification

logoField is a single image link (stringType),it represents the contentMain visual identifierorCover image. It is usually the image you want to be displayed on various list pages, recommendation positions, or as the default display image for content.

As mentioned earlier, if you provide content when it is publishedimagesthenimagesthe first image in the array will be automatically designated aslogoOf course, you can also upload a single image aslogoEnglish translation: Such that even without the need for multiple images to be displayed, the content can still have a clear visual theme.attachmentUploadEnglish translation: In the returned parameters of the interface, logoExplicitly marked as “Original”, this usually refers to the original image, which is typically uncompressed and not resized.

Actual application scenarios:

  • List page thumbnail:On article list, product list, and other pages,logoIt can be used as a direct display for each piece of content.
  • Share card:When sharing on social media,logoit is often captured as the image of the shared content.
  • Content cover:Clearly identify the theme of the article, product, or category to enhance recognition.
  • Site Logo:In the system settings, it represents the brand image of the entire website.

logoThe importance of the field lies in its uniqueness and representativeness, which is the core visual element for the identification and dissemination of content in different scenarios.

thumb: Optimize the loading of thumbnails

thumbField is also a single image link (stringtype), but it is different fromlogomainly inoptimization purpose.thumbYeslogoor other main images processed by the system.ThumbnailVersion.This process usually includes resizing, compressing images, and even possibly adding watermarks, with the core goal of accelerating webpage loading speed and reducing user waiting time.

InattachmentUploadEnglish translation: In the returned parameters of the interface, thumbBe explicitly marked as "thumbnail". This means that when you upload an image, the system will not only store the original image (i.e.,logo), but also automatically generate an optimized one.thumbFor most websites, loading high-definition images directly on pages that display large lists of content (such as news lists, product category pages) can severely affect page performance, while usingthumbThe user experience can be significantly improved.

Actual application scenarios:

  • List page, search results:When displaying content overview, usethumbCan be quickly loaded, saving bandwidth.
  • Mobile page:Mobile network environment is complex, loading small sizethumbCan greatly improve response speed.
  • Recommended module:When recommending related content at the bottom or sidebar of the article, usethumbIt can attract attention without occupying too many resources.

thumbThe field is a key element in website performance optimization, ensuring that it maintains both visual richness and website loading efficiency while considering user experience.

Summary

In the Anqi CMS,imagesThe field is used to manage a set of images, providing rich visual content;logoThe field represents the original or main cover image of the content, which is the core visual identifier; andthumbThe field islogoThe optimized version, designed to enhance page loading speed and user experience. The three work together to build a powerful and flexible image management and display mechanism for Anqi CMS.


Common Questions (FAQ)

1.logoandthumbIt looks like all are links to images, what is the essential difference between them? logoTypically points to the original or main image of the content, it represents the "face" and primary visual information of the content.thumbis automatically generated by the system according tologoThe "thumbnail" version generated, which is resized and compressed. Their essential difference lies in size and optimization level:thumbIntended for quick loading, often used on list pages;logoIt is the original material, often used on detail pages or when high-definition display is required.

2. When publishing documents, I should upload them at the same time.imagesandlogo?Generally, you just need to uploadimagesarray. The AQCMS will default toimagesin an array.the first imageas the automatic document'slogo. If you are not satisfied with this automatically generatedlogoDissatisfied, or just want to specify a specific cover image without multiple images display, you can directly inlogoSpecify an image URL in the field.

3. 安企CMS will automatically generate for methumbIs it a thumbnail? If I'm not satisfied with the automatically generated one?thumbWhat should I do?Yes, when you upload an image (whether through)imagesor directly specify)logo), the Anqi CMS will usually generate according tologo自动生成一个或多个thumb缩略图版本。根据现有的文档来看,文档详情和列表中返回的thumbIs automatically generated. If you want more fine-grained control over the thumbnails, such as custom cropping or processing, this may require going through the image upload interface (attachmentUpload), in the upload process directly obtain and use the returnedthumbURL, or after the content is published, you can globally adjust the thumbnail size through the backend settings, but it is usually not possible to manually specify for a single articlethumbThe specific link, unless custom development or throughlogoreplacement to indirectly influencethumbre-generation.