Working with the gallery section – Archetype

Expanse offers a Gallery section you can use to showcase multiple images in a full-width layout.

Adding the gallery section

Log in to your Theme editor and navigate to the page you would like to display this section.
You'll see a list of available sections on the left-hand side. Locate the Add section button and click on it.
From the list of available sections, find and select Gallery.

After adding the Gallery section, you will be presented with customization options and settings that you can adjust to match your store's style.

Heading: Adds a title for the section.
Heading size: Adjusts the size of the heading text.
Text alignment: Sets the heading alignment to left, right, or center.
Images per row: Controls how many images are displayed in each row on desktop view (2-5). On mobile devices, each image is displayed on its own row.
Enable full width: Makes the section span the entire width of the page when enabled.
Show top padding: Adds extra space at the top of the section.
Show bottom padding: Adds extra space at the bottom of the section.
Grid spacing: Controls the amount of pixel space between each image block.

Click to open one of the preloaded Image blocks to customize it.

Each of the blocks can be rearranged by clicking, holding, then dragging the block with the cursor.

Select image: Assigns an image to the block.
Image alignment: Sets the image position within each block to top, center, or bottom.
Image crop: Choose whether to display the image at its natural size or crop it to square, portrait, landscape, rounded, rounded wave or arch.

Images with a square, 1:1 aspect ratio with a minimum size of 800 x 800px are recommended.

If you prefer to use a portrait or landscape ratio, check out our size guide for those recommendations.