WordPress 批量创建画漆色产品：FTP 图像自动建站方案

本文介绍如何通过扩展 WordPress 媒体上传流程，结合 AJAX 和 WooCommerce，将 FTP 目录中近 2000 张“漆色图”与“刷痕图”自动批量生成可筛选的画漆色产品，并实现悬停切换效果。

本文介绍如何通过扩展 WordPress 媒体上传流程，结合 AJAX 和 WooCommerce，将 FTP 目录中近 2000 张“漆色图”与“刷痕图”自动批量生成可筛选的画漆色产品，并实现悬停切换效果。

要做一套专业级的油漆色卡展示，最麻烦的往往不是设计本身，而是后面那一大堆重复劳动。每种颜色都手动建一个产品，不仅耗时得惊人——2000+ 条目，动辄就是几十个小时——而且中间任何一个环节都可能出错。这里给出的，就是一套可以直接落地的自动化方案：不依赖 CSV 导入，也不借助插件，而是基于 WordPress 原生的媒体上传机制，在图片上传完成的那一刻，自动触发 WooCommerce 产品的创建与关联流程。

核心思路：上传即建站

关键在于「监听媒体上传完成事件」——通过 Ja vaScript 扩展 wp.Uploader 的 success 方法，在每张图片上传成功后立即发送 AJAX 请求，交由后端 PHP 处理：

• 若文件名以 paintcolor_ 开头 → 创建新商品（设置名称、价格、下载项、特色图）；
• 若文件名以 paintbrush_ 开头 → 查找对应商品，将该图存入 ACF 自定义字段（如 paint_brush）；
• 其他文件名则忽略，确保流程仅对目标图像生效。

文件命名规范（强制前提）

为精准识别图像类型与配对关系，请严格统一命名规则（支持 .png, .jpg, .jpeg）：

✅ 名称中仅允许小写字母、数字、下划线；空格必须替换为 _；{name} 部分需完全一致（大小写敏感）。
⚠️ 必须先上传全部 paintcolor_ 图像，再上传 paintbrush_ 图像——否则刷痕图无法找到匹配商品而被自动删除。

实现步骤详解

1. 前端监听脚本（/dist/js/admin.js）

(function($) {
if (pagenow === 'upload') {
$.extend(wp.Uploader.prototype, {
success: function(attachment) {
const data = {
action: 'media_upload_generate_product',
author_id: attachment.attributes.author,
attachment_id: attachment.attributes.id,
filename: attachment.attributes.filename,
title: attachment.attributes.title,
type: attachment.attributes.type
};
$.ajax({
url: ajaxurl,
method: 'GET',
data,
timeout: 300000, // 5分钟超时防阻塞
success: res => console.log('✅ Product created:', res.data),
error: xhr => console.error('❌ Failed:', xhr.responseJSON?.data?.message)
});
}
});
}
})(jQuery);

2. 后端处理逻辑（functions.php）

// 注册 AJAX 处理函数
add_action('wp_ajax_media_upload_generate_product', 'ajax_media_upload_generate_product');
function ajax_media_upload_generate_product() {
$title = sanitize_text_field($_GET['title']);
$attachment_id = (int) $_GET['attachment_id'];

// 匹配漆色图
if (strpos($title, 'paintcolor_') === 0) {
$clean_title = ucwords(str_replace('_', ' ', str_replace('paintcolor_', '', $title)));
$slug = sanitize_title($clean_title);

// 检查是否已存在同名商品
$existing = get_page_by_path($slug, OBJECT, 'product');
if (!$existing) {
$product = new WC_Product_Simple();
$product->set_name($clean_title);
$product->set_status('publish');
$product->set_price(19.99);
$product->set_image_id($attachment_id);
$product->sa ve();

// 关联到 ACF 字段（需提前在 ACF 中创建 'paint_color' 字段）
update_field('paint_color', $attachment_id, $product->get_id());
wp_send_json_success(['id' => $product->get_id()]);
} else {
wp_delete_attachment($attachment_id, true); // 清理重复上传
wp_send_json_error(['message' => "Product '$clean_title' already exists."]);
}
}
// 匹配刷痕图
elseif (strpos($title, 'paintbrush_') === 0) {
$clean_title = ucwords(str_replace('_', ' ', str_replace('paintbrush_', '', $title)));
$slug = sanitize_title($clean_title);
$existing = get_page_by_path($slug, OBJECT, 'product');

if ($existing && isset($existing->ID)) {
update_field('paint_brush', $attachment_id, $existing->ID);
wp_send_json_success(['id' => $existing->ID]);
} else {
wp_delete_attachment($attachment_id, true);
wp_send_json_error(['message' => "No product found for '$clean_title'."]);
}
} else {
wp_send_json_error(['message' => 'Filename must start with paintcolor_ or paintbrush_.']);
}
wp_die();
}

3. ACF 字段配置（必需）

在 Advanced Custom Fields 中创建两个图像字段：

• 字段名称：paint_color，标签：「漆色主图」，返回格式：Image ID
• 字段名称：paint_brush，标签：「刷痕悬停图」，返回格式：Image ID
  并将这两个字段添加到 WooCommerce 产品编辑页。

注意事项与优化建议

• 安全性：生产环境请添加 current_user_can('manage_woocommerce') 权限校验；
• 性能：2000+ 图像建议分批上传（每次 ≤ 20 张），避免超时；
• 容错：代码已内置重复检测与自动清理，但首次运行前请备份数据库；
• 扩展性：如需支持多属性（如色系、RAL 编号），可在 $product->set_meta_data() 中追加自定义字段；
• 前端展示：利用 WooCommerce REST API 或 WP_Query 获取产品列表，配合 CSS :hover 切换 paint_color / paint_brush 图像即可实现悬停效果。

此方案将传统数日工作压缩至数小时，且完全基于 WordPress 原生能力，无需第三方插件依赖，兼顾稳定性与可维护性。