The best WooCommerce image export depends on product role, thumbnail crop setting, theme display size, zoom needs, file format, and whether the image will leave the store in a feed or social preview.
WooCommerce product image size is not one fixed number for every store. Choose the upload copy after you know whether the image is a single product image, catalog image, product thumbnail, gallery thumbnail, variation image, zoom image, lightbox image, social preview, or shopping-feed image.
Decide Size After The Theme And Crop Mode
WooCommerce's product image settings can guide thumbnail width and crop behavior, but the active theme can change the rendered display size. A classic theme may expose WooCommerce Product Images settings in the Customizer. A block theme may handle image dimensions through templates and template parts. A theme that declares WooCommerce image support may hide some width controls while leaving crop choices available.
Use the browser inspector or theme documentation to find the largest rendered product image sizes. Then upload source images that exceed the required display size, especially where zoom or lightbox matters. After changing sizes, crop settings, or themes, regenerate thumbnails so older uploaded images can use the new output.
JPG, PNG, WebP, And GIF Decisions
JPG or JPEG
Use JPG for most product photos, lifestyle images, packaging photos, apparel shots, jewelry photos, home goods, and electronics accessory images where natural color and manageable file weight matter.
PNG
Use PNG for size charts, product diagrams, transparent graphics, merchant-owned logos, UI screenshots with sample data, and typography-heavy visuals that need crisp edges.
WebP
Use WebP when the WordPress or WooCommerce workflow, browser support, theme, CDN, or optimization plugin supports it. Always preview the actual product page and shop grid rather than assuming every plugin handles WebP the same way.
GIF
Use GIF only when short motion helps explain a product feature or safe assembly step. Avoid heavy decorative animation in product galleries because it can slow browsing.
WooCommerce Size, Crop, And Format Matrix
| Image role | Export or format logic | Crop/theme risk | Preview checklist |
|---|---|---|---|
| Single product image | Use a high-quality JPG or WebP photo with enough detail for zoom and lightbox. | Theme may render the product image larger than expected. | Product page, zoom, lightbox, mobile page, and first gallery position. |
| Catalog image | Export consistent product-card crops; JPG works for photos and PNG for crisp graphics. | 1:1 or custom cropping can cut off tall or wide products. | Shop page, category page, related products, upsells, and cross-sells. |
| Product thumbnail | Keep the product recognizable at small size and avoid tiny label-dependent crops. | Small thumbnails hide detail and can use regenerated older crops. | Cart, mini-cart, widgets, mobile cards, and compact modules. |
| Gallery thumbnail | Use clear angle indicators; avoid close-ups that become abstract squares. | Gallery thumbnail is commonly square and may crop important edges. | Thumbnail strip, mobile gallery, selected image, and lightbox entry. |
| Chart or diagram | Use PNG and support the visual with product text. | Responsive downscaling can make small labels unreadable. | Mobile product page, zoom, lightbox, and nearby explanation. |
| Social or feed image | Use a clean, accurate product visual matching the landing page and destination rules. | External crop or feed format may differ from the shop grid. | Social card, feed preview, product URL, title, price, and variation match. |
Choosing 1:1, Custom, Or Uncropped Thumbnails
Choose 1:1 square cropping when a uniform product grid matters and the products can survive a centered square. Choose a custom ratio when your catalog has a consistent shape, such as vertical apparel or wider home goods. Choose uncropped when preserving the full product outline matters more than perfectly even cards. Whichever option you choose, test real products rather than judging from a blank setting screen.
- Use a square crop only after checking tall, wide, and close-up products.
- Use a custom ratio when the catalog has a repeatable visual shape.
- Use uncropped images when product outline accuracy matters most.
- Regenerate thumbnails after changing settings so existing images are rebuilt.
Where To Go Next
FAQs About WooCommerce Size, Crop, And Format
Use JPG for most product photos, PNG for charts and crisp graphics, WebP when your workflow supports it, and GIF only when motion genuinely helps explain the product.
No single size fits every store. WooCommerce gives image roles and settings, but theme layout, zoom, thumbnail cropping, mobile display, and feed use affect the final decision.
Thumbnail cropping controls how catalog-style product thumbnails are shaped, including square 1:1, a custom aspect ratio, or uncropped output.
1:1 creates square crops, custom uses a chosen ratio, and uncropped preserves the original image shape. The best choice depends on product shape and theme layout.
Yes. Keep original photography untouched, then export delivery copies for single product images, shop grids, thumbnails, galleries, zoom, social previews, and feed use.
