|
/ Documentation /Modern Cart/ How to Show / Hide Product Images in the Cart Tray

How to Show / Hide Product Images in the Cart Tray

Modern Cart displays product images inside the cart tray by default. You can control whether images are shown and adjust their size from the plugin settings.

Configuring Product Image Size

  1. Go to Modern Cart > Settings in your WordPress dashboard
  2. Navigate to the Styling tab, and scroll to the Miscellaneous section
  3. Find the “Product Image Size” setting
  4. Choose from Small, Medium, or Large
  5. Save your changes
modern cart product image size

Hiding Product Images on Mobile (Pro)

Modern Cart Pro includes an option to hide product images on mobile devices to improve performance and save screen space.

  1. Go to Modern Cart > Settings, General tab
  2. Find the “Show Product Image In Mobile View” toggle
  3. Toggle it off to hide images on mobile
  4. Save your changes
modern cart show product image in mobile view

Hiding Images via Code (Developer)

To hide product images programmatically, use the moderncart_woocommerce_cart_item_thumbnail filter:

add_filter( 'moderncart_woocommerce_cart_item_thumbnail', function( $html, $cart_item, $cart_item_key ) {
    return ''; // Return empty string to hide the image
}, 10, 3 );

To replace the image with a custom one:

add_filter( 'moderncart_woocommerce_cart_item_thumbnail', function( $html, $cart_item, $cart_item_key ) {
    return '<img src="' . get_template_directory_uri() . '/custom-image.png" alt="Product" />';
}, 10, 3 );

Please refer to this documentation to know how to add custom code to a website: https://cartflows.com/docs/add-custom-codes/

Was this doc helpful?
What went wrong?

We don't respond to the article feedback, we use it to improve our support content.

Need help? Contact Support
Table of Contents