The Insert panel is the central hub for building layouts in Instant. From here, you can access templates, sections, and all individual elements needed to construct your pages. This guide covers navigating the panel and understanding the available building blocks.
Accessing the Insert Panel
Navigate into the Instant Builder
Click the plus icon (+) in the left sidebar
The Insert panel opens
Panel Overview
At the top of the Insert panel, you'll find two main tabs:
Tab | Contents |
Templates | Pre-made sections and complete layout types |
Elements | Individual building blocks for custom layouts |
Search
Located directly below the tabs, the search field allows you to quickly find templates or elements by name.
Templates Tab
The Templates tab provides quick access to popular sections and complete page layouts.
Available Template Types
Sections
Product pages
Landing pages
Cart drawers
Collection pages
Navigations
And more
Template Library
Click the Template Library button at the bottom of the panel to access the full library of pre-made layouts and sections. Here you can browse and search all available templates for use in your store.
Elements Tab
The Elements tab contains all individual building blocks for constructing custom layouts. Elements are organized into four categories:
Structure — Layout containers and grids
Basics — Core content elements
Shopify — E-commerce specific elements
Advanced — Interactive and specialized elements
Structure Elements
Structure elements form the foundation of your page layout.
Grid
Hover over Grid to reveal the insert grid popover:
Element | Description |
Fluid Grid | Free-form layout for magazine-style designs with overlapping layers. Allows elements to be freely positioned on the canvas. |
Fixed Grid | Traditional grid with elements in rows and columns. Ideal for product sections and structured layouts. |
Column
Hover over Column to reveal column options:
Element | Description |
One Column | Single column container |
Two Columns | Side-by-side two column layout |
Three Columns | Three column layout |
Four Columns | Four column layout |
Behavior: Elements placed within a column container appear side by side.
Row
Hover over Row to reveal row options:
Element | Description |
One Row | Single row container |
Two Rows | Stacked two row layout |
Behavior: Elements placed within a row container appear stacked on top of each other.
Basics Elements
Basic elements are the core content blocks for filling your layouts.
Element | Description |
Text | Text and heading elements |
Image | Image elements |
Button | Clickable button elements |
Video | Video player elements |
Shopify Elements
Shopify elements are specifically designed for building e-commerce layouts.
Element | Use Case |
Product | Product information and details |
Variant | Product variant selectors |
Media | Product media galleries |
Collection | Collection displays and grids |
Cart | Shopping cart functionality |
Common Applications
Product pages
Buy boxes
Collection pages
Cart templates
Advanced Elements
Advanced elements add interactivity and specialized functionality to your layouts.
Interactive
Dynamic elements for engaging user experiences:
Carousels
Slideshows
Galleries
Tickers
Countdown timers
Accordions
Tabs
Navigation
Elements for site navigation:
Dropdowns
Cart buttons
Country selects
Language selects
Apps
Pre-built integrations with popular Shopify apps:
Judge.me
Stamped
Klaviyo
Yotpo
Omnisend
Loox
Embed
Advanced embedding options:
Element | Description |
App Island | Insert any Shopify app block into an Instant layout |
Custom Liquid | Add custom Liquid code |
Spline Embed | Embed 3D elements from Spline |
Building with Elements
Elements work as a drag-and-drop library. Each element can be dragged from the panel onto your canvas to build layouts.
Recommended Workflow
Structure first — Use Grid, Column, and Row elements to create your page layout framework
Add basics — Fill your structure with Text, Image, Button, and Video elements
Add Shopify elements — Transform your layout into a functional product page, collection page, or cart
Enhance with advanced — Add interactive elements like slideshows and tickers for polish
Example: Building a Landing Page
Drag a Row container onto the canvas for each section
Add Column containers within rows for multi-column layouts
Insert Text and Image elements to add content
Add Button elements for calls to action
Include a Carousel or Ticker for visual interest
Quick Reference
Category | Elements |
Structure | Fluid Grid, Fixed Grid, Columns (1-4), Rows (1-2) |
Basics | Text, Image, Button, Video |
Shopify | Product, Variant, Media, Collection, Cart |
Interactive | Carousel, Slideshow, Gallery, Ticker, Countdown, Accordion, Tabs |
Navigation | Dropdown, Cart Button, Country Select, Language Select |
Apps | Judge.me, Stamped, Klaviyo, Yotpo, Omnisend, Loox |
Embed | App Island, Custom Liquid, Spline Embed |
Task | Location |
Open Insert panel | Left sidebar → Plus icon (+) |
Access templates | Insert panel → Templates tab |
Access elements | Insert panel → Elements tab |
Open template library | Templates tab → Template Library button |
Search | Search field below tabs |