Link Grid is a Shopify theme section in the Section Star library. Guide shoppers exactly where you want them — a clean, customizable link grid that makes navigating your store effortless.
About the Link Grid section
The Link Grid section is a customizable and responsive layout for displaying various types of links in a grid format. This section supports text links, image links, and icon links, making it versatile and visually appealing for showcasing different types of content. With configurable properties, you can easily adjust the appearance to match your store's theme and requirements.
Live demo
Use cases
- Promotional Banners: Use the grid to display promotional banners with links to sales or special offers.
- Category Navigation: Picture-based links for various product categories to enhance user navigation.
- Feature Highlights: Icon-based links pointing to featured product collections, trending items, or new arrivals.
- Support and Contact: Text or icon links leading to support pages, FAQs, or contact information for customer assistance.
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 |
|---|---|---|
| Alignment | Text alignment | center |
| Space between Columns | Number | 10 |
| Space between Columns (mobile) | Number | 5 |
| Columns | Select (1 column, 2 columns, 3 columns, 4 columns, 5 columns) | 1fr 1fr 1fr 1fr |
| Mobile Columns | Select (1 column, 2 columns, 3 columns) | 1fr |
Links
Set the display of the links
| Setting | Type | Default |
|---|---|---|
| Link Background Color | Color or gradient | linear-gradient(164deg, #fff 0%, #fff… |
| Link Text Color | Color | #111 |
| Text Size | Range | 15 |
| Padding Top/Bottom | Number | 10 |
| Padding Left/Right | Number | 25 |
| Link Border Radius | Number | 5 |
| Link Border Size | Number | 1 |
| Link Border Color | Color | #ccc |
| Subtle Shadow on Link | Checkbox | On |
| Subtle Lift Animation on Link | Checkbox | On |
Headline
Set text for the headline
| Setting | Type | Default |
|---|---|---|
| Text Alignment | Text alignment | center |
| Mobile Text Alignment | Text alignment | center |
| Headline | Inline rich text | <b>Sample Headline</b> |
| Text | Inline rich text | Use this block to add a description. … |
| Spacing between Headline and Features | Number | 15 |
Text Link block settings
| Setting | Type | Default |
|---|---|---|
| Text | Inline rich text | Link Text |
| Optional Link | URL | — |
Icon Link block settings
| Setting | Type | Default |
|---|---|---|
| Icon Color | Color | #111 |
| Icon Size | Number | 25 |
| Space Between Icon and Text | Number | 5 |
| Text | Inline rich text | Link Text |
| Icon | Select (Cart, Gift, Gift Card, Shipping, Payment, Trending…) | tag |
| Optional Link | URL | — |
Image Link block settings
| Setting | Type | Default |
|---|---|---|
| Image | Image | — |
| Shape | Select (Circle, Rounded, Square) | circle |
| Image Size | Number | 25 |
| Space Between Icon and Text | Number | 20 |
| Text | Inline rich text | Link Text |
| Optional Link | URL | — |
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 “Link Grid”.
- 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.