dede调用图集缩略图怎么实现？

使用 {dede:field name='imgurls'} 标签的 litpic 属性 (最推荐、最简单)

这是 DedeCMS 为图集字段专门设计的一个便捷属性，可以直接获取到图集的第一张图片的地址,非常适合用作封面图或缩略图。

适用场景

• 需要快速获取图集的第一张图片作为封面图。
• 在列表页（如首页、栏目页）展示图集列表时,每个图集项旁显示一张缩略图。

代码示例

{dede:arclist typeid='栏目ID' row='10'}
    <li>
        <!-- 调用图集的第一张图片作为缩略图 -->
        <a href="[field:arcurl/]">
            <img src="[field:imgurls function='GetImageUrls(@me, 1)'/]" alt="[field:title/]" width="150" height="150" />
        </a>
        <a href="[field:arcurl/]">[field:title/]</a>
    </li>
{/dede:arclist}

代码解释：

• {dede:arclist ...}: 这是一个列表循环标签,用于获取指定栏目的文章列表。
• [field:imgurls function='GetImageUrls(@me, 1)'/]: 这是最核心的部分。
  • field:imgurls: 获取当前文章的 imgurls 字段内容（这是一个包含所有图片地址的文本字符串）。
  • function='GetImageUrls(@me, 1)': 这是一个自定义函数调用。
    • @me: 代表当前字段的原始值，也就是 imgurls 的全部内容。
    • GetImageUrls: 这是 DedeCMS 内置的专门用于解析 imgurls 字段的函数。
    • 1: 这个参数表示获取第几张图片。1 代表第一张，2 代表第二张,以此类推。
• [field:arcurl/]: 文章链接。
• [field:title/]: 文章标题。
• <img>: 标签本身，用于显示图片。width 和 height 属性建议加上,可以防止页面布局错乱。

使用 {dede:field name='imgurls'} 和 preg_replace 自定义函数 (更灵活)

如果你不想使用 GetImageUrls 函数，或者需要更复杂的处理（比如获取图片的描述），可以使用 preg_replace 结合正则表达式来提取图片地址。

适用场景

• 需要获取图集中的任意一张图片（例如第二张）。
• 需要对图片地址进行额外的处理（如添加水印域名）。

代码示例

{dede:field name='imgurls' alt='图片地址为空'}
    <!-- 使用正则表达式匹配并提取第一张图片地址 -->
    [field:function name='preg_replace("/.*?src=\"(.*?)\".*/i", "\\1", @me)'/]
{/dede:field}

代码解释：

• {dede:field name='imgurls'}: 直接获取图集字段的原始内容。
• [field:function name='...'/]: 在字段值被输出前，调用一个 PHP 函数进行处理。
• preg_replace("/.*?src=\"(.*?)\".*/i", "\\1", @me):
  • preg_replace: PHP 的正则表达式替换函数。
  • "/.*?src=\"(.*?)\".*/i": 正则表达式模式，用来匹配 src="..." 中的内容。
    • .*?src=\": 匹配 src=" 之前的任意字符（非贪婪模式）。
    • 捕获组，匹配 src=" 和 之间的任意内容,这就是我们想要提取的图片地址。
    • \".*: 匹配 之后的任意字符。
    • i: 不区分大小写。
  • "\\1": 替换的内容，\1 代表第一个捕获组的内容,也就是我们提取出的图片地址。
  • @me: 代表 imgurls 字段的原始值，作为 preg_replace 函数的第三个参数。

如何获取第二张图片？ 你只需要稍微修改正则表达式，让它匹配第二个 src 即可，但这比较复杂，对于获取指定序号的图片，方法一中的 GetImageUrls 函数更简单直接。

页 (article_articled.htm) 中调用图集缩略图

页,你可能想在文章标题下方或内容上方显示一个图集封面图。

代码示例

在 article_articled.htm 模板文件中,你可以这样写：

<h1>[field:title/]</h1>
<!-- 调用图集第一张图片作为封面图 -->
{dede:field name='imgurls' function='GetImageUrls(@me, 1)'/}
<div class="content">
    [field:body/]
</div>

代码解释： 这里的写法和方法一在列表页中的调用完全一样，只是环境从列表循环 {dede:arclist} 变成了文章内容页 {dede:field}，它会直接输出第一张图片的 <img>