向阳乔木：用免费AI编程工具Trae + MCP，把任意文章变图文并茂精美网站，甚至生成图片引流。附提示词和详细操作步骤

向阳乔木：用免费AI编程工具Trae + MCP，把任意文章变图文并茂精美网站，甚至生成图片引流。附提示词和详细操作步骤 向阳乔木：用免费AI编程工具Trae + MCP，把任意文章变图文并茂精美网站，甚至生成图片引流。附提示词和详细操作步骤 Modified June 1, 2025 在Trae右侧的对话框中，输入@，选中我们刚创建的智能体。 再输入 号，点击File，然后浏览找到文件夹中的Markdown文件。 敲回车，智能体就会开始工作。 1. 调用MCP一张张上传images文件夹图片到七牛云。 2. 上传完成，自动替换Markdown文件地址为七牛云的图片地址。 3. 基于替换好的Markdown文件内容，生成网页。 注意：生成网页Token消耗巨大，上下文空间可能不足，需点继续，让AI持续生成。 如果生成失败，可复制Markdown内容，用Raycast AI、POE等第三方AI工具生成网页。 在Trae右侧的对话框中，输入@，选中我们刚创建的智能体。 再输入 号，点击File，然后浏览找到文件夹中的Markdown文件。 敲回车，智能体就会开始工作。 1. 调用MCP一张张上传images文件夹图片到七牛云。 2. 上传完成，自动替换Markdown文件地址为七牛云的图片地址。 3. 基于替换好的Markdown文件内容，生成网页。 注意：生成网页Token消耗巨大，上下文空间可能不足，需点继续，让AI持续生成。 如果生成失败，可复制Markdown内容，用Raycast AI、POE等第三方AI工具生成网页。 🔗 原文链接： https://mp.weixin.qq.com/s? biz=Mz... https://mp.weixin.qq.com/s? biz=Mz... 原创 向阳乔木 向阳乔木推荐看2025年04月30日 08:45 天津 前言 很硬的教程，但学会后真的非常有价值。 组合N个工具，让AI生成保留图片的精美网页，甚至生成长图引流，批量做媒体矩阵号，都有特别有帮助。 AI生成网页 用 AI 生成单页HTML玩法。 最早是我好友歸藏摸索出来。 我也根据自己需求，设计过几版。 现在很多公司都开始这么搞。 比如秘塔搜索，深度研究后点击“生成互动网页” https://metaso.cn/ 经过一段时间 就能会生成一个排版还OK的网页。 再比如纳米AI网页生成MCP，经智能体调用。 最后一步会生成个二级域名网页，方便阅读和分享。 我觉得这些公司，都应该给藏师傅版税 😎 潜在问题 单页HTML，除内嵌样式和HTML代码，其他资源都来自其他网站。 这里就会存在个问题。 如何想给页面添加图片，添加音频和视频就很不方便。 需要外部存储空间，而且需要有公开访问地址。 即使有图床，也需要一张张上传，插入到原始文稿的对应位置，非常繁琐。 解决办法 直到最近MCP爆火，Trae和纳米都出了智能体。 让这个问题，有了一个不错的解法。 核心思路： 文章连同图片下载打包成本地Markdown，用Trae 创建智能体，调用多个MCP完成图片自动上传，公网地址替换，网页生成。 实操案例 阿里Qwen 3 刚发布，读到一篇写得特别好的文章，来自甲木未来派公众号。 原文地址： https://mp.weixin.qq.com/s/YGsMfEitubV1jK2nubFrig 如何快速这篇图文并茂的公众号文章，变成一个保留原始图片的精美网页？ 第一步 剪藏文章到飞书 安装飞书剪藏Chrome插件 https://chromewebstore.google.com/detail/%E9%A3%9E%E4%B9%A6%E5%89%AA%E5%AD%98/mofcmpgnbnnlcdkfchnggdilcelpgegn 安装后，公众号文章右下角点“剪刀”图标或者鼠标右键，选飞书剪藏。 一键把任意文章变成飞书文档。 第二步 把飞书文档下载为Markdown 安装 Cloud Document Converter Chrome插件 https://chromewebstore.google.com/detail/cloud document converter/ehkomhhcinhikfddnmklbloahaakploh 打开刚才剪藏的飞书文档，点击插件图标，选择Download as Markdown 这时会下载一个压缩包 解压后，是一个Markdown文件和一个images文件夹。 第三步 用Trae创建MCP和智能体 Trae是字节出的免费 AI 编程工具。 https://www.trae.ai/ 尤其海外版，支持最强的Claude 3.7 sonnet模型，特别适合生成漂亮网页。 MCP和智能体配置是最复杂的，但完成后一劳永逸。 打开Trae，点击右上角设置图标，选MCP，配置 3 个MCP。 • Sequential Thinking （可选） • Filesystem • 七牛MCP 安装配置MCP教程，参考这篇： https://mp.weixin.qq.com/s/m8AB9qsr45 jS3mzlQybag https://mp.weixin.qq.com/s/m8AB9qsr45 jS3mzlQybag 常用MCP配置文件查看： https://xiangyangqiaomu.feishu.cn/wiki/EsBtwDERNiCeEkkE0D9cLn34n0g 再点击Trae 右上角设置图标，选智能体，配置如下。 1. 智能体名称，以后可以@调用。 2. 提示词，写MCP调用要求，描述工作流 3. Sequential Thinking，拆解规划任务（可选） 4. Filesystem，读写本地文件，写入生成的HTML代码。 5. qiniu mcp，自己写的七牛MCP。 提示词： 第四步 调用智能体，生成网页 运行Trae，点击：文件 打开文件夹，浏览到刚解压的文件夹打开。