博文转图片分享插件 (Post2ImageShare)

一个为 Typecho 博客系统开发的插件,可以将博客文章转换成适合移动设备分享的精美图片及分享海报。

功能特点

📱 移动端友好

• 生成的图片尺寸适合移动设备分享
• 支持自定义图片宽度和高度
• 自动分页,超过指定高度自动生成多张图片
• 图片长度保持一致,美观整洁

🎨 精美排版

• 第一张图片: 包含文章头图(如有)、标题和摘要
• 后续图片: 展示正文内容,支持文本和图片混排
• 可自定义背景颜色、文字颜色、标题颜色
• 可调节标题、正文、摘要的字体大小

🤖 AI智能摘要

• 集成OpenAI兼容格式的AI模型
• 支持自定义API地址、密钥和模型名称
• 文章无摘要时自动使用AI生成精准摘要
• 支持各种兼容OpenAI接口的AI服务

🎯 用户体验

• 转换按钮设计美观,位置醒目
• 实时进度提示,操作反馈及时
• 图片预览弹窗,支持逐张或批量下载
• 响应式设计,PC和移动端完美适配

安装方法

1. 下载插件

将整个 Post2ImageShare 文件夹上传到 Typecho 的 usr/plugins/ 目录下。

2. 激活插件

登录 Typecho 后台,进入 控制台 → 插件 → 找到 博文转图片分享插件 → 点击 启用。

3. 配置插件

启用后,点击插件的 设置 按钮,配置以下参数:

AI模型设置(必填)

• AI API地址: 兼容OpenAI格式的API地址,如 https://api.openai.com/v1
• AI API密钥: 你的API密钥
• AI模型名称: 使用的模型名称,如 gpt-3.5-turbo, gpt-4 等

图片设置

• 图片宽度: 建议 750-1080px,适合移动设备分享
• 单张图片最大高度: 建议 1334-2000px,超过此高度将自动分页
• 背景颜色: 图片背景色,默认 #FFFFFF
• 文字颜色: 正文文字颜色,默认 #333333
• 标题颜色: 文章标题颜色,默认 #000000

字体设置

• 标题字体大小: 默认 32px
• 正文字体大小: 默认 18px
• 摘要字体大小: 默认 16px

其他设置

• AI自动生成摘要: 开启后,文章无摘要时自动使用AI生成

使用说明

基本使用

1. 打开任意一篇文章页面
2. 在文章标题旁边会看到一个 "转为图片" 按钮
3. 点击按钮开始转换:
   • 系统会先检查文章是否有摘要
   • 如果没有摘要且开启了AI功能,会自动生成AI摘要
   • 然后生成分享图片
4. 转换完成后,会弹出预览窗口显示所有生成的图片
5. 可以选择下载单张图片或批量下载全部图片

图片内容说明

第一张图片

• 文章头图(如果文章设置了封面图)
• 文章标题
• 文章摘要(手动填写或AI生成)
• 发布日期

后续图片

• 文章正文内容,按段落排版
• 文章中的图片会自动插入到合适位置
• 自动分页,确保每张图片高度一致

主题集成

本插件已针对 OneBlog 主题进行了优化,转换按钮会自动出现在文章标题旁边,位置美观合理。

对于其他主题,转换按钮也会自动显示,但位置可能需要微调。如需调整按钮位置,可以修改 assets/css/post2image.css 文件中的样式。

支持的AI服务

本插件支持所有兼容 OpenAI Chat Completion API 格式的服务,包括但不限于:

• OpenAI 官方 API
• Azure OpenAI Service
• 各类国内AI服务(如通义千问、文心一言等,需支持OpenAI格式)
• 自部署的开源大模型(如 LocalAI, vLLM 等)

只需在插件设置中填写相应的 API 地址和密钥即可。

服务器要求

• PHP >= 5.6
• GD 库支持(用于图片生成)
• cURL 扩展(用于调用AI API和下载图片)
• Typecho >= 1.0

检查 GD 库是否安装:

<?php phpinfo(); ?>

查找 "GD" 相关信息。

常见问题

1. 转换按钮不显示?

• 检查插件是否已启用
• 确认当前页面是文章详情页
• 清除浏览器缓存后重试

2. 生成图片失败?

• 检查服务器是否安装了 GD 库
• 检查 PHP 内存限制是否足够(建议至少 128M)
• 查看 Typecho 错误日志获取详细信息

3. AI摘要生成失败?

• 检查 API 地址、密钥、模型名称是否配置正确
• 确认服务器可以访问 AI API 地址(检查网络和防火墙)
• 尝试使用其他 AI 服务提供商

4. 图片中文字显示不全?

• 调整 "单张图片最大高度" 参数
• 减小字体大小
• 系统会自动分页,文字不会丢失

5. 图片质量不理想?

• 增加 "图片宽度" 参数
• 修改 lib/ImageGenerator.php 中的 JPEG 质量参数(第475行,默认90)

自定义开发

修改图片样式

编辑 lib/ImageGenerator.php 文件,可以自定义:

• 图片布局
• 边距和间距
• 字体和排版
• 图片压缩质量

修改按钮样式

编辑 assets/css/post2image.css 文件,可以自定义:

• 按钮颜色和大小
• 弹窗样式
• 动画效果

修改交互逻辑

编辑 assets/js/post2image.js 文件,可以自定义:

• 按钮行为
• AJAX 请求逻辑
• 用户提示信息

技术支持

• 作者: flynn
• 官网: https://www.llingfei.com
• 版本: 1.0.0
• 协议: GPL-2.0

如遇到问题或有改进建议,欢迎访问作者网站留言反馈。

更新日志

v1.0.0 (2025-10-14)

• 首次发布
• 支持文章转图片功能
• 支持AI自动生成摘要
• 支持自定义图片样式
• 优化移动端体验
• 适配 OneBlog 主题

v1.0.2(2025-10-15)

• 第一张图片生成为分享海报
• 自定义AI的提示词

致谢

感谢 Typecho 团队提供优秀的博客系统!

感谢 OneBlog 主题作者的开源精神!

开源协议

本插件遵循 GPL-2.0 开源协议,你可以自由使用、修改和分发,但请保留作者信息和版权声明。

---

享受写作,享受分享! ✨