How to set the default thumbnail for AnQiCMS and automatically display it when there is no image in the article?

In website content operation, maintaining the consistency of visual style is crucial for improving user experience.Especially for the article thumbnail, if some articles are missing images, blank spaces or placeholders appear on the page, which looks unprofessional.AnQiCMS (AnQiCMS) provides us with a very practical feature that allows us to easily set a default thumbnail, ensuring that even if the article does not have a dedicated image, it can automatically display a preset image, maintaining the beauty and consistency of the website interface.

Set the default thumbnail: Back-end configuration instructions

You need to enter the 'Content Settings' module of Anqi CMS to set the default thumbnail.

First, please log in to your AnQi CMS backend. In the left navigation bar, find and click on theBackend settingsSelect thenContent settings.

After entering the content settings page, you will see a name calledDefault thumbnailThe option.This is the location where you upload and specify the default image.Click the corresponding upload button, select an image from your computer that you want as the default thumbnail.This image should be universal and consistent with the overall style of your website.After the upload is complete, please make sure to click the "Save" button at the bottom of the page to make the settings effective.

There is also another one on the same pageThumbnail Processing MethodAndThumbnail sizePlease select an option.These settings are very important for the display effect of default thumbnails and thumbnails of articles.Please choose an appropriate processing method according to the actual needs of the website template (for example, proportional scaling by the longest side or cropping by the shortest side) and a unified size.This will help ensure that all thumbnails are displayed in a **status at different locations on the website.

When no image is available for the article, it will automatically display: Template calling strategy

When the Anqi CMS calls the article thumbnail, it will follow an intelligent priority logic:

  1. It will first look for the thumbnail uploaded by the article itselfIf you upload a thumbnail separately for an article when publishing or editing, the system will display this image first.
  2. Next, it will automatically extract from the article content.If the article does not have a thumbnail uploaded separately, but the article content contains images, the system will automatically extract the first image in the article content as the thumbnail for the article.
  3. The last one used the default thumbnail set in the background: Only when there is no thumbnail uploaded separately and no images in the article content, the Anqicms will automatically display the default thumbnail you configured in the background "Content Settings".

This means that in the template, you do not need to write complex conditional judgments to distinguish between cases with and without images. Anqi CMS has already handled this logic for you.

In the article detail page or list page, you can call the thumbnail in the following way:

  • Call in the article detail page: In the template file displaying the article details (usually{模型table}/detail.htmlIn it, you can usearchivethe object'sThumbField to display thumbnail. For example:

    <img src="{{archive.Thumb}}" alt="{{archive.Title}}" />

    Or use the document details tag:

    <img src="{% archiveDetail with name="Thumb" %}" alt="{% archiveDetail with name="Title" %}" />

    When the article does not have a dedicated image,archive.Thumbit will automatically point to the default thumbnail path set in the background.

  • in the article list page.In the template file of the article list (usually{模型table}/list.htmlor the homepage, etc.), you can use thearchiveListtag to loop output articles. You can alsoitem.Thumbfield directly. For example:

    {% archiveList archives with type="page" limit="10" %}
    {% for item in archives %}
        <li>
            <a href="{{item.Link}}">
                {% if item.Thumb %} {# 通常用于判断是否有缩略图，以便添加特定样式或包装 #}
                    <img alt="{{item.Title}}" src="{{item.Thumb}}">
                {% else %}
                    {# 如果您希望在item.Thumb为空时（即没有设置默认图且文章无图）显示自定义的占位符，可以在这里添加 #}
                    <img alt="{{item.Title}}" src="/path/to/your/custom/placeholder.jpg">
                {% endif %}
                <h5>{{item.Title}}</h5>
                <div>{{item.Description}}</div>
            </a>
        </li>
    {% endfor %}
{% endarchiveList %}

    Please note that,{% if item.Thumb %}In such a judgment, if the article does not have a dedicated thumbnail, but the background is set to a default thumbnail,item.ThumbThe URL will contain the default thumbnail, so this judgment will still be true and display the default thumbnail.This keeps the template code concise and implements an automatic fallback mechanism for thumbnails.

By using the above settings and template calls, your security CMS website will be able to maintain a consistent visual presentation, even if the article content does not provide images, it can automatically fill in thumbnails to enhance the user browsing experience and the professionalism of the website.

Frequently Asked Questions (FAQ)

1. Q: How will the system handle it if there is an image in the article content, but I did not upload a thumbnail separately?

A: Anqi CMS is very intelligent.If you do not upload a thumbnail separately when publishing an article, but the article content contains images, the system will automatically extract the first image in the article content as the thumbnail for that article.Only if there is no image in the article content and you have not uploaded a thumbnail separately, will the default thumbnail configured in the background "Content Settings" be displayed.

2. Q: Can I set different default thumbnails for different categories or content models?

A: The 'Content Settings' default thumbnail in AnQi CMS is a global setting that applies to all content types such as articles, products, etc.The system does not currently provide the function to set default thumbnails for different categories or content models.If you need to display different images for specific categories or content models, you will need to manually upload corresponding thumbnails when publishing articles.

**3