[AI]：从0开始在 WordPress 上构建个人 AI 云相册(1)

在接下来的一个月，我将从0开始，拆解和实践，如何借助AI实现个人服务器相册功能的搭建。

基本目标：这个相册不是简单的图片堆砌，而是一个带时间戳、地理标签和创作情绪的个人视觉档案库，风格留白，带有评论功能、脱离主题本身布局、访问速度适中。

计划分如下4步开展：

第一步：架构与风格决策

1.1 明确素材元

• 内容源：信息如何批量提取，拍摄日期（EXIF提取）、创作者（「执迷者X」）、设备型号、地点
• 内容的SEO：根据图片信息，生成SEO名称。

1.2 站点结构决策

结论：在现有 WordPress 站点（lifetruth.top）下新建独立页面，而非子域名或独立站点。

理由：

• SEO 权重继承：相册页面可共享主站域名权威度
• 备份一体化：纳入 WordPress 现有备份体系（UpdraftPlus）
• 开发成本低：复用主题基础样式，仅覆盖特定 CSS

第二步：AI 驱动的样式迭代

2.1 用 AI 生成初始版式

向 ChatGPT/Claude 提供精确 prompt：

生成一个 WordPress 单页相册的 CSS 代码，要求：
- 亮白主题，主色 #fefefe，文字 #222
- 瀑布流布局（masonry），图片圆角 8px
- 悬停时图片轻微放大（scale 1.03）+ 淡入拍摄信息
- 响应式：移动端 2 列，平板 3 列，桌面 4 列
- 禁止使用外部字体图标

迭代技巧：每次只改一个变量（如把「圆角 8px」改成「圆角 0px」），让 AI 给出对比和逐步逼近。

2.2 功能清单（UI 层面）

• 图片卡片：缩略图 + 悬停叠加层（显示拍摄日期、设备、地点）
• 懒加载：使用原生 loading="lazy" 属性
• 灯箱：用 PhotoSwipe 插件（轻量，无 jQuery 依赖）
• 筛选：按年份、地点、设备（需 ACF 字段支持）

第三步：技术实现与性能优化

3.1 数据流设计

// 伪代码：图片上传后的处理流程
1. 用户上传照片 → 触发 WordPress `add_attachment` Hook
2. 调用 PHP EXIF 读取函数（exif_read_data）
3. 提取 DateTimeOriginal、Make、Model
4. 存入 ACF 自定义字段：shooting_date, camera_model
5. 生成 WebP 缩略图（用 Imagick 或 ShortPixel 插件）

3.2 性能优化清单

代码示例：在主题的 functions.php 禁用 Elementor 等页面构建器的冗余样式：

add_action('wp_enqueue_scripts', function() {
    if (is_page('gallery')) {
        wp_dequeue_style('elementor-frontend');
    }
}, 999);

第四步：评论功能取舍

决策：不开发独立评论，复用 WordPress 原生评论系统。

理由：

• 原生评论已支持 Akismet 防垃圾、邮件通知
• 单张照片页（灯箱内）不宜塞入评论框，破坏沉浸式体验
• 可在相册页底部增加一个「留言板」区域，用短代码调用评论区：

// 在相册页面底部插入
<?php comments_template(); ?>

未来扩展：若真需要图片级评论，可研究 WP Discuz 插件的「Media Comment」模块，但会显著增加复杂度。