Snug Gallery / Guides

Shopify gallery images in Google Images: an SEO guide

How Google finds and ranks the photos in a Shopify gallery: HTML, alt text, captions, file names and sitemaps, and what a gallery app must get right.

A kitchen fitter with two hundred photos of finished kitchens, a tattoo studio with a portfolio page, a florist with wedding galleries: for stores like these, Google Images is not a side channel. People search for the thing they want to see, click the picture, and arrive on the page. Whether your gallery photos ever show up there depends on a handful of unglamorous details about how the gallery writes its HTML and how you fill in the fields. This guide goes through what Google actually reads when it indexes an image, what Shopify does and does not do for you, and how to set up a Snug Gallery page so that its photos are findable.

How Google finds an image in the first place

Google's own image SEO documentation is short and worth reading in full, but the first point is the one most gallery apps fail: Google finds images through a standard HTML img element with a URL in its src attribute. It does not index images that only exist as CSS backgrounds, and it recommends a plain src fallback even when you use srcset for responsive sizes. A gallery that paints tiles with background-image, or that builds the img elements from JSON after the page loads, is handing Google a page with no pictures on it.

Snug Gallery renders every tile server-side, in Liquid, as an img with a src, a six-step srcset and a sizes attribute. The lightbox version is a separate, larger URL held in a data attribute and only requested when a shopper opens it, so the image Google indexes is the tile, at up to 1600 pixels wide. That is wide enough to be considered a high-quality image in search results while keeping the page light; the page speed guide covers that trade-off in detail.

Lazy loading is fine. Google renders pages and understands the native loading attribute, so an image marked loading="lazy" is still discovered because its src is in the HTML. What breaks indexing is JavaScript-only lazy loading where the real URL lives in a data-src attribute and is only copied into src on scroll. If you are evaluating a gallery app, view the page source of a demo and look for img tags with real cdn.shopify.com URLs in src. If you only find placeholders, the gallery is invisible to image search.

Shopify's sitemap does not cover your gallery

Shopify generates a sitemap.xml for every store and, according to the help centre, it includes your products, each product's primary image, pages, collections and blog posts. Read that carefully: one image per product, and no images at all for pages. A gallery of fifty photos on a page lives outside the sitemap entirely, as do the second to tenth photos of every product.

This is less alarming than it sounds. The sitemap is a discovery aid, not a requirement; Google indexes most images by crawling the page that contains them, which is why the HTML point above matters more than any sitemap. The page itself is in Shopify's pages sitemap, so Google will visit it, and when it does, every img with a real src is a candidate. What you lose without an image sitemap is the ability to attach a title and caption that Google reads independently of the page. For a gallery, the page's own text does that job.

The practical consequence is that each gallery needs a proper page around it. A gallery dropped into the home page under a hero banner competes with everything else on that page for relevance. A gallery on /pages/walnut-kitchens with a heading that says Walnut kitchens and a paragraph about the work tells Google exactly what every photo on the page is of. Google says plainly that it reads the content of the page, including captions and nearby text, to understand an image's subject. Give it something to read.

The four text signals, in order of weight

Alt text comes first. Google calls it the most important attribute for image metadata, and it doubles as the accessibility description screen readers announce, so one piece of writing serves two audiences. Describe what is in the photo as a person would say it: "walnut kitchen island with brass handles and a marble top", not "kitchen1" and not a list of keywords separated by commas. Snug Gallery has an alt field on every image in the editor; if you leave it empty, the block falls back to the alt text stored on the file in Shopify, and failing that to the gallery's name, which at least avoids an empty attribute but tells Google nothing specific. The accessibility checklist has more on writing alt text that works for people, which is the same alt text that works for search.

Captions come second. Snug renders caption titles and text as real HTML next to the image, whether you show them as an overlay, below the tile or in the lookbook's side column, so Google sees them as the text nearest to the image. A caption can carry what alt text should not: the project name, the location, the material, a sentence of context. Alt text says what the image shows; the caption says why it is here.

File names come third and are the one you have to think about before upload. Shopify Files keeps the name of the file you upload in the CDN URL, so a photo uploaded as IMG_4821.jpg stays IMG_4821 forever, and one uploaded as walnut-kitchen-island-brass-handles.jpg carries that name into every size Shopify generates. Google lists descriptive file names among its recommendations. It is a weak signal compared to alt text, but it costs nothing if you rename files before you upload rather than after, because the CDN URL is fixed at upload time.

The page's heading, URL and body text come fourth, and they are where most galleries have the most room to improve. A gallery page with no words is a page about nothing. Two or three paragraphs above or below the gallery describing the work, the products in it, or the shoot are enough to anchor fifty photos to a topic.

