Social gallery shows up to twelve photos from your social media account, with your account name and a Follow us button. The Masthead preset uses it on its home page.
You choose and upload the photos yourself. Nothing is loaded from the social network, so the section is as fast as any other, sends no data about your customers anywhere, and never breaks when a network changes its rules. Each photo can link to its post.
Where to find it
In the theme editor, click Add section and choose Social gallery. You can add it to the home page or any other page that takes sections, as many times as you like.
Layout options
Layout sets how the photos are shown. Grid shows rows of square photos. Slideshow shows one row that customers swipe, or move with the previous and next buttons. Columns on desktop and Columns on mobile set how many photos fit across, and Space between photos sets the gap, down to None for a solid wall of photos.
Section settings
Select the section in the theme editor to see these settings, in this order.
| Setting | Options | What it does |
|---|---|---|
| Eyebrow | Text. | A short label above the heading, such as "New in". With Show editorial numbering on in theme settings, the section's number is shown before it. |
| Heading | Text. | The section's heading. Select a word and make it italic for emphasis. Leave it empty to show no heading. |
| Heading size | Small, Medium, Large or Extra large. Default: Medium. | How large the heading is set. |
| Account name | Text. | Your account name, shown beside the Follow us button, for example @marenvale. Leave it empty to show none. |
| Profile link | Link. | The address of your profile. The Follow us button links here and opens in a new window. |
| Layout | ||
| Layout | Grid or Slideshow. Default: Grid. | Grid shows rows; Slideshow shows one row that scrolls sideways. |
| Columns on desktop | 2 to 6. Default: 4. | How many photos sit side by side on desktop. |
| Columns on mobile | 1 to 3. Default: 2. | How many photos sit side by side on mobile. |
| Space between photos | None, Small, Medium or Large. Default: Medium. | The space between photos. |
| Color scheme | Color scheme. | Which of your color schemes the section uses. Schemes are edited in theme settings under Colors. |
| Section spacing | ||
| Top spacing | None, Small, Medium or Large. Default: Medium. | The space above the section, as a share of Space between sections in theme settings. None lets the section touch the one above it. |
| Bottom spacing | None, Small, Medium or Large. Default: Medium. | The space below the section. None lets it touch the one below. |
Blocks
This section is built from one kind of block. Click Add block under the section to add one, and drag blocks to reorder them. The section holds up to 12 blocks.
Photo
One photo.
| Setting | Options | What it does |
|---|---|---|
| Image | Image. | The photo. It is shown square, cropped around its focal point. |
| Alt text | Text. | What the photo shows, for screen readers, for example "Linen shirt dress, worn with sandals". Leave it empty to use the image's own alt text. |
| Link to the post | Link. | Optional. The address of the post. It opens in a new window. |
Image sizes
| Image | Recommended | Notes |
|---|---|---|
| Photo | 1000 x 1000 px | Square. Photos of another shape are cropped around their focal point. |
Upload JPG or PNG files. Shopify resizes and compresses each image for the customer's screen, so there is no need to make smaller copies yourself.
Tips
- Choose photos that look good together. Eight photos in two rows of four is a good start.
- Only post photos you have the rights to. For a customer's photo, ask first.