Add a gallery to a Shopify collection, cart, 404 or blog

Most people add their first gallery to the home page or a dedicated Gallery page, because that is where the tutorials put it. Then the questions start: can the same gallery sit under the product grid on a collection page, in the empty cart, on the 404 page, at the end of a blog post? The answer for Snug Gallery is yes to all of those, with a couple of pages that no app can reach. This guide goes through the templates one by one, what the gallery looks like in each, and the settings worth changing when the block moves.

How app blocks reach a page

Snug Gallery renders through a theme app block. In an Online Store 2.0 theme, every template that is a JSON file, which in a modern theme is nearly all of them, is a list of sections, and the theme editor lets you add an Apps section to any of them, or an app block inside a section that declares it accepts blocks. The template does not care what the block is. If you can open a template in the editor and see Add section, you can put a Snug Gallery block on it.

That rule covers the home page, product pages, collection pages, the collection list, the cart, the blog and article templates, the search page, the 404 page and every page template, including the alternate templates you create for a lookbook or a press page. The settings on the block are the same everywhere; the block settings reference lists them. What changes from template to template is the company the gallery keeps and the width it is given.

Collection pages: under or above the product grid

The collection template is the most requested home for a gallery after the home page, usually for lifestyle photos of the collection's products in use. Open the editor, navigate to a collection, and add the block above or below the product grid section. Because the block is on the template, it appears on every collection that uses that template, with the same gallery. That is fine for a brand-wide mood gallery and wrong for a per-collection one.

For per-collection galleries, create an alternate collection template per collection, say collection.summer, assign it to the collection in the admin, and place a different gallery on each. Shopify's own documentation on alternate templates covers the assignment step. A lighter alternative, when the galleries share images, is one gallery with tags and the filter bar, so the summer collection links to the gallery filtered to summer; the filtered gallery URL guide shows the link format.

On a collection page the gallery competes with the product grid for attention, so keep it short: two rows of a grid, or a single slider row, rather than a forty-image masonry. Shoppers came to buy; the gallery is there to show the products worn or placed, not to replace the grid.

The cart page

A gallery on the cart template sounds odd until you look at the empty state. An empty cart is a blank page with one sentence and a button, and a small gallery of bestsellers in context, with pins linking to products, fills it with something to do. The cart template accepts app blocks like any other, and the block appears both when the cart is empty and when it is full, so position it below the cart items and keep it to one row.

Two cautions. Themes with a cart drawer never show the cart page to most shoppers, who check out from the drawer, so a gallery there reaches only people who open the full cart. And the cart page is where shoppers hesitate; a gallery that pulls them into browsing can cost as well as earn. Test it against the empty-cart case specifically, where there is nothing to lose.

The 404 page

The 404 template is the one most store owners have never opened in the editor. Shoppers reach it from old links, dead product URLs and typos, and the default is a sentence and a search box. A gallery with pins to live products turns a dead end into a shop window, and it is one of the few places where a large gallery is welcome, because the shopper has no other task on the page.

Use pins that link to collections rather than individual products here, so the pins outlive their targets. A 404 page that links to products which themselves 404 is the worst version of the problem; the shop the look pins guide explains how pins behave when a product goes away.

Blog posts and the blog index

The article template puts a gallery at the end, or beginning, of every post, and the blog template does the same for the index page. For a single post that needs its own gallery, an alternate article template works the same way as for collections; the blog post gallery guide walks through it, including the trade-off against pasting images into the post body.

Width is the thing to watch on article templates. Most themes constrain article text to a narrow reading column and let sections run full width, so a gallery block placed as its own section will be wider than the text above it. That is usually what you want for photos; if not, the block's container width setting brings it back into the column.

Search, collection list and alternate page templates

The search template behaves like the collection template: a gallery sits below results and shows regardless of the query. It is useful for a no-results state and intrusive otherwise, so most stores leave it off. The collection list template, the page that shows all collections, takes a gallery well as a header. And any page template you create, page.lookbook or page.press, can hold a gallery and be assigned to as many pages as you like, which is how a store runs three lookbooks with one theme.

The pages no app block can reach

Checkout is one. Shopify's checkout does not run theme app blocks at all; it has its own extension system with its own rules, and a storefront gallery app has no place in it. Nothing you do in the theme editor puts a gallery on the checkout, the thank-you page or the order status page.

The password page is the other, with a qualification. Whether the password template accepts app blocks depends on the theme: some themes ship it as a JSON template with sections, in which case the Apps section is available and a gallery works as a teaser for a store that has not opened yet; others ship it as a fixed Liquid template with no section list, and then there is nowhere to add one. Open the password page in the editor and look for Add section. If it is there, the gallery works; if it is not, the theme has decided for you.

Customer account pages are a third category: the new customer accounts are hosted by Shopify, not by the theme, and take no theme blocks. Legacy customer account templates in the theme can accept app blocks in some themes, but almost nobody wants a gallery there.

Moving a gallery between templates

The gallery itself lives in the app, and the block on a template only points at it. So moving a gallery from the home page to a collection page is two editor operations: remove the block from one template, add it to the other, pick the same gallery. The images, order, captions and pins come along because they were never in the theme. The same gallery can be on several templates at once, which is how the home page and the 404 page can share one set of lifestyle photos without duplicating uploads.

The one thing to re-check after a move is the width and column settings, because a block sized for a full-width home page section may be too dense in a narrower spot. Preview on a phone before saving; the editor's mobile preview is accurate for the block.

Frequently asked questions

Can I add Snug Gallery to a Shopify collection page?

Yes. Open the collection template in the theme editor and add the Snug Gallery block above or below the product grid. The block appears on every collection using that template; for a different gallery per collection, create alternate collection templates or use one tagged gallery with the filter bar.

Can a gallery go on the Shopify checkout or thank-you page?

No. Checkout, the thank-you page and the order status page do not run theme app blocks. They have a separate extension system that storefront gallery apps do not participate in.

Does the password page support a gallery block?

It depends on the theme. If the password template is a JSON template with sections, you can add an Apps section with the gallery. If the theme ships it as a fixed Liquid template, there is no Add section option and no app can place a block there.

Do I have to upload images again to show the same gallery on two pages?

No. The gallery lives in the app and the theme block only references it. Add the block to as many templates as you like and select the same gallery in each; the images, order, captions and pins are shared.