Snug Gallery / Guides

An About page photo gallery for your Shopify store

How to build a meet-the-team, studio or shop-front gallery on a Shopify About page: layout, caption fields, image shapes, alt text and what to leave out.

The About page is the second most visited page on many small stores, and on most of them it is a wall of text with one photo of the founder at the top. Shoppers who click it want to see something: the people, the workshop, the shop on the corner, the dog. This guide is about putting a gallery there with Snug Gallery, and the handful of decisions that make it read like a page rather than a dump of photos.

Why a gallery and not the theme's image blocks

Most Shopify themes can show a few images on a page with image-with-text or multicolumn sections, and for two or three photos that is enough. The limits show up fast. Each image is a separate block to edit, the shapes are fixed by the section, there is no lightbox, and adding a tenth photo means adding a tenth block and dragging it into place. A gallery block holds the whole set in one place, lets you reorder by dragging, resizes every image through Shopify's CDN, and opens photos full size when a visitor clicks.

Snug Gallery adds its blocks to any theme section that accepts app blocks, including the sections on a standard page template, so the About page needs nothing special. The app blocks guide covers where blocks can go on each template, and the no-code guide walks through adding the first one.

Decide what the page is showing

An About page gallery usually wants to do one of three jobs, and they want different layouts. A team gallery shows people, one per tile, and benefits from a regular grid where every face is the same size. A studio or workshop gallery shows a place, in mixed shots that are strongest at their own proportions. A shop-front or history gallery is a narrative, a handful of images in a deliberate order, where a slider or a collage reads better than a grid.

It is fine to use more than one. A short grid of the team above the text and a masonry set of the workshop below it are two blocks on the same page, each with its own settings, and the page reads better for having them separate than it would with everyone and everything in one block.

Team photos: a square grid

For people, use the grid layout with the aspect ratio set to Square. Every tile is the same shape, the row lines up, and head-and-shoulders portraits crop well to a square because the subject is in the middle. Three or four columns on desktop is the usual range; above that the faces get small. Snug Gallery shows fewer columns automatically on phones.

Captions do the work of a staff directory. Each image has a title and a caption text field; put the name in the title and the role in the text, and choose the caption position that shows them below the tile rather than as a hover overlay, so they are readable without a mouse. The captions guide explains the two positions and what each field is for. Keep roles short: Founder, Studio manager, Packs your orders. The alt text should be the person's name, which is what a screen reader user needs and what a search engine can use.

Photograph everyone the same way if you can: same background, same distance, same light. A grid is unforgiving of one photo taken in a different room. If the existing photos are mixed, a 3:4 portrait ratio is more forgiving than a square, because it keeps more of each frame, and the image size guide has the detail on how fixed ratios crop.

Studio, workshop and shop photos: masonry at original shape

Place photos are the opposite case. A workbench is wide, a doorway is tall, a shelf of jars is square, and forcing them into one shape loses what made each one worth taking. The masonry layout keeps every photo at its own proportions and packs them into columns, and the row layout does the same in justified rows. Both ignore the aspect ratio setting on purpose.

Order them as a walk through the space, outside to inside, or as a day, morning to packing up. The gallery's manual sort order is set by dragging in the admin, and the sort order guide covers the alternatives if you would rather it stayed fresh. Captions here are optional; a short line under a few key photos (The dye room. Where every order is packed.) is better than a caption under all of them.

If a photo shows a product, a shoppable pin on it links straight to that product, which turns a studio photo into a quiet product reference without a sales pitch. The shoppable lookbook guide explains pins. Use them sparingly on an About page; two or three across the gallery is plenty.

A short history: slider or collage

Some stores have a story to tell in pictures: the first market stall, the first shop, the move, the current one. Five or six images in a fixed order want a slider, one image at a time with captions carrying the year and a sentence, or a collage, where one large image anchors a pattern of smaller ones. Both are layouts in the same block, and the layouts guide has examples of each.

For a slider on an About page, turn autoplay off. Visitors are reading; a slideshow that moves on its own competes with the text next to it. The caption fields are where the dates go.

Old photos, phone photos and scans

About page galleries are where the oldest and least consistent images on the site end up: a scan of a photo from twenty years ago next to a phone shot from yesterday. The gallery handles the sizes; Shopify's CDN scales everything to fit the tile, and a small image is shown at the size it has rather than blown up. What it cannot fix is the mix of shapes and colour. Masonry hides the shape problem. For colour, a quick pass in a phone's photo editor to bring the brightness into line goes a long way.

Upload the originals, not screenshots of them. A 1200 pixel scan is fine for a tile; a 400 pixel one will look soft in the lightbox. If the only copy of an old photo is small, leave it out of layouts with large tiles and give it a spot in a tighter grid.

Alt text on an About page

Every image in the gallery has an alt text field, and on this page it is easy to fill in well because every photo has an obvious description: a name, a place, a year. Write it as the description a sighted visitor would give someone on the phone. Maria, founder, in the workshop. The original stall at Camden Market, 2014. Avoid repeating the caption word for word if the caption is shown; screen readers read both. The accessibility checklist covers the rest of the page.

What to leave out

Customer photos. They belong in a gallery on the product pages or a dedicated page, where they help a buying decision; on the About page they dilute the people and the place. Stock photos of anything: visitors can tell, and on this page in particular it undoes the point. More than about twenty images in one block: an About page is read, not browsed, and a wall of photos gets scrolled past. If you have more, split them into blocks with headings between, or move the overflow to a separate page and link to it.

The one thing to add is a line of text above or below the gallery saying who or what it shows. A gallery with no introduction is a puzzle; a gallery after one sentence is a page.

A page that works

The founder's story at the top, in text, with a single large photo. A square grid of the team, four across, names and roles underneath. A paragraph about the workshop, then a masonry block of eight to twelve photos of it, two of them pinned to products. A short slider of the shop over the years at the bottom. Three blocks, three jobs, one page that answers the question people came to it with: who are you, and where does this stuff come from. Snug Gallery does the gallery part; the photos and the sentences are yours.

Frequently asked questions

Can I add a photo gallery to the About page in Shopify without code?

Yes. Open the theme editor on the About page, add a Snug Gallery block to any section that accepts app blocks, and pick the gallery you created in the app. No Liquid or page template changes are needed, and the block moves with the page if you change themes.

Which gallery layout is best for a meet-the-team page?

A grid with the aspect ratio set to Square, three or four columns, with the name in the caption title and the role in the caption text shown below each tile. Every face is the same size and the rows line up, which is what a team page needs.

How do I show the name and job title under each team photo?

Each image in Snug Gallery has a caption title and a caption text field. Put the name in the title and the role in the text, then set the block's caption position to below the image rather than overlay, so the captions are always visible, including on phones where there is no hover.

Should studio and workshop photos be cropped to the same shape?

Usually not. Use the masonry or row layout, which keeps every photo at its original proportions and packs them together. Cropping place photos to one shape loses the wide benches and tall doorways that make them worth showing. Save the fixed square shape for portraits.

More guides