如何在WooCommerce单商品页面用ACF上传图替换默认特色图？

以下代码可直接通过代码片段插件添加启用，实现指定分类商品页用ACF上传的图片替换默认特色图：

add_action( 'ocean_single_product_thumbnail', 'replace_product_featured_image_with_acf', 1 );
function replace_product_featured_image_with_acf() {
    // 替换为你的ACF图片字段键
    $acf_image = get_field( 'your_acf_image_field_name' );
    
    // 检查ACF图片是否存在且有效
    if ( $acf_image && is_array( $acf_image ) && ! empty( $acf_image['url'] ) ) {
        // 移除默认的缩略图钩子
        remove_action( 'ocean_single_product_thumbnail', 'ocean_single_product_thumbnail_template', 10 );
        
        // 输出ACF图片（保持OceanWP主题的样式结构）
        ?>
        <div class="images">
            <?php woocommerce_show_product_sale_flash(); ?>
            <div class="woocommerce-product-gallery__wrapper">
                <figure class="woocommerce-product-gallery__image">
                    <img src="<?php echo esc_url( $acf_image['url'] ); ?>" 
                         alt="<?php echo esc_attr( $acf_image['alt'] ?: get_the_title() ); ?>" 
                         class="wp-post-image" />
                </figure>
            </div>
        </div>
        <?php
    }
}

关键说明： #

• 把代码中的your_acf_image_field_name替换为你实际创建的ACF图片字段的字段键（不是显示名称）
• 代码会自动判断ACF图片是否存在，不存在时会保留主题默认的特色图输出逻辑
• 输出的图片结构和OceanWP主题原生样式保持一致，不会破坏页面布局

验证步骤： #

1. 保存并启用代码片段
2. 打开指定分类的商品页面，确认ACF图片是否替换了默认特色图
3. 非指定分类的商品页仍会显示原特色图，符合你的条件规则设置

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