StoreFront Educational Videos
Every page in this section pairs a recorded walkthrough with the CJSON template built during it, so you can watch a checkout or offer get assembled and then upload the finished result into your own StoreFront. The videos are grouped below by what you are trying to build.
Most of these were recorded against the Hero theme between 2018 and 2021. The Visual Builder screens have changed since, so treat the videos as a guide to technique rather than a click-by-click match for the current interface.
Start here
New to the Visual Builder? Watch this first for a tour of the Hero theme and what a visual checkout is.
| Video | Length | What it covers |
|---|---|---|
| Introduction to Hero Theme and Visual Checkout | 58:05 and 2:16 | A preview webinar on the Hero theme and visual checkout, plus a short walkthrough of installing the theme. |
Building a checkout
Full builds that start from an existing theme and end with a working checkout you can download.
| Video | Length | What it covers |
|---|---|---|
| Tru Energy Single Page Checkout | 74:30 | Transforms the Hero single page checkout into a layout matching an existing REST API based checkout. |
| Tru Energy Choose Payment Option | 41:39 | Builds a 1 or 2 payment option selector that adds the matching item to the cart. |
| Broat Supplements Two Page Checkout, Page 1 | 41:14 | Starts a two page checkout for a fictitious supplement brand, reusing sections from the Tru Energy build. |
| Broat Supplements Two Page Checkout, Page 2 | 61:41 | Finishes the build with product selection, testimonials, trust logos, and the rest of the form. |
| Natural Theme Checkout in Visual Builder | Download only | A ready made CJSON file that reproduces the Natural theme checkout. No video. |
Upsells and offers
Post-purchase and in-cart offers built in the Visual Builder.
| Video | Length | What it covers |
|---|---|---|
| Video Sales Letter (VSL) Upsell with Transcript | 37:22 | Builds a VSL upsell and hides the transcript and call to action buttons until the video ends. |
| Limited time upsell with multiple item selection | 5:07 | Presents several items as checkboxes next to a countdown timer. |
Converting more shoppers
Modals, social proof, and experiments aimed at cart abandonment and conversion rate.
| Video | Length | What it covers |
|---|---|---|
| Adding a newsletter signup modal | 14:46 | Adds the Visual Builder to a theme that lacks it, then builds a newsletter signup modal. |
| Exit Intent Modal with Coupon | 6:25 | Adds an exit intent modal offering a coupon on the checkout. |
| Experiment: Testing Purchase Bubbles | 2:50 | Runs an experiment to measure whether purchase bubbles help. |
Wholesale ordering
| Video | Length | What it covers |
|---|---|---|
| Adding a Quick Order Form for Wholesale Customers | 15:45 | Builds a wholesale ordering page and tightens it into a dense table display. |
StoreFront Communications
Email automation tutorials that use the flows engine rather than the Visual Builder canvas.
| Video | Length | What it covers |
|---|---|---|
| Adding Item Specific Coupons | 1:31 | Adds an item specific coupon to the abandoned cart flow. |
| Experimenting | 7:30 | Tests variations within flows and campaigns to improve email results. |
Each build video has a CJSON download on its page. Uploading that file into your own StoreFront is usually faster than rebuilding the layout by hand, and it gives you a working example to pick apart.