WC Catalog Images to DIV Converter
·
Automatically converts WooCommerce product images into CSS background-image DIVs -- fixing image resize, cropping, and stretching issues across your e …
🖼️ WC Catalog Images to DIV Converter transforms the way WooCommerce displays product images. Instead of relying on default <img> tags that often cause cropping, stretching, and resize conflicts, this plugin wraps product images inside <div> elements using CSS background-image — giving you perfectly contained, uniformly displayed product photos everywhere.
🔧 Zero Configuration Required — Simply install and activate. No settings to configure, no code to write. The plugin works automatically across your WooCommerce store.
✅ Use Cases
- 🛒 Fix stretched or squished product images on the Shop page — Products with different aspect ratios display uniformly without distortion.
- 🖼️ Eliminate image cropping issues — No more awkwardly cropped thumbnails. Images are contained and centered automatically.
- 📐 Uniform catalog grid layout — All product images in the catalog grid appear at consistent sizes regardless of the original image dimensions.
- 🛍️ Clean cart thumbnails — Product images in the cart and mini-cart display neatly as background images instead of inconsistent thumbnails.
- 🔍 Better product gallery display — Single product page gallery images and thumbnails are enhanced with background-image rendering.
- 📱 Responsive image handling — Built-in responsive CSS ensures product images look great across all devices and screen sizes.
- 🎨 Work with variable product swatches — Automatically handles variation swatch images on product detail pages.
- 🏪 Multi-column shop layouts — Supports 3, 4, and 5 column shop layouts with properly sized image containers.
- ⚡ Reduce image processing overhead — By setting gallery thumbnails to a higher resolution (1000×1000), the plugin avoids WooCommerce regenerating multiple image sizes.
- 🧩 Theme compatibility — Works with most WooCommerce-compatible themes without additional configuration needed.
🔌 Works Great With These Popular Plugins
- WooCommerce (Required) — The core eCommerce plugin this is built for.
- Variation Swatches for WooCommerce — Enhanced swatch image display on product pages.
- YITH WooCommerce Wishlist — Catalog images remain consistent in wishlist views.
- WooCommerce Product Filter — Filtered product grids maintain uniform image display.
- Jetpack — Compatible with Jetpack’s lazy loading and CDN features.
- Smush / ShortPixel / Imagify — Image optimization plugins work seamlessly alongside.
- Elementor / WPBakery — Compatible with popular page builders that use WooCommerce widgets.
- WooCommerce Blocks — Works with the classic WooCommerce shortcode-based catalog display.
