New WooCommerce blocks cart item image filter

Starting in WooCommerce 9.6, we will be adding a new filter that allows cart item images to be modified in the Cart and Checkout blocks. The filter works by modifying the result of the Store API request.

The details

The new hook is named woocommerce_store_api_cart_item_images and it receives 3 parameters:

• $product_images An array of image objects to be filtered.
• $cart_item The cart item the images belong to.
• $cart_item_key The cart item key.

An example using the new hook to replace the cart image with a random one from Lorem Picsum is below:

add_filter(
  'woocommerce_store_api_cart_item_images',
  function ($product_images, $cart_item, $cart_item_key)
    {
      $image_path = "https://picsum.photos/seed/$cart_item_key/200";
      return [
        (object)[
          'id'        => (int) 0,
          'src'       => $image_path,
          'thumbnail' => $image_path,
          'srcset'    => (string)'',
          'sizes'     => (string)'',
          'name'      => 'Random product image',
          'alt'       => 'Random product image',
        ]
    ];
  },
  10,
  3
);

Join the conversation and provide feedback

We welcome feedback from our community to make the Cart and Checkout experience fit users’ needs. You can share your thoughts and questions in the official Slack channel: #woocommerce-blocks-and-block-themes

To join the WooCommerce Community Slack workspace, follow the instructions on this guide to joining the conversation.