Bold hero layout for collection pages. Large feature images with supporting detail shots.
Build with Canvas — freeCollection pages typically start with a text heading and jump straight into the product grid. A collection hero layout adds a bold visual introduction: one large feature image flanked by supporting detail shots, arranged in a scatter pattern that sets the tone. Use Stage mode so the hero occupies a defined zone, then let the standard collection grid continue below.
Create a new canvas
Open Canvas in your Shopify admin. Click Create canvas, name it, and choose the canvas mode that matches this layout type.
Add your images
Upload images or pull from your Shopify Files library. Drag them onto the canvas to start building your layout.
Arrange and scatter
Drag images to position them. Use rotation, sizing, and opacity controls to create depth. Overlap images intentionally for an editorial feel.
Set hover effects and links
Select each image block and choose a hover mode (Ghost, Lift, Shop, or Reveal). Add link destinations to make images clickable.
Publish to your store
Click Publish to push the layout live. Add the Canvas app block to your theme once — all future updates publish instantly.
Lift is the best choice for collection heroes — it adds physical depth when visitors hover, reinforcing the premium feel. Ghost works for supporting detail shots.
Want to see what a Canvas layout looks like on a real Shopify store? All The Horses is a DTC equestrian brand that uses Canvas to build editorial scatter layouts on their homepage.
Read the case study →Install Canvas on your Shopify store. Drag, scatter, and publish in minutes.