首页 > 解决方案 > 在 WooCommerce 快速订单预览窗口的现有产品列中显示产品缩略图

问题描述

我正在尝试将 WooCommerce 产品缩略图显示到 WooCommerce 快速订单窗口,我尝试在下面的代码中使用“woocommerce_admin_order_preview_end”和“woocommerce_admin_order_preview_get_order_details”但没有任何改变,谁能指出我正确的方向?谢谢!

我尝试的代码

add_filter( 'woocommerce_admin_order_preview_end', 'display_product_image_in_order_item', 20, 3 );
function display_product_image_in_order_item( $item_name, $item, $is_visible ) {
    // Targeting view order pages only
    if( is_wc_endpoint_url( 'view-order' ) ) {
        $product   = $item->get_product();
        $thumbnail = $product->get_image(array( 60, 120));
        if( $product->get_image_id() > 0 )
            $item_name = '<div class="item-thumbnail">' . $thumbnail . '</div>' . $item_name;
    }
    return $item_name;
}
add_filter( 'woocommerce_admin_order_preview_get_order_details', 'display_product_image_in_order_item', 20, 3 );
function display_product_image_in_order_item( $item_name, $item, $is_visible ) {
    // Targeting view order pages only
    if( is_wc_endpoint_url( 'view-order' ) ) {
        $product   = $item->get_product();
        $thumbnail = $product->get_image(array( 60, 120));
        if( $product->get_image_id() > 0 )
            $item_name = '<div class="item-thumbnail">' . $thumbnail . '</div>' . $item_name;
    }
    return $item_name;
}

标签: phpwordpresswoocommercehook-woocommerceorders

解决方案


通过woocommerce_admin_order_preview_line_item_columns过滤器挂钩,我们可以选择删除现有产品列并添加新列,以进行订单预览。

通过woocommerce_admin_order_preview_line_item_column_' . sanitize_key( $column ), '过滤器钩子,我们将重写产品列的内容,并添加产品缩略图。

所以你得到:

function filter_woocommerce_admin_order_preview_line_item_columns( $columns, $order ) {
    $new_product = $columns['product'];
    unset($columns['product']);

    return array_merge( array( 'new_product' => $new_product ), $columns );
}
add_filter( 'woocommerce_admin_order_preview_line_item_columns', 'filter_woocommerce_admin_order_preview_line_item_columns', 10, 2 );

function filter_woocommerce_admin_order_preview_line_item_column_new_product( $html, $item, $item_id, $order ) {
    $hidden_order_itemmeta = apply_filters(
        'woocommerce_hidden_order_itemmeta',
        array(
            '_qty',
            '_tax_class',
            '_product_id',
            '_variation_id',
            '_line_subtotal',
            '_line_subtotal_tax',
            '_line_total',
            '_line_tax',
            'method_id',
            'cost',
            '_reduced_stock',
            '_restock_refunded_items',
        )
    );
    
    $product_object = is_callable( array( $item, 'get_product' ) ) ? $item->get_product() : null;
    
    $thumbnail = $product_object->get_image( array( 60, 60 ) );
    
    // Add thumbnail
    if ( $product_object->get_image_id() > 0 ) {
        $html .= '<div class="item-thumbnail">' . $thumbnail . '</div>';
    }
    
    $html .= wp_kses_post( $item->get_name() );

    if ( $product_object ) {
        $html .= '<div class="wc-order-item-sku">' . esc_html( $product_object->get_sku() ) . '</div>';
    }

    $meta_data = $item->get_formatted_meta_data( '' );

    if ( $meta_data ) {
        $html .= '<table cellspacing="0" class="wc-order-item-meta">';

        foreach ( $meta_data as $meta_id => $meta ) {
            if ( in_array( $meta->key, $hidden_order_itemmeta, true ) ) {
                continue;
            }
            $html .= '<tr><th>' . wp_kses_post( $meta->display_key ) . ':</th><td>' . wp_kses_post( force_balance_tags( $meta->display_value ) ) . '</td></tr>';
        }
        $html .= '</table>';
    }
  
    return $html;
}
add_filter( 'woocommerce_admin_order_preview_line_item_column_new_product', 'filter_woocommerce_admin_order_preview_line_item_column_new_product', 10, 4 );

结果


推荐阅读