Gallery section
The Gallery section shows images side by side in Split, half or full screen height, each with an optional caption and link.
Applies to: Split 5.1.0 and later. Added in: Split 1.0.0. Last checked: 2026-10-13 against Split 5.1.0.
The Gallery section shows a row of images across the full width of the page, each with an optional caption and link. Use it for lookbook shots, store photos or a grid of category images.
Where to find it: select Add section in the theme editor, then choose Gallery.
Adding images
Each image is an Image block. The section starts with four.
- Image sets the picture. Split crops it to fill its box and keeps the image's focal point in view, if you set one in Shopify.
- Link makes the whole image clickable. On desktop the image zooms in slightly when the mouse is over a linked image.
- Open link in a new window appears once Link is set.
- Caption shows a short white text at the bottom of the image, over a soft dark gradient.
How the images fill a row
Split puts up to 4 images in a row. A fifth image starts a new row, and so on.
- The images of a row share the width equally: 1 image takes the full width, 2 take half each, 3 a third, 4 a quarter.
- The last row works the same way with the images left over. With 6 images you get a row of 4 and a row of 2 wider images.
- On phones 480 px wide and narrower, every image takes the full width. With 4 images per row, phones and tablets held upright show them two by two.
Image height
Image height sets how tall every image is:
- Half: half the screen height, below the header.
- Full height: the full screen height, below the header. A single image is shown a little shorter on phones and on tablets held upright.
Images are always cropped to the box. Keep the subject in the middle of the picture. See Image size recommendations for sizes that crop least.
Can I show the images without cropping?
No. Split does not show Gallery images at their natural shape. Use the Image section for one uncropped image across the page, or several Image sections one after the other.
How do I get rows with a different number of images?
Add several Gallery sections one after the other. For example, a Gallery with 2 images followed by a Gallery with 3 images gives a row of two and a row of three, each with its own Image height.
All Gallery settings
Every setting in this group, with its type and default.
Accepts these blocks: Image.
Image height (dropdown, default: Half): Sets the height of every image: Half is half the screen height below the header, Full height the full screen height. Images are cropped to fill the box. Options: Half, Full height.
Image block
Where to find it: Gallery → Add block → Image
Image (image).
Link (link).
Open link in a new window (checkbox, default: off). Shown only when Link is set.
Caption (text field).
Related pages
- Images with text section: images side by side with a title and button on each.
- Image section: one full-width image at its natural height.
- Image size recommendations: image sizes for half and full height boxes.
- How Split is built: the screen-height boxes Split builds pages from.
Flex grid
The Flex grid section builds a grid of media cards and text cards that span columns and rows in Split, behind three presets including a media collage.
Heading
The Heading section shows a heading, text, button and line as a header for the sections below it in Split, with alignment and custom colors.