Shop Image is a Shopify theme section in the Section Star library. Turn any photo into a sales opportunity — add shoppable product links directly to your images and let customers shop what they see.
Live demo
Settings
Every setting below appears in the Shopify theme customizer once the section is published.
Grid Design
Set settings for the grid
| Setting | Type | Default |
|---|---|---|
| Grid Spacing | Number | 25 |
| Grid Column Size | Select (50/50, 60/40, 40/60) | 1fr 1fr |
| Grid Vertical Alighment | Select (Top, Center, Bottom) | center |
Content
Set image and text for section
| Setting | Type | Default |
|---|---|---|
| Image Location | Select (Left, Right, Full Width) | left |
| Image Aspect Ratio | Select (21:9, 16:9, 4:3, 1:1, 3:4, 9:16…) | 4 / 3 |
| Mobile Image Aspect Ratio | Select (21:9, 16:9, 4:3, 1:1, Auto) | 4 / 3 |
| Image Border Radius | Number | 5 |
| Subtle Shadow on Image | Checkbox | On |
| Image | Image | — |
| Text Alignment | Text alignment | center |
| Mobile Text Alignment | Text alignment | center |
| Headline | Inline rich text | <b>Sample headline</b> |
| Content | Rich text | <p>Sample content</p> |
Button Style
Set the look and feel of the button
| Setting | Type | Default |
|---|---|---|
| Button Background Color | Color or gradient | linear-gradient(164deg, #111 0%, #333… |
| Button Text Color | Color | #fff |
| Text Size | Range | 15 |
| Padding Top/Bottom | Number | 10 |
| Padding Left/Right | Number | 25 |
| Border Radius | Number | 5 |
| Link Text | Inline rich text | Shop More |
| Link | URL | — |
Shop Style
Set the look and feel of the shop section
| Setting | Type | Default |
|---|---|---|
| Shop The Look | Inline rich text | <b>Shop The Look</b> |
| Secondary Text | Inline rich text | 2 Products |
| Shop Background Color | Color or gradient | linear-gradient(164deg, #111 0%, #111… |
| Shop Text Color | Color | #fff |
| Shop Alternate Text Color | Color | #aaa |
| Text Size | Range | 13 |
| Padding Top/Bottom | Number | 15 |
| Padding Left/Right | Number | 20 |
| Border Radius | Number | 4 |
Products
Set the product to upsell
| Setting | Type | Default |
|---|---|---|
| Product 1 | Product | — |
| Product 2 | Product | — |
| Product 3 | Product | — |
How to add this section to a Shopify store
- Install Section Star from the Shopify App Store.
- Open the app and search the library for “Shop Image”.
- Click Publish, then choose a name and the theme to publish into.
- Follow the deep link into the Shopify theme customizer.
- Add the section to any page and customize it with the native theme settings.
No code is required, and the section lives in your theme as ordinary Liquid — see the full install guide.