dede普通文章怎么添加图片？

使用编辑器自带工具栏（最常用、最简单）

这是最直接、最常用的方法,适合在文章内容中插入图片。

操作步骤：

1. 登录后台并进入文章编辑页面

   • 登录您的DedeCMS后台管理系统。
   • 在左侧菜单栏中，依次点击 -> 「普通文章」 -> 「增加普通文章」。
   • （或者点击 「所有文档」，然后选择一篇文章进行编辑）。

2. 定位到编辑器

   • 在文章编辑页面，您会看到一个富文本编辑器（通常是基于kindeditor或ckeditor）,将鼠标光标定位在您想要插入图片的位置。

3. 点击“插入图片”按钮

   
   （图片来源网络，侵删）
   • 在编辑器的工具栏中，找到 “插入图片” 的图标,它通常看起来像一张小山或风景画。

4. 上传或选择图片

   • 点击该图标后，会弹出一个“图片上传”或“媒体管理”窗口，这里您有两种选择：
     • 选择本地图片（推荐）：
       • 点击 “上传” 或 “本地上传” 选项卡。
       • 点击 “浏览...” 或直接将图片文件拖拽到上传区域。
       • 选择您电脑上的图片文件，然后点击 “开始上传”。
       • 上传成功后,图片会出现在列表中。
     • 从媒体库选择（如果已有图片）：
       • 点击 “站内选择” 或 “我的媒体库” 选项卡。
       • 在这里可以浏览和管理您之前上传过的所有图片。
       • 找到您想用的图片，点击图片或选中图片后点击 “选择” 或 “插入” 按钮。

5. 设置图片属性（可选但推荐）

   • 图片插入后，通常会再次弹出设置窗口，您可以在这里进行一些设置，让文章排版更美观：
     • 图片描述/替代文本：为图片添加文字说明，这有助于SEO（搜索引擎优化），当图片无法显示时,会显示这段文字。
     • 图片尺寸：可以设置图片的宽度和高度，建议 勾选“锁定宽高比”，然后只修改宽度或高度中的一个，另一个会按比例自动调整,避免图片变形。
     • 对齐方式：选择图片在文字中的排列方式，如“左对齐”、“右对齐”或“居中”。

6. 确认插入

   • 设置完成后，点击 “确定” 或 “插入” 按钮。

7. 保存文章

   
   （图片来源网络，侵删）
   • 图片会直接出现在编辑器中，别忘了点击文章编辑页面的 “保存” 或 “发布” 按钮。

使用“图集”功能（适合展示多张图片）

如果您想在一篇文章中展示一组图片，并希望用户可以点击放大查看，使用“图集”功能是最佳选择。

操作步骤：

1. 增加普通文章

   • 在后台进入 -> 「普通文章」 -> 「增加普通文章」。

2. 填写基本信息

   填写文章标题、所属栏目、作者等信息。

3. 添加图集

   • 编辑区域下方，您会看到一个 “图集” 的输入框，点击旁边的 “选择图片” 按钮。

4. 上传和排序图片

   • 这时会弹出一个专门的图集上传窗口。
   • 上传图片：点击“上传”或“添加”,批量选择您电脑上的所有图片。
   • 排序：上传后，图片列表会显示出来，您可以 拖动图片 来调整它们的显示顺序。
   • 设置图片说明：在每张图片的“说明”一栏，为这张图片添加简短的文字描述,这个描述会作为图片的标题和alt属性。
   • 设置缩略图：如果需要，可以设置某张图片作为图集的封面/缩略图。

5. 确认并保存

   • 图片上传和设置完成后，点击 “确定”。
   • 您会看到文章内容区域出现了一个类似 [图集] 的标签，点击 “保存” 或 “发布”。

前台效果：用户在网站前台点击这个图集，会进入一个图片轮播/画廊页面,可以左右切换查看所有图片。

使用自定义字段（高级用法，非常灵活）

如果您需要在文章的固定位置（例如文章摘要旁边、文章内容上方/下方）显示一张特定的图片，产品主图”、“作者头像”等,使用自定义字段是最好的方法。

操作步骤：

1. 创建自定义字段

   • 在后台，进入 「核心」 -> 模型管理」。
   • 点击您文章所使用的模型（通常是“普通文章”后面的 “管理字段”）。
   • 点击 “添加新字段”。
   • 字段名称：输入一个英文名称，product_img。
   • 字段提示：输入一个在前台显示给用户的提示文字，产品主图”。
   • 字段类型：选择 “图片”。
   • 保存。

2. 在文章中使用字段

   • 进入 -> 「普通文章」 -> 「增加普通文章」。
   • 您会发现文章编辑页面多出了一个名为“产品主图”的输入框。
   • 点击输入框旁边的 “上传” 或 “选择图片” 按钮,上传或选择一张图片。
   • 保存文章。

3. 在前台模板中调用图片

   • 现在图片数据已经保存,但还需要在模板文件中让它显示出来。
   • 打开您当前文章内容页的模板文件，路径通常是 templets/default/article_article.htm (根据您的模板路径可能不同)。
   • 在您希望显示图片的位置，加入以下代码：

     {dede:field.product_img /}

     这里的 product_img 就是你第一步设置的“字段名称”。

   • 如果需要给图片添加样式（比如控制大小），可以这样写：

     <img src="{dede:field.product_img /}" alt="产品主图" style="max-width: 300px;">

总结与建议

对于绝大多数普通用户，方法一 已经足够满足日常需求，如果需要展示多张图片，就使用 方法二，只有当您有非常规的、复杂的布局需求时，才需要考虑 方法三。