核心概念：图片的存储路径

在开始调用之前,必须理解帝国CMS的图片存储机制，这决定了你调用图片时路径的正确性。

1. [!--news.url--]：这是最重要的变量，代表你的网站域名。所有调用外部图片路径时，都必须以它开头，否则图片无法在浏览器中显示。
2. [!--news.photo--]页中，这个变量代表当前文章的“图片”字段（即附加表的pic字段），它存储的是图片在服务器上的相对路径，d/file/p/2025/08-20/xxx.jpg。
3. `[!--titlepic--]：这个变量代表当前文章的“标题图片”字段（即主表的titlepic字段），它也存储的是相对路径，d/file/p/2025/08-20/yyy.jpg。

• 调用外部图片：[!--news.url--] + 相对路径
• 页图片：[!--news.url--] + [!--news.photo--]
• 页标题图片：[!--news.url--] + [!--titlepic--]

常见场景调用方法

场景1：在内容页调用当前文章的图片

这是最简单的情况,直接使用系统自带的标签即可。

图片 ([!--titlepic--])

通常用于显示文章的缩略图。

<img src="[!--news.url--][!--titlepic--]" alt="[!--title--]" />

• [!--news.url--]：补全域名。
• [!--titlepic--]图片的相对路径。
• alt="[!--title--]"：使用文章标题作为图片的alt属性，有利于SEO。

调用附加表中的图片 ([!--news.photo--])

如果文章在后台通过“增加信息”时，填写了“图片”字段（通常用于多图或图集），可以使用此标签。

<img src="[!--news.url--][!--news.photo--]" alt="[!--title--]" />

注意：[!--news.photo--] 通常只调用第一张图片，如果文章有多张图片，这个标签可能无法满足需求，需要用到“灵动标签”或“万能标签”。

场景2：在列表页、首页等调用其他文章的图片

这是最复杂也最常用的场景,需要使用“灵动标签”或“万能标签”。灵动标签更灵活、更常用，强烈推荐。

方法A：使用【灵动标签】（推荐）

灵动标签可以根据各种条件（如栏目ID、专题ID、点击量等）查询文章，并循环输出内容。

基本语法结构：

[e:loop={栏目ID/专题ID, 显示条数, 操作类型, 只显示有标题图片}]
    <!-- 循环开始 -->
    <a href="<?=$bqsr['titleurl']?>" target="_blank">
        <img src="<?=$bqr['titlepic']?>" alt="<?=$bqr['title']?>" />
        <p><?=$bqr['title']?></p>
    </a>
    <!-- 循环结束 -->
[/e:loop]

参数详解：

• 栏目ID/专题ID：
  • 调用指定栏目：'栏目ID' (如 '5') 或 '0' (表示调用所有栏目)。
  • 调用指定专题：'专题ID' (如 '8')。
  • 调用多个栏目：'栏目ID1,栏目ID2' (如 '5,6')。
• 显示条数：你想显示多少篇文章，如 10。
• 操作类型：通常使用 'new' (按发布时间降序) 或 'hot' (按点击量降序)。
• 只显示有标题图片：这个非常重要！加上这个参数，可以确保只调用设置了缩略图的文章，避免显示默认的“暂无图片”。
  • 所有文章。
  • 'titlepic'：只显示有标题图片的文章。
  • 'no'：只显示没有标题图片的文章。

灵动标签调用图片实例

实例1：调用“新闻”栏目（ID=5）的最新10篇文章的标题图片

[e:loop={'5',10,'new','titlepic'}]
    <li>
        <a href="<?=$bqsr['titleurl']?>" target="_blank">
            <img src="<?=$bqr['titlepic']?>" alt="<?=$bqr['title']?>" width="200" height="150" />
        </a>
        <a href="<?=$bqsr['titleurl']?>" target="_blank"><?=$bqr['title']?></a>
    </li>
[/e:loop]

• <?=$bqsr['titleurl']?>：获取当前循环文章的链接地址。
• <?=$bqr['titlepic']?>：获取当前循环文章的标题图片路径（注意：这里不需要 [!--news.url--]，因为灵动标签内部已经处理了路径问题，直接使用相对路径即可）。
• <?=$bqr['title']?>：获取当前循环文章的标题。

实例2：调用“产品”栏目（ID=8）的5篇热门文章，并显示第一张图片（非标题图）

产品”栏目使用的是图集模型，附加表里存了多张图片，我们可以用 GetPagepics 函数来获取第一张。

[e:loop={'8',5,'hot','titlepic'}]
    <div class="product-item">
        <a href="<?=$bqsr['titleurl']?>" target="_blank">
            <!-- 使用GetPagepics函数获取附加表pic字段中的第一张图片 -->
            <img src="<?=sys_ResizeImg($bqr[pic], 200, 150, 1)?>" alt="<?=$bqr['title']?>" />
        </a>
        <h3><a href="<?=$bqsr['titleurl']?>"><?=$bqr['title']?></a></h3>
    </div>
[/e:loop]

• sys_ResizeImg()：这是一个系统函数，用于对图片进行缩裁。
  • $bqr[pic]：获取附加表pic字段的值（即图片路径）。
  • 200, 150：缩裁后的宽度和高度。
  • 1：代表裁剪模式（1=裁剪，0=按比例缩放）。
• 注意：$bqr[pic] 获取的是相对路径，sys_ResizeImg 函数会自动补全路径，所以不需要加 [!--news.url--]。

方法B：使用【万能标签】

万能标签的功能也很强大,但语法相对复杂一些，适合调用固定模板的内容。

基本语法结构：

[showclass]
    <!-- 调用指定栏目 -->
    [ecmsinfo]
        <!-- 循环开始 -->
        <a href="[!--titleurl--]" target="_blank">
            <img src="[!--titlepic--]" alt="[!--title--]" />
        </a>
        <!-- 循环结束 -->
    [/ecmsinfo]
[/showclass]

实例：调用“新闻”栏目（ID=5）的最新10篇文章

[showclass]5,10,0[/showclass]
    [ecmsinfo]
        <li>
            <a href="[!--titleurl--]" target="_blank">
                <img src="[!--titlepic--]" alt="[!--title--]" />
            </a>
            <a href="[!--titleurl--]" target="_blank">[!--title--]</a>
        </li>
    [/ecmsinfo]
[/showclass]

• [showclass]5,10,0[/showclass]：指定调用栏目ID为5，显示10条，0表示按发布时间排序。
• [!--titleurl--], [!--titlepic--], [!--title--]：在万能标签的循环体内，使用这些标签来获取信息。

调用上传到“数据表”中的图片

你可能不是调用文章的图片,而是调用一个单独的“数据表”（比如广告表、幻灯片表）里的图片，这时需要用到“灵动标签”并指定 tbname（表名）。

假设你有一个名为 ad 的广告表，里面有 ad_url（链接）和 ad_pic（图片路径）字段。

调用代码：

[e:loop={'select ad_url, ad_pic from [!db.pre!]ad order by adid desc limit 5',5,24,0}]
    <a href="<?=$bqr['ad_url']?>" target="_blank">
        <img src="<?=$bqr['ad_pic']?>" alt="广告图片" />
    </a>
[/e:loop]

• select ad_url, ad_pic from [!db.pre!]ad ...：这是一个自定义的SQL查询语句。
  • [!db.pre!]：是数据表的前缀，会自动替换成你设置的前缀（如 phome_）。
  • order by adid desc limit 5：按广告ID降序排列，并限制只查询5条。
• <?=$bqr['ad_url']?> 和 <?=$bqr['ad_pic']?>：通过SQL查询的字段名来获取数据。
• 5,24,0：这三个参数在这种情况下意义不大，但语法上需要保留。24 代表输出HTML模板（但我们这里直接输出了，所以可以忽略）。

总结与最佳实践

1. 首选【灵动标签】：在列表页、首页等需要循环调用的地方，灵动标签是最佳选择，因为它非常灵活，性能也较好。
2. 路径问题：
   • 内容页：[!--news.url--] + [!--titlepic--] / [!--news.photo--]。
   • 灵动标签：直接使用 <?=$bqr['titlepic']?> 或 <?=$bqr['pic']?>，不要手动加 [!--news.url--]。
3. 过滤无图文章：在灵动标签的第四个参数加上 'titlepic'，可以避免调用没有缩略图的文章，保持页面整洁。
4. 图片处理：如果需要对图片进行缩放、裁剪，请使用 sys_ResizeImg() 函数。
5. 自定义数据表：调用非文章表的数据时，使用灵动标签配合自定义SQL语句是最直接的方法。

希望这份详细的指南能帮助你完全掌握帝国CMS的图片调用！