在WooCommerce电子邮件通知上显示自定义产品图像

Question

我正在尝试修改自动生成的WooCommerce订单电子邮件中的产品图像。请注意，我尝试使用钩子来实现这一点，而不是创建一个修改过的电子邮件模板。

首先，我在单一产品页面上有一个隐藏的输入。我有一些JS设置图像的ID，它基于产品的颜色（我用ACF制作的自定义属性）。

<input class="js-col-img-id" type="hidden" name="product-col-img-id" value="">

为了便于参考，我在购物车页面上做了以下工作：

// Add custom attributes to cart item data
add_action('woocommerce_add_cart_item_data', 'jwd_add_custom_attr_to_cart', 10, 3);

function jwd_add_custom_attr_to_cart($cart_item_data, $product_id, $variation_id) {
    $attrs = array(...,'product-col-img-id');

    foreach ($attrs as $attr) {
        $san_attr = filter_input( INPUT_POST, $attr );

        if ( !empty( $san_attr ) ) {
            $cart_item_data[$attr] = $san_attr;
        }
    }

    return $cart_item_data;
}

// This function sets the image ID in the cart, and it displays the image properly
add_action( 'woocommerce_before_calculate_totals', 'bwa_new_price' );
function bwa_new_price($cart) {

    // ...

    $cart_items = $cart->get_cart();

    foreach($cart_items as $item) {
        $data = $item['data'];

        // product-col-img-id is sent through the hidden input when the add to cart form is submitted
        $colour_img_ID = $item['product-col-img-id'] ?? false;

        if ($colour_img_ID) {
            $data->set_image_id($colour_img_ID);
        }
    }
}

// Add custom attributes to order
add_action( 'woocommerce_checkout_create_order_line_item', 'jwd_add_attr_to_order_items', 10, 4 );
function jwd_add_attr_to_order_items( $item, $cart_item_key, $values, $order ) {
    if ( !empty( $values['product-colour'] ) ) {
        $item->add_meta_data( 'Colour', $values['product-colour'] );
    }

    // I tried replicating this for the img ID. It does display it in the var dump mentioned below, and it does display it as an actual label in the e-mail (which I'd want to get rid of). The difficulty then becomes reading the ID through code and setting the product to display that image
    if ( !empty( $values['product-col-img-id'] ) ) {
        $item->add_meta_data( 'col_img_id', $values['product-col-img-id'] );
    }
}

这很好，但我很难按顺序复制电子邮件。到目前为止，我遇到了以下几点。这会在电子邮件中显示图像，但这是产品的特色图像。值得注意的是，“show_image”键被设置为true。

// Add prod IMG to e-mails
function jwd_add_images_woocommerce_emails( $output, $order ) {

    // set a flag so we don't recursively call this filter
    static $run = 0;

    // if we've already run this filter, bail out
    if ( $run ) {
        return $output;
    }

    $args = array(
        'show_image'    => true,
        //'image_size'    => array( 300, 300 ),
    'image_size' => 'full',
    );

    // increment our flag so we don't run again
    $run++;

    // if first run, give WooComm our updated table
    return wc_get_email_order_items($order, $args);
}
add_filter( 'woocommerce_email_order_items_table', 'jwd_add_images_woocommerce_emails', 10, 2 );

为了修改图像，我找到了这个过滤器，但是我很难弄清楚我需要做什么来复制我在购物车页面上所做的事情。我得到的最接近的是有$item_data工作，我确实在var转储中看到了product-col-img-id键，尽管它在一个受保护的对象中，我不确定如何访问。即使我能访问，我也不确定如何从这里设置图像。

add_filter('woocommerce_order_item_thumbnail', 'jwd_add_colour_img', 10, 2);
function jwd_add_colour_img($image, $item) {
    $item_id = $item->get_id();

    //var_dump($item->get_current_data());

    $product = $item->get_product();
    $product_id = $item->get_product_id();
    $item_data = $item->get_data();
    $col_img_id = false;

    $item->set_image_id(1);

    foreach ($item_data as $key => $item) {
        //current_data

            var_dump($item);




        //echo "<br><br>";
        $col_img_id = $item['product-col-img-id'] ?? false;

        if ($col_img_id) {
            break;
        }
    }

    //var_dump($col_img_id);
    //$item_id = $item->get_product_id();
    //var_dump(wc_get_order_item_meta( $item_id, 'col_img_id', true ) );

    return $image;
}

Answer 1

要获取自定义元数据，可以使用WC\u data方法get\u meta（）。

请尝试以下操作以在电子邮件通知中显示自定义图像：

// Save custom image ID as order item meta
add_action( 'woocommerce_checkout_create_order_line_item', 'save_custom_image_id_to_order_item', 10, 4 );
function save_custom_image_id_to_order_item( $item, $cart_item_key, $values, $order ) {
    if ( isset($values['product-colour']) && ! empty($values['product-colour']) ) {
        $item->add_meta_data('Colour', $values['product-colour'] );
    }

    if ( isset($values['product-col-img-id']) && ! empty($values['product-col-img-id']) ) {
        $item->add_meta_data('_col_img_id', $values['product-col-img-id'] );
    }
}

// (optional) Force display item image on emails
add_filter( 'woocommerce_email_order_items_args', 'show_image_on_email_notifications' );
function show_image_on_email_notifications( $args ) {
    $args['show_image'] = true;

    return $args;
}

// Display custom image on emails
add_filter( 'woocommerce_order_item_thumbnail', 'display_email_order_item_custom_image', 10, 2 );
function display_email_order_item_custom_image( $image, $item ) {
    // Only on email notifications
    if( is_wc_endpoint_url() )
        return $image;

    $image_id = $item->get_meta('_col_img_id');
    
    if( $image_id ) {
        $image = wp_get_attachment_image( $image_id, array( 32, 32 ), false, array() );
    }

    return $image;
}

代码functions.php活动子主题（或活动主题）的文件中。它应该工作。