Advanced

Live Build

(NEW) Ecommerce Site | Product Detail Page

(NEW) Ecommerce Site | Product Detail Page

30:31

30:31

ENROLL IN THIS MASTERCLASS TO VIEW THIS LESSON

The end-to-end ultimate Framer masterclass course.

Resources: Ecommerce Starter Kit

Frameship Discount Code

Continuing the ecommerce build, this lesson is all about the product detail page. We build an image gallery, connect variants and stock levels, add color swatches, quantity and add-to-cart, breadcrumbs, and related products - then style the cart and add a free-shipping progress bar.

What You'll Learn:

  • Building a product image gallery connected to Shopify

  • Adding variant selectors, color swatches, and live stock levels

  • Wiring up quantity, add to cart, and checkout

  • Adding breadcrumbs and a related products section

  • Styling the cart and adding a free-shipping progress bar upsell

Continuing the ecommerce build, this lesson is all about the product detail page. We build an image gallery, connect variants and stock levels, add color swatches, quantity and add-to-cart, breadcrumbs, and related products - then style the cart and add a free-shipping progress bar.

What You'll Learn:

  • Building a product image gallery connected to Shopify

  • Adding variant selectors, color swatches, and live stock levels

  • Wiring up quantity, add to cart, and checkout

  • Adding breadcrumbs and a related products section

  • Styling the cart and adding a free-shipping progress bar upsell

TEACHER

TEACHER

Ryan Hayward

Ryan Hayward

Official Framer Mentor, Founder @ Insert Frame

Official Framer Mentor, Founder @ Insert Frame

LESSON ID:

LESSON ID:

ufm-advanced-e-002

ufm-advanced-e-002

ALL LESSONS

Change Playlist

Home

Lessons

Search

Plugin

Badges

Workshops

MASTER FRAMER AND BECOME A MORE VALUABLE DESIGNER

$299

$500

MASTER FRAMER AND BECOME A MORE VALUABLE DESIGNER

$299

$500