MEDIA GUIDES / Ecosystems

Shopify Broken Images: How to Find and Fix Them

Key takeaways:

  • A broken product image costs a sale. A store with missing images across multiple products signals poor maintenance to both shoppers and search engines.
  • Broken images also affect SEO: they produce crawl errors in Google Search Console, they can’t carry alt text signals, and they contribute to poor page experience scores.
  • Most broken image issues on Shopify have a clear cause and a straightforward fix. This guide covers all of them.

You’ve seen it a hundred times: a broken image icon where a product photo should be, a grey placeholder where your hero banner used to live, or a collection grid with a missing thumbnail. Broken images on a Shopify store are frustrating for customers, damaging for conversions, and a signal to search engines that something is wrong.

The good news: broken images on Shopify almost always have one of six causes, and all of them are fixable. This guide covers how to identify broken images across your store, what causes them, and how to fix each one; plus how to prevent the same issues from recurring.

In this article:

How to Find Broken Images on Your Shopify Store

Google Search Console

The Coverage report in Google Search Console flags pages with crawl errors, including pages where images failed to load. Check the Excluded tab for any Crawl anomaly errors, which often indicate broken or missing assets. The Core Web Vitals report may also surface pages with unusually poor LCP scores that could be caused by broken image loads.

Visual Inspection by Page Type

Systematically browse your store’s key page types: homepage, top collection pages, top product pages, and blog posts. Look for broken image icons (a small icon with a torn image or question mark) or blank white/grey spaces where images should appear. Do this on both desktop and mobile, as some images break only at specific screen sizes.

Crawl Tools

Tools like Screaming Frog, Sitebulb, or Ahrefs Site Audit will crawl your entire store and flag all broken image URLs in a single report far faster than manual inspection for large catalogs. Look for 404 responses on image file requests.

The Six Most Common Causes of Broken Shopify Images

1. The Image File was deleted from the Shopify Admin

If a product image is deleted from the Files section or directly from the product editor, any page that references that image URL will display a broken image. This is the most common cause for stores that regularly update their product catalogue.

The fix: Re-upload the missing image and re-assign it to the affected product or page.

2. The Product or Collection Was Deleted, but the Page Is Still Indexed

When a product is deleted, Shopify redirects its URL by default. However, any pictures linked to that item are also removed. If a Google-cached version of the page still references the old image URL, search engines may report broken images on pages that no longer exist in their current form.

The fix: Set up a 301 redirect from the old product URL to a relevant category or replacement product, and ensure Google recrawls the page.

3. Image URLs Contain Special Characters or Spaces

File names with spaces, special characters (#, &, %, +), or uppercase letters can cause image URLs to break in certain contexts. Shopify generally handles URL encoding, but third-party apps or CSV imports that don’t encode file names correctly can produce broken URLs.

The fix: Rename the file without special characters, re-upload, and re-assign.

4. Theme Update Broke Image Variable References

When a Shopify theme is updated, the Liquid variables used to output image URLs sometimes change. If your theme customizations reference image variables that no longer exist in the updated theme, images will break. This most commonly affects custom sections or metafield-based image displays.

The fix: Check the theme’s changelog for any variable name changes and update your Liquid code accordingly.

5. Oversized or Unsupported Image Files

Shopify accepts images up to 20MB and 25 megapixels. Uploading a file that exceeds these limits will fail silently in some contexts: the upload appears to succeed, but the image doesn’t display correctly.

The fix: Resize and compress the image before uploading. A product image does not need to exceed 2048 × 2048px or 2MB before compression.

6. Third-Party App or CDN Delivery Failure

If your images are being served through a third-party CDN or image delivery app and that service experiences downtime or configuration changes, images can appear broken across your entire store. This is distinct from a Shopify-side issue: your images are intact, but the delivery URL is temporarily unavailable.

The fix: Fall back to Shopify’s native CDN. The long-term fix is to use a reliable delivery infrastructure, like Cloudinary.

Pro Tip!

Optimize images without sacrificing quality

Cloudinary Assetlink delivers images through Cloudinary’s enterprise CDN: a globally distributed infrastructure with 99.99% uptime that isn’t dependent on any single third-party service.


-> Install Assetlink free from the Shopify App Store

How to Fix Broken Images on Shopify

  1. Identify the broken image URL: Right-click the broken image in a browser and select Inspect. The img src attribute shows the URL Shopify is trying to load. This tells you whether the image file itself is missing or whether the URL is malformed.
  2. Check whether the file exists: In your Shopify admin, go to Content > Files. Search for the file name from the broken URL. If it’s not there, the file has been deleted and needs to be re-uploaded.
  3. Re-upload and reassign: Upload the correct image file. Then navigate to the product, collection, or page where the image is used and reassign it. Shopify will generate a new CDN URL for the re-uploaded file.
  4. Check for URL encoding issues: If the file exists and the URL contains %20 (encoded spaces) or other special characters, rename the file to remove them, re-upload, and reassign.
  5. Test on mobile: After fixing, check that the image displays correctly on both desktop and mobile. Some theme-specific image rendering issues only appear at certain viewport sizes.
  6. Request a recrawl in Search Console: If the broken images appeared in Google Search Console, request a recrawl of the affected URLs after fixing to clear the errors.

How to Prevent Broken Images on Shopify

Fixing broken images reactively is necessary but inefficient. These practices reduce the likelihood of images breaking in the first place.

  • Standardize file naming: Use lowercase letters, hyphens instead of spaces, and no special characters for all image file names before uploading. This eliminates the majority of URL encoding issues.
  • Never delete images from the Files section without checking usage: Shopify’s admin doesn’t warn you if a file is referenced by a product, collection, or page. Before deleting any image, search for it in your product catalogue.
  • Test theme updates on a staging store: Before applying a theme update to your live store, test it on a development theme or Shopify’s theme preview. Check all image-heavy page types for display issues.
  • Monitor with Plug In SEO or Screaming Frog: Set up a regular automated crawl of your store to catch broken images before customers do.
  • Use a robust delivery infrastructure: Images delivered through Cloudinary’s CDN are served from Cloudinary’s own infrastructure rather than Shopify’s default hosting. This means delivery reliability doesn’t depend on Shopify’s CDN uptime, and images are always served at the optimal format and size for the requesting device.

Frequently Asked Questions

Why are my Shopify product images not showing?

The most common causes are:

  • The image file was deleted from your Shopify admin
  • The image URL contains special characters that aren’t being encoded correctly
  • A theme update broke the image variable reference.

Check Google Search Console’s Coverage report for crawl errors on affected pages, then inspect the broken image URL in your browser to identify whether the file is missing or the URL is malformed.

How do I fix a missing image placeholder on Shopify?

A missing image placeholder means the product has no assigned image, or the file has been deleted. Go to the product editor in your Shopify admin, scroll to the Media section, and either re-upload the product image or select an existing image from your files. The placeholder will disappear once an image is assigned.

Why are my Shopify images blurry?

Blurry images almost always mean the source image was too small: typically under 800 × 800px. When Shopify scales a small image up to fill a larger display area, it loses sharpness. The fix is to re-upload at a higher resolution: 2048 × 2048px for product images. Blurriness on high-DPI retina screens specifically is caused by serving an image at half the required resolution for those displays.

How do I stop Shopify images from breaking after a theme update?

Theme updates sometimes change the Liquid variable names used to output image URLs, which breaks image display in custom sections. Before applying a theme update, check the changelog for any variable changes, test the update on a preview theme before going live, and audit all custom Liquid sections that reference image variables after updating.

 

Last updated: Jun 23, 2026
★★★★★
4.7 (28 reviews)