SteemMake WooCommerce product images square for Google Shopping: a plugin you can build today
· 5 min read
Google Shopping has a strict minimum image size of 500x500 pixels, and it measures both dimensions. A product photo taken in landscape format, say 1200 by 400, fails on height even though it is wide enough. Google Merchant Center flags it as non-compliant and withholds the listing until the image is fixed.
The standard fix is to open each image in an editor, add padding to the shorter dimension until the canvas is square, and re-upload it. That works once. On a WooCommerce store where product photography is done in batches, or where the images were inherited from another platform, it becomes a recurring task that gets skipped.
A small plugin automates the padding step. It scans your product thumbnails, identifies the ones that are not square, and pads each one with white space to center the original image on a square canvas. Nothing is stretched or cropped. The result is an image that meets Google Shopping's requirement without changing how the product looks.
What one build gives you
- Scan all published WooCommerce product thumbnails for non-square dimensions
- White padding to center non-square images on a square canvas using PHP GD
- Saves padded images to the same file path, updates WordPress attachment metadata
- Admin page at WooCommerce > Square Images with scan and pad operations
- Batch processing of all non-square product thumbnails in one click
What it does not do
- Gallery images on product pages, only main product thumbnails
- Custom padding color, only white
- Images smaller than 500x500 that are already square, no upscaling
- Automatic padding on upload, this is an on-demand admin tool
- Variable product images set on individual variations
The prompt
Loads into the composer so you can edit it first. Nothing is built, and nothing is charged, until you send it.
Build a WordPress plugin called WooCommerce Square Product Images. Plugin Name: WooCommerce Square Product Images. Description: Pads non-square WooCommerce product thumbnail images with white space to meet Google Shopping's 500x500 minimum image requirement. Single PHP file. Requires WooCommerce. Add an admin page under the WooCommerce menu using add_submenu_page, parent slug 'woocommerce'. Page title: Square Product Images. Menu title: Square Images. Capability: manage_woocommerce. Slug: wc-square-images. On the page, render two buttons. Both submit GET requests to the same page. Button 1: Scan Products (GET ?run=scan). Only execute when run=scan and current_user_can('manage_woocommerce') is true. Query all published products with WP_Query(array('post_type'=>'product','posts_per_page'=>-1,'post_status'=>'publish')). For each product, call get_post_thumbnail_id() and get_attached_file(). Skip products with no thumbnail. Call getimagesize() to get width and height. Render a table with columns: Product (linked to the edit post screen in wp-admin), Size, Square. In the Square column, output 'Yes' in green (#006600) or 'No' in red (#cc0000). Button 2: Pad Non-Square Images (GET ?run=pad). Only execute when run=pad and current_user_can('manage_woocommerce') is true. Iterate the same product list. For each product with a non-square thumbnail: get the mime type from the getimagesize() result. Load with imagecreatefromjpeg(), imagecreatefrompng(), or imagecreatefromgif() based on mime type. Let $canvas = max($width, $height). Create a new canvas with imagecreatetruecolor($canvas, $canvas). Fill it white using imagefill() with imagecolorallocate($img, 255, 255, 255). Copy the original centered onto the canvas using imagecopy(), with x-offset ($canvas - $width) / 2 and y-offset ($canvas - $height) / 2. Save back to the same file path: imagejpeg() at quality 90 for JPEG, imagepng() for PNG, imagegif() for GIF. Call wp_update_attachment_metadata($attachment_id, wp_generate_attachment_metadata($attachment_id, $file_path)) to update the attachment record. Render a result table with columns: Product, Original Size, New Size, Status (Padded / Already Square / Skipped). Apply wp-list-table widefat fixed striped to both tables. Above the results, show a WordPress admin notice with class notice notice-info: 'This tool pads main product thumbnail images only. After padding, run Regenerate Thumbnails or wp media regenerate --all to rebuild your theme image sizes from the updated source files.' No external CSS or JavaScript.
Why Google Shopping rejects wide product images
Google Merchant Center enforces a 500x500 pixel minimum for product images. The requirement applies to both width and height independently, so an image that is 1200 pixels wide but only 400 pixels tall fails the height check even though it is large overall.
WordPress and WooCommerce do not alter the source image at upload time. They generate the registered thumbnail sizes your theme needs, but the original file stays exactly as it was uploaded. If you uploaded a 1200x400 JPEG, that is what ends up in the product feed.
The images most likely to fail are product flat-lays and banner-style photos, images exported from design tools at banner dimensions, and product shots migrated from a platform that used a different aspect ratio. Once they are in the media library, there is no built-in way to fix them in bulk.
What the plugin does
The plugin adds a Square Images page under the WooCommerce menu. It has two operations: a scan and a pad step, each triggered by a button.
The scan queries all published products, finds the main product thumbnail for each one, reads the image dimensions, and shows a table of which are square and which are not. Nothing is changed during the scan.
The pad step processes each non-square product thumbnail. It loads the file, calculates the larger of the two dimensions, creates a white square canvas of that size, copies the original onto it centered, and saves the result back to the same file path. The attachment metadata is updated so WordPress knows the new dimensions.
- WooCommerce > Square Images admin page with scan and pad operations
- Per-product report of thumbnail dimensions and square status
- White padding that centers the original image on a square canvas
- Saves to the same file path and updates WordPress attachment metadata
- Admin notice reminding you to regenerate thumbnail sizes after padding
What the plugin cannot do
The plugin pads main product thumbnails only. Gallery images added to the product page through the product gallery panel are not included. If those also need to be square for Google Shopping, they would need a separate pass.
Padding is white. If your product images have a colored or textured background, the padded areas will be white and may look mismatched. In that case, pad the images manually before uploading with an editor that lets you choose the fill color.
The plugin does not upscale. An image that is already square but smaller than 500x500 will not be enlarged. Similarly, it cannot fix images that have been uploaded at a very small size. For those, you need to source a higher-resolution original.
After running the plugin
After padding, the source file is correct, but WordPress caches registered image sizes separately. The cropped versions your theme uses for the shop grid, category pages, and product page still show the pre-padding dimensions until you regenerate them. Install the free Regenerate Thumbnails plugin and run it, or use WP-CLI with wp media regenerate --all.
Once the thumbnails are regenerated, re-fetch or resubmit your Google Merchant Center feed. Affected items should move from disapproved to active within 24 to 72 hours as Google re-crawls the images.
The plugin is an on-demand tool, not an automatic one. It does not process images on upload. If you add new products with landscape images, run the scan again and pad the new ones. Ask Steem to add an upload hook if you want padding to happen automatically at upload time.
Questions
- My product photos have a transparent background. Will white padding look wrong?
Yes, it will. This plugin fills the padded areas with solid white. If your product images are transparent PNGs, the added whitespace will be a white rectangle, which may not match your store design. For transparent images, pad them manually before uploading using an image editor that lets you control the fill, or ask Steem to modify the plugin to accept a custom hex color for the padding.
- The images were padded but my shop still shows the old layout.
WordPress caches registered image sizes separately from the source file. After the plugin pads a source image, your theme's cropped versions still come from the old dimensions. Install the free Regenerate Thumbnails plugin and run it across all images, or use wp media regenerate --all from WP-CLI. Once that finishes, the new padded dimensions will show across the site.
- Can the plugin pad images automatically when I upload new products?
Not out of the box. The current version is an on-demand tool. If you add new products with landscape images, run the scan again and pad the flagged ones. To make padding happen automatically on upload, ask Steem to add a hook on wp_handle_upload or add_attachment that checks dimensions and pads on the fly.
- I have variable products with images set on each variation. Will those be padded?
No. The plugin only processes the main product thumbnail set via the Set product image panel in the product editor. Variation images are stored differently and are not included. If your variation images also fail Google Shopping, you would need to extend the plugin to query variation post types as well.
- Is it safe to run this on a live store?
The scan is fully read-only. The pad step modifies image files, so back up your uploads directory or test on a staging copy first. The plugin overwrites the source file, so there is no automatic undo. If something goes wrong, restoring from backup is the recovery path.
The prompt
Loads into the composer so you can edit it first. Nothing is built, and nothing is charged, until you send it.
Build a WordPress plugin called WooCommerce Square Product Images. Plugin Name: WooCommerce Square Product Images. Description: Pads non-square WooCommerce product thumbnail images with white space to meet Google Shopping's 500x500 minimum image requirement. Single PHP file. Requires WooCommerce. Add an admin page under the WooCommerce menu using add_submenu_page, parent slug 'woocommerce'. Page title: Square Product Images. Menu title: Square Images. Capability: manage_woocommerce. Slug: wc-square-images. On the page, render two buttons. Both submit GET requests to the same page. Button 1: Scan Products (GET ?run=scan). Only execute when run=scan and current_user_can('manage_woocommerce') is true. Query all published products with WP_Query(array('post_type'=>'product','posts_per_page'=>-1,'post_status'=>'publish')). For each product, call get_post_thumbnail_id() and get_attached_file(). Skip products with no thumbnail. Call getimagesize() to get width and height. Render a table with columns: Product (linked to the edit post screen in wp-admin), Size, Square. In the Square column, output 'Yes' in green (#006600) or 'No' in red (#cc0000). Button 2: Pad Non-Square Images (GET ?run=pad). Only execute when run=pad and current_user_can('manage_woocommerce') is true. Iterate the same product list. For each product with a non-square thumbnail: get the mime type from the getimagesize() result. Load with imagecreatefromjpeg(), imagecreatefrompng(), or imagecreatefromgif() based on mime type. Let $canvas = max($width, $height). Create a new canvas with imagecreatetruecolor($canvas, $canvas). Fill it white using imagefill() with imagecolorallocate($img, 255, 255, 255). Copy the original centered onto the canvas using imagecopy(), with x-offset ($canvas - $width) / 2 and y-offset ($canvas - $height) / 2. Save back to the same file path: imagejpeg() at quality 90 for JPEG, imagepng() for PNG, imagegif() for GIF. Call wp_update_attachment_metadata($attachment_id, wp_generate_attachment_metadata($attachment_id, $file_path)) to update the attachment record. Render a result table with columns: Product, Original Size, New Size, Status (Padded / Already Square / Skipped). Apply wp-list-table widefat fixed striped to both tables. Above the results, show a WordPress admin notice with class notice notice-info: 'This tool pads main product thumbnail images only. After padding, run Regenerate Thumbnails or wp media regenerate --all to rebuild your theme image sizes from the updated source files.' No external CSS or JavaScript.