Setting up a gallery page for image search

  1. Create a dedicated page in Online Store > Pages with a descriptive handle, for example /pages/wedding-flowers, and a title that matches how people search. One topic per page; split a large portfolio into several pages rather than one gallery of everything.
  2. Rename your photos before uploading. Lowercase, hyphens, a few descriptive words. Do this once in a folder on your computer; it cannot be done after upload without re-uploading.
  3. Upload the images into a Snug gallery and fill in alt text for every photo. Keep it to one sentence that describes the picture. Add caption titles and text where you have real information: the project, the product, the place.
  4. Add two or three paragraphs of text to the page in the theme editor, above or below the gallery block, that describe what the photos show. Use the words a shopper would type, naturally, once or twice. Put a heading on the page that matches the page title.
  5. Where a photo shows products you sell, pin them with the shop-the-look hotspots so the page links to those products. Internal links from an image-heavy page to product pages help both the page and the products.
  6. Publish, then request indexing of the page in Google Search Console. After a few weeks, open Search Console's Performance report, switch the search type to Image, and filter by the page. If impressions are zero after a month, check the page source for real src URLs and confirm the page is not blocked by a password or a noindex tag.

What Google Images traffic is actually worth

Be realistic about the goal. Image search sends visitors who wanted to see something, not necessarily buy it, and the click-through from an image result to the page is lower than from a web result because Google shows the picture first. For a store selling socks, image search is noise. For a store whose product is visual and considered, such as furniture, interiors, tattoos, cakes, event styling and anything made to order, it is often the channel that brings in the person who later books or buys. Those are exactly the stores that build galleries.

There is also a slower benefit. A gallery page with good text, alt and captions is a well-structured page about a topic, and it tends to rank in ordinary web search for long queries like "walnut kitchen island with brass handles" where a product page never would. The photos earn the page a reason to exist, and the text earns it the ranking.

One thing to avoid is reusing the same photos across many pages. Google picks one canonical page for an image, and you do not get to choose which. If a photo appears in the home page carousel, a collection banner and the portfolio gallery, give the portfolio page the version with the full caption and the best alt text, and keep the others decorative, or consider whether they need to be the same file at all.

What Snug Gallery does and does not do here

The block gives Google what it needs by construction: server-rendered img tags with src, srcset and sizes, native lazy loading rather than a script, alt text from your editor with sensible fallbacks, captions as text in the page, and images served from your own shop's Shopify CDN with the file names you gave them. Each image also has a Pinterest share link when you turn that on, which is a second image-discovery channel that works the same way: it needs a real image URL and a description.

What it does not do, today, is emit ImageObject structured data or an image sitemap for gallery pages. Structured data for images is mainly how Google shows the Licensable badge and creator credits, which matters to photographers more than to shops; an image sitemap would let you attach captions Google reads outside the page. Neither is needed for your photos to be indexed, and we would rather you spend the hour on alt text and page copy, which move the needle, than on either of them. If your store is a photography business where licensing badges matter, tell us; it is on the list.

Everything above assumes the images are yours to publish. Customer photos pulled from Instagram or submitted through the gallery's UGC form carry the same technical opportunities, and the same obligation to have permission, which the guide to owning your customer photos walks through.

Frequently asked questions

Do images in a Shopify page gallery appear in Google Images?

They can, as long as the gallery renders each photo as a normal img element with a real URL in src, which Snug Gallery does. Shopify's sitemap only lists each product's primary image and no page images at all, so gallery photos are found by crawling the page rather than through the sitemap. Give the page a descriptive title, some text and alt text on every image.

Does lazy loading stop Google from indexing gallery images?

Not when it is the browser's native loading attribute, because the image URL is still in the HTML. Google renders pages and handles that fine. JavaScript lazy loading that keeps the real URL in a data attribute until the shopper scrolls is the version that hides images from search. Check a gallery app's page source for img tags with cdn.shopify.com URLs in src before relying on it.

Does the image file name matter for Shopify SEO?

A little. Google lists descriptive file names among its image recommendations, and Shopify keeps the uploaded name in the CDN URL for every generated size. It is a weaker signal than alt text and surrounding text, but it is free if you rename files before uploading. After upload the URL is fixed, so the only way to change it is to upload the file again.

Should I add an image sitemap app to my Shopify store?

Usually not for gallery pages. An image sitemap helps Google discover images it cannot reach by crawling and lets you attach captions, but a gallery rendered in HTML on a page that is already in Shopify's pages sitemap is discoverable without it. Spend the effort on alt text, captions and a paragraph or two of page copy first; those affect ranking, the sitemap mostly affects discovery.

More guides