WooCommerce：为已登录用户已下载的产品添加「已下载」标记

一、核心逻辑 #

WooCommerce会自动记录用户的产品下载历史，我们要做的就是：

1. 识别当前登录用户是否下载过目标产品
2. 对已下载产品添加可视化标记（徽章/图标）
3. 适配Divi主题的产品展示结构，确保标记正常显示

二、步骤1：添加检测下载记录的代码片段 #

你可以通过两种方式添加代码：

• 方式1：打开主题后台→外观→主题文件编辑器→选择子主题的functions.php，将代码粘贴到文件末尾
• 方式2：安装「Code Snippets」插件，新建代码片段粘贴内容（更安全，避免主题更新丢失代码）

// 检测当前用户是否已下载该产品
function check_user_downloaded_product( $product_id ) {
    if ( ! is_user_logged_in() ) return false; // 未登录用户直接跳过检测
    
    $current_user = wp_get_current_user();
    $user_downloads = wc_get_customer_download_available_products( $current_user->ID );
    
    // 遍历用户所有可下载产品，检查下载次数
    foreach ( $user_downloads as $download ) {
        if ( $download['product_id'] == $product_id ) {
            $order = wc_get_order( $download['order_id'] );
            $download_items = $order->get_downloadable_items();
            
            foreach ( $download_items as $item ) {
                if ( $item['product_id'] == $product_id && $item['download_count'] > 0 ) {
                    return true;
                }
            }
        }
    }
    return false;
}

// 输出已下载标记
function add_downloaded_badge_to_product() {
    global $product;
    if ( ! $product ) return;
    
    $product_id = $product->get_id();
    if ( check_user_downloaded_product( $product_id ) ) {
        echo '<span class="downloaded-badge">已下载</span>';
    }
}
// 将标记挂载到产品列表页的图片区域
add_action( 'woocommerce_before_shop_loop_item_title', 'add_downloaded_badge_to_product', 15 );
// 将标记挂载到产品详情页的标题上方
add_action( 'woocommerce_single_product_summary', 'add_downloaded_badge_to_product', 5 );

代码说明： #

• check_user_downloaded_product：负责查询用户的下载记录，只要产品的下载次数大于0，就判定为已下载
• add_downloaded_badge_to_product：调用检测函数，符合条件就输出带自定义类名的标记
• 最后两行的add_action是把标记绑定到Divi兼容的WooCommerce钩子上，确保标记出现在正确位置

三、步骤2：添加CSS样式美化标记 #

打开Divi后台→主题选项→自定义CSS，粘贴以下代码：

.downloaded-badge {
    position: absolute;
    top: 10px;
    right: 10px;
    background-color: #2ecc71;
    color: #fff;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: bold;
    z-index: 10;
}

/* 适配Divi产品卡片布局，确保标记定位正确 */
.et_pb_wc_product .woocommerce-loop-product__link {
    position: relative;
}

样式自定义： #

• 修改background-color可以更换徽章颜色（比如红色#e74c3c）
• 调整top/right数值可以改变徽章在产品卡片上的位置
• 把已下载改成图标代码（比如Font Awesome的<i class="fa-solid fa-check"></i>），就能换成悬浮图标

四、适配Yith Membership会员 #

这套代码自动兼容Yith会员体系：只要会员下载过产品，WooCommerce就会记录下载次数，标记会正常显示。如果出现标记不生效的情况，可检查：

1. 后台→用户→目标会员→订单，查看对应订单的下载项是否有下载次数记录
2. 如果标记位置不对，可替换钩子（比如换成woocommerce_after_shop_loop_item_title，标记会出现在产品标题下方）

五、安全提示 #

• 不要直接修改父主题的functions.php，优先用子主题或代码插件添加代码，避免主题更新丢失内容
• 添加代码前请备份网站，防止出错导致站点异常

内容的提问来源于stack exchange，提问作者Arlette Wood