A beautiful, customizable Instagram carousel section for Shopify themes.
- 🎨 Fully Customizable - Control every aspect through Shopify theme editor
- 📱 Responsive - Perfect on mobile and desktop
- 🖼️ Multiple Layouts - Grid, carousel, or masonry layouts
- ⚡ Performance Optimized - Pure Liquid & CSS, minimal JavaScript
- 🎯 Instagram Integration - Direct linking to Instagram posts
- 🔧 Block-based - Modular design with reusable blocks
blocks/instagram-post-card.liquid- Main card containerblocks/instagram-post-image.liquid- Image/video display with overlayblocks/instagram-post-caption.liquid- Caption with line clampingblocks/instagram-post-meta.liquid- Likes and comments display
sections/instagram-carousel.liquid- Main carousel section
- Download the files listed above
- Upload to your Shopify theme:
- Blocks →
blocks/folder - Section →
sections/folder
- Blocks →
- Add the section to your theme in the theme editor
- Layout Type: Grid, Carousel, or Masonry
- Post Limit: How many posts to display
- Columns: Grid columns (desktop/mobile)
- Gap: Spacing between cards
- Navigation: Arrows, dots, or counter
- Alignment: Left, center, or right
- Gap: Internal spacing
- Border Radius: Corner rounding
- Aspect Ratio: 1:1, 4:5, 3:4, 2:3, or adapt
- Overlay: Toggle Instagram icon overlay on hover
- Overlay Opacity: Control darkness of overlay
- Max Lines: Limit caption length (line clamping)
- Font Size: Control text size
- Show Likes/Comments: Toggle visibility
- Icon Style: Filled, Outline, Rounded, or Emoji
- Shopify theme
- Instagram metaobject with structure:
Username(single line text)posts(list of instagram-post metaobjects)
Username- Your Instagram handleposts- References to instagram-post entries
images- Media files (images/videos)caption- Post caption textlikes- Number of likescomments- Number of comments
Current: 1.0.0
MIT
For issues or questions, please open an issue on GitHub.