页（article_article.htm）中的图片添加链接
这是最常见的情况,比如文章里有图片，点击图片想跳转到文章详情页本身。
方法1：使用织梦自带的功能（推荐，最简单）
织梦的文章编辑器（/include/dededitor/）本身就支持给图片添加超链接。
- 进入文章编辑器：在后台编辑文章时，点击编辑器工具栏上的 “插入/编辑超链接” 图标（通常是一个链条图标）。
- 选择图片并添加链接：
- 先选中文章中你想要添加链接的那张图片。
- 然后点击“插入/编辑超链接”图标。
- 在弹出的对话框中,链接地址 的输入框里，织梦通常会自动填入当前文章的链接 (
{dede:field name='arcurl'/})，这正是我们想要的。 - 确认无误后,点击“确定”。
这样,这张图片就被包裹在一个<a>标签里了，点击就会跳转到当前文章的详情页。
方法2：修改模板文件（如果方法1不可行或需要更灵活的控制）
如果你想在模板文件里直接控制,可以修改文章内容页模板 article_article.htm。
是通过 {dede:field name='body'/} 这个标签来输出的，我们不能直接修改这个标签，但可以在它外面套一个循环，并利用其底层模板（@me）来处理。
- 找到文章内容模板：在后台 -> 模板 -> 默认模板管理 -> 找到并打开
article_article.htm。 - 调用标签：找到
{dede:field name='body'/}这一行，将其替换为以下代码：
{dede:field name='body' function='htmlspecialchars(@me)'/}
注意：这里我们先对内容进行
htmlspecialchars转义，防止内容中的<>等符号被错误解析，然后我们再用下面的代码来处理。（图片来源网络，侵删）
- 使用正则表达式替换（更推荐的方法）：在
article_article.htm文件的末尾（在</body>标签之前），添加一段JavaScript代码，用来在页面加载完成后自动为所有图片添加链接。
<script type="text/javascript">
// 等待文档加载完成
jQuery(document).ready(function($) {
// 获取当前文章的URL
var articleUrl = '{dede:field name='arcurl'/}';
// 找到所有文章内容里的 img 标签
// 注意：'.article-content' 是文章内容的CSS类名，你需要根据你的模板调整
$('.article-content img').each(function() {
// 获取当前图片的 src
var imgSrc = $(this).attr('src');
// 用新的 <a> 标签包裹原来的 <img> 标签
$(this).wrap('<a href="' + articleUrl + '" title="点击查看大图"></a>');
});
});
</script>
如何使用这段JS代码：
- 确保引入了jQuery：你的模板文件中必须已经加载了jQuery库，通常在模板的头部（
<head>标签内）会有类似<script src="{dede:global.cfg_cmspath/}/include/jquery/jquery.min.js"></script>的代码。 - 调整CSS选择器：代码中的
.article-content是一个示例，你需要替换成你的文章内容容器的CSS类名或ID，你可以通过浏览器的“检查元素”功能来找到正确的选择器。
列表页（如首页、列表页）中的<li>里的图片添加链接
这种情况通常是在调用文章列表时,给缩略图加上跳转到文章详情页的链接。
方法：修改列表页模板（如 index.htm, list_article.htm）
这是最标准的方法,你需要在调用文章列表的循环标签 {dede:arclist} 中，使用其底层模板功能。
假设你的列表页<li>结构是这样的：
<li>
<img src="[这里是图片地址]" alt="[这里是标题]">
<h3><a href="[这里是文章链接]">[这里是文章标题]</a></h3>
</li>
修改步骤：
- 找到列表页模板：
index.htm。 - 找到
{dede:arclist}，它看起来可能像这样：{dede:arclist row='8' titlelen='24'} <li> <img src="[field:litpic/]" alt="[field:title/]"> <h3><a href="[field:arcurl/]">[field:title/]</a></h3> </li> {/dede:arclist} - 修改
<img>：使用{dede:arclist}的底层模板功能，将<img>标签包裹在<a>标签内部。
修改后的代码：
{dede:arclist row='8' titlelen='24'}
<li>
<!-- 使用底层模板 @me 来处理 -->
[field:array runphp='yes']
@me = '<a href="'.@me['arcurl'].'" title="'.@me['title'].'"><img src="'.@me['litpic'].'" alt="'.@me['title'].'"></a>';
[/field:array]
<!-- 或者更简洁的写法（如果PHP版本支持） -->
<!--
<a href="[field:arcurl/]" title="[field:title/]">
<img src="[field:litpic/]" alt="[field:title/]">
</a>
-->
<h3><a href="[field:arcurl/]">[field:title/]</a></h3>
</li>
{/dede:arclist}
代码解释：
[field:array runphp='yes']...[/field:array]是arclist的底层模板，允许你使用PHP代码来组织输出。@me变量代表了当前这条数据的完整数组。- 我们在这里拼接了一个完整的HTML字符串,包含
<a>标签和<img>标签，并将它赋值给@me。 [field:arcurl/]会自动被替换为文章的详情页链接。[field:litpic/]会被替换为文章的缩略图地址。[field:title/]会被替换为文章标题，用作alt属性和title属性，有利于SEO。
自定义模型内容中的图片添加链接
如果你的<li>里的图片来自于一个自定义的模型（比如产品模型），方法与场景二类似，只是你需要使用对应字段的标签。
你的自定义模型有一个字段 product_pic，你想要点击这个图片跳转到产品详情页。
修改方法：
在调用自定义模型内容的列表模板中，使用 {dede:sql} 或 {dede:list} 标签进行调用，并使用底层模板。
{dede:sql sql="SELECT * FROM dede_addonproduct WHERE typeid=1 LIMIT 10"}
<li>
[field:array runphp='yes']
// 假设产品详情页的链接规则和普通文章一样，可以用 arcurl
// 如果不是，你需要自己拼接URL
@me = '<a href="'.GetArcUrl(@me['id']).'" title="'.@me['title'].'"><img src="'.@me['product_pic'].'" alt="'.@me['title'].'"></a>';
[/field:array]
</li>
{/dede:sql}
注意：对于自定义模型，
GetArcUrl()函数可能需要根据你的实际情况调整，或者直接使用织梦的全局标签{dede:field name='phpurl'/}/arc.php?aid=来拼接。
| 场景 | 推荐方法 | 关键点 |
|---|---|---|
| 页 | 编辑器功能（最简单） JS正则替换（灵活） |
使用编辑器的“插入链接”功能，或用JS在页面加载后动态包裹。 |
| 列表页（如首页） | 修改列表模板 | 使用 {dede:arclist} 的底层模板 [field:array runphp='yes'] 将<img>用<a>包裹。 |
| 自定义模型 | 修改列表模板 | 使用 {dede:sql} 或 {dede:list} 的底层模板，调用对应的图片字段和链接字段。 |
对于大多数用户来说,场景一用方法一，场景二用列表模板修改 就能解决99%的需求，希望这些详细的步骤能帮到你！
