在Woocommerce电子邮件通知中显示产品图像

Question

在Woocommerce上，我已将电子邮件订单详细信息php模板文件中的$show_image变量更改为true，但我仍然无法在电子邮件通知中显示图像：

<div style="margin-bottom: 40px;">
<table class="td" cellspacing="0" cellpadding="6" style="width: 100%; font-family: 'Helvetica Neue', Helvetica, Roboto, Arial, sans-serif;" border="1">
    <thead>
        <tr>
            <th class="td" scope="col" style="text-align:<?php echo esc_attr( $text_align ); ?>;"><?php esc_html_e( 'Product', 'woocommerce' ); ?></th>
            <th class="td" scope="col" style="text-align:<?php echo esc_attr( $text_align ); ?>;"><?php esc_html_e( 'Quantity', 'woocommerce' ); ?></th>
            <th class="td" scope="col" style="text-align:<?php echo esc_attr( $text_align ); ?>;"><?php esc_html_e( 'Price', 'woocommerce' ); ?></th>
        </tr>
    </thead>
    <tbody>
        <?php
        echo wc_get_email_order_items( $order, array( // WPCS: XSS ok.
            'show_sku'      => $sent_to_admin,
            'show_image'    => true,
            'image_size'    => array( 100, 100 ),
            'plain_text'    => $plain_text,
            'sent_to_admin' => $sent_to_admin,
        ) );
        ?>
    </tbody>
    <tfoot>
        <?php
        $totals = $order->get_order_item_totals();

        if ( $totals ) {
            $i = 0;
            foreach ( $totals as $total ) {
                $i++;
                ?>
                <tr>
                    <th class="td" scope="row" colspan="2" style="text-align:<?php echo esc_attr( $text_align ); ?>; <?php echo ( 1 === $i ) ? 'border-top-width: 4px;' : ''; ?>"><?php echo wp_kses_post( $total['label'] ); ?></th>
                    <td class="td" style="text-align:<?php echo esc_attr( $text_align ); ?>; <?php echo ( 1 === $i ) ? 'border-top-width: 4px;' : ''; ?>"><?php echo wp_kses_post( $total['value'] ); ?></td>
                </tr>
                <?php
            }
        }
        if ( $order->get_customer_note() ) {
            ?>
            <tr>
                <th class="td" scope="row" colspan="2" style="text-align:<?php echo esc_attr( $text_align ); ?>;"><?php esc_html_e( 'Personal Message:', 'woocommerce' ); ?></th>
                <td class="td" style="text-align:<?php echo esc_attr( $text_align ); ?>;"><?php echo wp_kses_post( wptexturize( $order->get_customer_note() ) ); ?></td>
            </tr>
            <?php
        }
        ?>
    </tfoot>
</table>

我需要添加链接以及产品图像。一旦用户点击图像，它应该重定向到特定的页面。

将消息从假更改为真，但图像仍未显示在网站中。

Answer 1

要在电子邮件通知中显示图像，请将更改恢复为原始模板，并改为使用：

add_filter( 'woocommerce_email_order_items_args', 'custom_email_order_items_args', 10, 1 );
function custom_email_order_items_args( $args ) {
    $args['show_image'] = true;

    return $args;
}

要将产品链接添加到图像和项目名称（可选），您将使用：

add_filter( 'woocommerce_order_item_thumbnail', 'add_email_order_item_permalink', 10, 2 ); // Product image
add_filter( 'woocommerce_order_item_name', 'add_email_order_item_permalink', 10, 2 ); // Product name
function add_email_order_item_permalink( $output_html, $item, $bool = false ) {
    // Only email notifications
    if( is_wc_endpoint_url() )
        return $output_html;

    $product   = $item->get_product();

    return '<a href="'.esc_url( $product->get_permalink() ).'">' . $output_html . '</a>';
}

代码进入活动子主题（或活动主题）的function.php文件。测试和工作。

缩略图大小更改：

您还可以在$args['show_image']=true下操作此挂钩中的缩略图大小，默认为32 x 32像素 添加此行：

$args['image_size'] = array( 48, 48 );

经过测试，也能正常工作。