在网站运营中，图片不仅是内容吸引力的重要组成部分，更是影响页面加载速度和用户体验的关键因素。尤其对于文章、分类或单页面这类内容，一个恰当的缩略图能够迅速抓住访客的眼球，引导他们点击深入了解。在安企CMS中，设置和调用这些缩略图，并灵活控制它们的显示尺寸，其实比想象中要简单和高效。
后台轻松管理缩略图：上传与智能提取
首先，让我们来了解如何在安企CMS后台为您的内容设置缩略图。
对于文章内容，当您在“内容管理”模块下编辑或发布一篇新文章时，会看到一个“文档图片”区域。这里就是上传文章缩略图的地方。您可以选择从图片库中挑选已有的图片，也可以上传新的图片。安企CMS非常智能的一点是，如果您忘记上传缩略图，但文章内容中包含了图片，系统会自动选取文章正文中的第一张图片作为该文章的缩略图。这大大减少了内容发布的负担。
对于分类页面，在“内容管理”下的“文档分类”设置中，以及对于单页面，在“页面资源”下的“页面管理”中，您也会找到“缩略图”的设置选项。这些缩略图通常用于在列表页或导航菜单中代表该分类或单页，它们不像文章缩略图那样可以自动提取内容图，需要您手动上传。
此外，在“后台设置”->“内容设置”中，您还可以上传一张“默认缩略图”。这张图片就像一个备用方案，当任何文章、分类或单页面没有设置自己的缩略图时，系统就会自动使用这张默认图来填充，确保页面显示的一致性，避免出现空白或损坏的图片。
全局统一管理缩略图尺寸与处理方式
仅仅上传图片还不够，为了让您的网站在不同设备上都能有良好的视觉效果和加载性能，安企CMS提供了一套强大的全局缩略图处理机制。
您可以在“后台设置”->“内容设置”中找到“缩略图处理方式”和“缩略图尺寸”的选项。
“缩略图处理方式” 决定了系统在生成缩略图时如何对图片进行裁剪和缩放：
- 按最长边等比缩放： 这种方式会保持图片的原始比例，将图片缩放到指定尺寸范围内，保证最长边与设定尺寸匹配，而另一边则按比例自动调整。它能完整展示图片内容，不会有任何裁剪。
- 按最长边补白： 如果您希望所有缩略图都严格符合某个固定尺寸（例如1:1的正方形），但又不想裁剪图片内容，那么这个选项就很合适。系统会等比缩放图片以适应指定尺寸，不足的部分则用白色背景填充，让图片在固定大小的容器中居中显示。
- 按最短边裁剪： 当您追求图片在显示区域内完全铺满，不留白边时，可以选择这种方式。系统会将图片居中裁剪，确保最短边与设定尺寸匹配，最长边多余的部分则会被裁剪掉。这意味着可能会丢失图片边缘的一些内容，但视觉上会更加紧凑。
紧接着是“缩略图尺寸”的设置。在这里，您可以输入一个宽度和高度值（例如200x150），系统就会根据您选择的“缩略图处理方式”，生成相应尺寸的缩略图。建议您根据网站设计布局，设置一个合适的尺寸，这样既能减少图片体积，又能加快页面加载速度。
如果您修改了这些全局设置，发现前台页面上的缩略图没有立即更新，别担心，系统提供了一个“批量重新生成缩略图”的功能。点击这个按钮，系统就会按照新的设置，重新生成所有已上传图片的缩略图版本，确保您的网站始终展示最新、最优化尺寸的图片。
值得一提的是，内容设置里还有“是否启动Webp图片格式”和“是否自动压缩大图”等选项，这些虽然不是直接控制缩略图尺寸，但它们与图片优化紧密相关，开启后能进一步提升您网站的图片加载性能。
前端模板中的缩略图调用与尺寸控制
在安企CMS的前端模板中，调用缩略图非常直观，主要通过内容对象的特定字段来完成。
- 文章缩略图： 您可以通过
{{archive.Thumb}}来调用文章已设置的缩略图。如果文章上传了多张图片或有大图需求，{{archive.Logo}}通常会返回第一张或较大尺寸的图片，而{{archive.Images}}则是一个图片数组，适用于展示文章图集。 - 分类缩略图： 类似地，
{{category.Thumb}}用于调用分类的缩略图，而{{category.Logo}}或{{category.Images}}则可以用于调用分类的Banner图或组图。 - 单页面缩略图： 单页面的缩略图调用方式与分类类似，使用
{{page.Thumb}}。如果单页面有设置Banner，也可以通过{{page.Logo}}或{{page.Images}}来获取。
这些变量返回的是图片地址。您可以在HTML中使用<img>标签来显示它们：
<img src="{{item.Thumb}}" alt="{{item.Title}}" />
最灵活的尺寸控制：thumb 过滤器
虽然后台可以设置全局的缩略图尺寸，但在实际的模板开发中，我们经常需要在不同场景下显示不同尺寸的缩略图。例如，列表页可能需要小尺寸的缩略图，而详情页的相关推荐区域可能需要略大一点的尺寸。这时，安企CMS的thumb过滤器就派上用场了。
thumb过滤器允许您在模板中实时指定任何图片的输出尺寸。它接收一个图片URL作为输入，并根据您提供的尺寸参数，动态生成并返回相应尺寸的缩略图URL。
使用方法非常简单：
<img src="{{item.Logo|thumb:'100x80'}}" alt="{{item.Title}}" />
<img src="{{category.Thumb|thumb:'300x200'}}" alt="{{category.Title}}" />
<img src="{{page.Logo|thumb:'640x360'}}" alt="{{page.Title}}" />
在这个例子中，'100x80'、'300x200'、'640x360'就是您希望生成的缩略图的宽度和高度。系统会根据这个尺寸，并结合后台“内容设置”中配置的“缩略图处理方式”来生成图片。这意味着，即使您在后台将全局尺寸设置为800x600，但通过thumb过滤器，您仍然可以在模板中输出100x80、300x200等自定义尺寸的缩略图，而无需预先生成所有可能的尺寸，非常方便和高效。
通过这些功能，安企CMS为您提供了从图片上传、全局尺寸配置到前端灵活调用的全链路缩略图管理方案，帮助您的网站在视觉表现、用户体验和性能优化之间找到完美的平衡。
常见问题 (FAQ)
1. 我在后台给文章上传了缩略图，为什么前台页面没有显示出来？
有几个可能的原因：
- 模板调用不正确： 请检查您的前端模板，确认是否使用了正确的标签（例如
{{archive.Thumb}}）来调用缩略图。有时，模板可能调用的是{{archive.Logo}}或{{archive.Images}}，这些可能返回的是原图或图集，而不是您上传的缩略图字段。 - 缓存问题： 清理浏览器缓存或系统缓存试试看，有时新的图片链接可能因为缓存而未能及时更新。
- 图片路径问题： 确保图片已成功上传，且图片地址在浏览器中可访问。
2. 我修改了“内容设置”中的“缩略图尺寸”和“处理方式”，但网站上现有的缩略图尺寸并没有立即改变，这是为什么？
全局的缩略图尺寸和处理方式设置，通常只对*新上传*的图片或您手动触发*重新生成*操作后生效。对于已存在的缩略图，它们是根据之前的设置生成的。如果您希望所有现有缩略图都应用新的尺寸和处理方式，需要在“后台设置”->“内容设置”页面中，点击“批量重新生成缩略图”按钮。系统会根据最新的配置，对所有图片进行一次性的处理。
3. 文章内容编辑器中上传的图片，会不会也受“内容设置”中“缩略图尺寸”的影响？
通常情况下，“内容设置”中的“缩略图尺寸