一、小程序概述
小程序为小陈开发，有喜欢的朋友可与我联系~
欢迎体验
1.1 开发目的
本软件是基于 WordPress REST API 的博客阅读微信小程序前端，为 WordPress博客提供完整的移动端阅读体验。通过调用后端 API 实现文章浏览、互动操作（点赞/收藏/评论）、个性化设置等功能，使用户无需离开微信即可获取博客内容的更新和互动。
1.2 软件功能
- 首页：轮播 Banner、精选栏目、置顶文章、文章瀑布流
- 详情页：富文本阅读、图片预览、目录导航、点赞/收藏/评论、分享/海报
- 分类/标签：分类网格、标签云、点击筛选文章
- 搜索：关键词搜索、搜索历史、热搜推荐
- 收藏管理：文章收藏/取消、收藏列表
- 点赞管理：查看已点赞文章
- 阅读历史：历史记录浏览
- 消息通知：查看评论回复
- 个人中心：微信登录、头像昵称编辑、主题/卡片模式切换
- 深色模式：跟随系统/强制深色/强制浅色三档切换
- 海报生成：Canvas 绘制文章海报、保存到相册
二、运行环境
- 手机系统：iOS 8.0+ / Android 8.0+
- 微信版本：iOS 微信 8.0+ / Android 微信 8.0+
- 基础库版本：2.24.0+
三、软件架构
3.1自定义组件
- post-card：文章卡片组件（三种模式：standard/compact/horizontal）
- custom-tab-bar：自定义底部导航栏（5个Tab，含徽标）
四、功能模块详细说明
4.1 首页（pages/index/index）
功能描述：
- 顶部导航栏（自定义）：显示站点名称，随滚动透明/不透明切换
- 轮播 Banner：展示置顶/推荐文章，支持自动轮播和手动滑动
- 置顶悬浮栏：快速进入搜索
- 精选栏目：分类入口，彩色卡片设计，点击进入分类文章列表
- 文章列表：信息流样式，支持下拉刷新/上拉加载
操作方式：
- 下滑浏览文章列表
- 点击文章卡片进入详情
- 点击 Banner 进入对应文章
- 点击搜索图标进入搜索页
4.2 详情页（pages/detail/detail）
功能描述：
- 文章标题/作者/日期/分类/标签展示
- 富文本正文内容
- 正文图片点击放大（图片预览）
- 文章目录导航（自动提取 H2/H3 标题生成目录树）
- 点赞/收藏/评论交互
- 评论列表（支持多级回复）
- 相关文章推荐
- 上下篇文章导航
- 分享（微信原生分享 + 海报生成）
- 阅读进度条
- 底部浮窗工具栏
操作方式：
- 上下滑动阅读
- 点击图片放大
- 右下角📑打开目录，点击跳转章节
- 底部栏点赞/收藏/评论/海报
4.3 分类页（pages/categories/categories）
功能描述：
- 分类网格展示（3列）
- 每个分类卡片有独立颜色和图标
- 显示分类名和文章计数
- 点击进入分类文章列表
- 顶部提供「标签」入口
4.4 标签页（pages/tags/tags）
功能描述：
- 标签云展示
- 显示标签名和文章计数
- 点击进入标签文章列表
- 支持骨架屏加载
4.5 文章列表页（pages/list/list）
功能描述：
- 支持按分类/标签筛选
- 文章卡片模式（大图/小图）切换
- 分页加载、下拉刷新
- 导航栏标题动态显示分类/标签名
4.6 搜索页（pages/search/search）
功能描述：
- 关键词搜索
- 搜索结果分页展示
- 搜索历史（本地存储）
- 热搜词推荐
4.7 收藏页（pages/favorites/favorites）
功能描述：
- 显示已收藏文章列表
- 点击进入文章详情
- 可取消收藏
- 卡片模式切换（大图/小图）
- 未登录时提示登录
4.8 我的点赞（pages/my-likes/my-likes）
功能描述：
- 显示已点赞文章列表
- 分页加载
- 未登录提示登录
4.9 阅读历史（pages/history/history）
功能描述：
- 自动记录阅读过的文章
- 按时间倒序排列
- 点击重新阅读
- 支持清除历史
4.10 消息页（pages/messages/messages）
功能描述：
- 显示收到的评论回复
- 点击跳转到原文对应评论位置
- 未登录提示登录
4.11 个人中心（pages/mine/mine）
功能描述：
- 微信登录/登出
- 头像编辑（调用微信头像）
- 昵称编辑
- 统计卡片：收藏数、点赞数、阅读数
- 功能菜单：我的收藏、我的点赞、阅读历史
- 设置：深色模式切换、首页卡片模式、列表卡片模式
- 清除缓存
4.12 深色模式
功能描述：
- 三档切换：跟随系统 / 强制深色 / 强制浅色
- 通过主题「我的」页循环切换：跟随系统 → 深色 → 浅色
- 所有页面统一的暗色视觉风格
技术实现：
- CSS 变量系统（app.wxss 定义全局色板）
- @media (prefers-color-scheme: dark) 自动跟随系统
- .force-dark / .force-light CSS 类覆盖
4.13 海报生成
功能描述：
- 将文章内容生成为分享海报图片
- 包含：渐变背景、标题、摘要、封面图、作者、日期、分类
- 预览后保存到手机相册
4.14 登录系统（pages/login/login）
功能描述：
- 微信授权登录
- 用户协议与隐私政策确认
- 登录成功后自动跳转回来源页面
五、操作说明
5.1 日常使用
- 打开小程序 → 首页浏览推荐文章
- 通过分类/标签/搜索找到感兴趣的内容
- 点击文章卡片进入阅读
- 阅读中可点赞、收藏、写评论
- 通过目录导航快速跳转章节
- 点击图片放大查看
- 在「我的」页查看收藏和阅读历史
- 根据环境切换深色/浅色模式
5.2 分享操作
- 文章详情页 → 右上角「...」→ 分享给好友
- 详情页底部 → 🎨 海报 → 生成海报 → 保存相册
六、插件和下程序前端
分为小程序前端代码和wordpress插件
暂未上传~
