The free DIY guide · for ecommerce founders
The exact 5-step system I run for clients, written out so you can do it yourself.
Built for ecommerce founders doing $250k–$2M who get traffic but want more of it to buy. No fluff. Steal all of it.
Here's the honest truth most agencies won't tell you: your store almost certainly doesn't have a traffic problem. It has a "we can't tell what's working" problem.
You're getting visitors. Some click your ads. A few add to cart. Most leave. And because the tracking is usually broken, you can't see where the money is leaking — so you do the only thing you've been told to do: spend more. More spend, more loss.
This guide fixes that. It's the same five steps I run for paying clients, written out so you can do it yourself. Follow it in order and you'll plug the leaks, lift conversion, and grow sales from the traffic you already have. Let's go.
You can't sell to someone you don't understand. Before you touch your page or your ads, you need to know — in their words — what they're afraid of, what they want, and the single biggest question running through their head before they buy.
Go to findquestions.com. It scans Reddit and hands you a long list of the real questions your customers are asking. One rule: be specific. "Tallow balm for eczema" beats "skincare." "Offset smoker for beginners" beats "BBQ."
Open those subreddits and read. Don't skim — read the comments, the rants, the questions people ask at 1am. Copy the exact words and phrases they use into a spreadsheet. This is gold, because of a simple rule:
"Enter the conversation already taking place in your customer's mind." When your page uses their words — not your clever marketing words — they think "it's like they're reading my mind," and they trust you. Skepticism drops. Sales go up.
Now fill in this worksheet. Be specific and concrete — "hangs out in the Low & Slow BBQ Australia Facebook group" beats "likes BBQ."
Now the most important move. Look across everything — the Reddit questions, the language, the 9 answers — and find the single question your customer keeps asking, over and over, that nobody has answered properly. The one they lie awake thinking about.
For a tallow skincare buyer it might be: "Why does every 'natural' moisturiser still make my sensitive skin worse?" For a BBQ buyer: "How do I stop wasting weekends on dry, ruined briskets?"
Most stores send people on a confusing journey across five pages before they can buy. Don't. Build one focused page that answers the burning question, shows your product as the fix, and lets them buy without leaving.
Stuck on your headline? These are four proven formulas — fill the brackets with your burning question and dream outcome.
1. X ways to achieve [desirable thing] without [undesirable thing]
e.g. "5 Ways to Calm Sensitive Skin Without 20-Ingredient Creams"
2. [Do difficult thing] in [time] — even if [shortcoming]
e.g. "Heal Dry, Reactive Skin in 14 Days — Even If Everything Else Has Failed"
3. Achieve [desirable thing] like [an expert] even without [something expected]
e.g. "Smoke Brisket Like a Pitmaster — Even Without an Expensive Setup"
4. How to eliminate [biggest problem] without [thing they hate] within [timeframe]
e.g. "How to End Eczema Flare-Ups Without Steroid Creams — in Under a Month"
Every extra page between "I want this" and "I've paid" loses buyers. Collapse the journey onto one page:
Want this slide-out cart drawer on your store? Use the code boxes below — or just hand them to your web developer for a quick turnaround. No need to wait weeks for them to build it from scratch; it's ready to drop in. It slides in from the right, shows a free-shipping progress bar, lists upsells, and closes on the X, the overlay, or the Escape key.
1 · HTML — the trigger button, overlay & drawer
<!-- 1. Your "Add to cart" / CTA buttons. data-add = "Name|Price" -->
<button class="add-btn" data-add="Tallow Balm|39">Add to cart — $39</button>
<!-- 2. Drop this once, just before </body>: the overlay + the drawer -->
<div class="cart-overlay" id="cartOverlay"></div>
<aside class="cart-drawer" id="cartDrawer" aria-hidden="true">
<div class="cart-head">
<span>Your cart</span>
<button id="cartClose" aria-label="Close">×</button>
</div>
<!-- free-shipping progress bar -->
<div class="ship-bar"><div class="ship-fill" id="shipFill"></div></div>
<p class="ship-msg" id="shipMsg">Add $100 for free shipping</p>
<div class="cart-items" id="cartItems"></div>
<!-- upsell row -->
<div class="upsell">
<p class="upsell-t">Add to your order</p>
<button class="add-btn small" data-add="Lip Balm|12">+ Lip Balm $12</button>
<button class="add-btn small" data-add="Soap Bar|10">+ Soap Bar $10</button>
</div>
<div class="cart-foot">
<div class="subtotal"><span>Subtotal</span><span id="cartTotal">$0</span></div>
<a href="/checkout" class="checkout-btn">Checkout →</a>
</div>
</aside>
2 · CSS — the slide-in animation & styling
.cart-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);opacity:0;visibility:hidden;transition:.3s;z-index:998}
.cart-overlay.open{opacity:1;visibility:visible}
.cart-drawer{position:fixed;top:0;right:0;height:100%;width:420px;max-width:100%;background:#fff;
transform:translateX(100%);transition:transform .3s ease;z-index:999;display:flex;flex-direction:column}
.cart-drawer.open{transform:translateX(0)} /* this line does the slide-in */
.cart-head{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid #eee;font-weight:700}
.cart-head button{border:0;background:none;font-size:1.6rem;cursor:pointer}
.ship-bar{height:6px;background:#eee;margin:16px 20px 6px;border-radius:3px;overflow:hidden}
.ship-fill{height:100%;width:0;background:#EBA63C;transition:width .3s}
.ship-msg{padding:0 20px;font-size:.85rem;color:#666}
.cart-items{flex:1;overflow-y:auto;padding:16px 20px}
.cart-line{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid #f0f0f0}
.cart-line button{border:0;background:#f3f3f3;width:26px;height:26px;border-radius:6px;cursor:pointer}
.upsell{padding:16px 20px;border-top:1px solid #eee}
.upsell-t{font-size:.8rem;text-transform:uppercase;letter-spacing:.1em;color:#888;margin-bottom:8px}
.cart-foot{padding:20px;border-top:1px solid #eee}
.subtotal{display:flex;justify-content:space-between;font-weight:700;margin-bottom:12px}
.checkout-btn{display:block;text-align:center;background:#01374F;color:#fff;padding:14px;border-radius:10px;text-decoration:none;font-weight:600}
.add-btn.small{background:#f3f3f3;border:0;padding:8px 12px;border-radius:8px;margin:4px 4px 0 0;cursor:pointer}
3 · JavaScript — open/close, add, remove, free-shipping bar
const FREE_SHIP = 100; // free-shipping threshold
let cart = [];
const drawer = document.getElementById('cartDrawer');
const overlay = document.getElementById('cartOverlay');
function openCart(){ drawer.classList.add('open'); overlay.classList.add('open'); }
function closeCart(){ drawer.classList.remove('open'); overlay.classList.remove('open'); }
// Any [data-add] button: add the item, re-draw, slide the drawer open
document.querySelectorAll('[data-add]').forEach(function(btn){
btn.addEventListener('click', function(){
const parts = btn.dataset.add.split('|');
cart.push({ name: parts[0], price: Number(parts[1]) });
render();
openCart();
// ON YOUR STORE, replace the line above with your platform's real cart API, e.g.:
// fetch('/cart/add.js', {method:'POST', headers:{'Content-Type':'application/json'},
// body: JSON.stringify({ id: VARIANT_ID, quantity: 1 }) }).then(render);
});
});
function render(){
const box = document.getElementById('cartItems');
box.innerHTML = cart.map(function(it, i){
return '<div class="cart-line"><span>' + it.name + '</span>' +
'<span>$' + it.price + ' <button onclick="removeItem(' + i + ')">×</button></span></div>';
}).join('') || '<p style="color:#888">Your cart is empty.</p>';
const total = cart.reduce(function(s, it){ return s + it.price; }, 0);
document.getElementById('cartTotal').textContent = '$' + total;
const pct = Math.min(100, (total / FREE_SHIP) * 100);
document.getElementById('shipFill').style.width = pct + '%';
document.getElementById('shipMsg').textContent =
total >= FREE_SHIP ? 'You have unlocked free shipping!' : 'Add $' + (FREE_SHIP - total) + ' for free shipping';
}
function removeItem(i){ cart.splice(i, 1); render(); }
// Close on the X, on the dark overlay, and on the Escape key
document.getElementById('cartClose').addEventListener('click', closeCart);
overlay.addEventListener('click', closeCart);
document.addEventListener('keydown', function(e){ if(e.key === 'Escape') closeCart(); });
cart.push(...) line for your store's real add-to-cart API so it stays in sync with your live cart and checkout. Many modern ecommerce themes already include a cart drawer you can simply switch on in your theme's cart settings.The cheapest sale you'll ever make is to someone already buying. Three simple upsells lift your average order value, which means more revenue from the exact same traffic and ad spend.
You don't need to guess what ads will work. Your competitors have already spent millions finding out. The Meta Ad Library shows you every ad running on Facebook and Instagram, anywhere in the world, for free.
For each winner, break down why it works: What's the hook in the first 3 seconds? What problem does it lead with? What's the offer? Then rebuild that structure for your product, in your brand, answering your burning question. You're modelling what works — not stealing the ad.
This is where most founders lose money — they launch wrong, read the data wrong, and conclude "ads don't work." Here's how to do it properly.
This lets you test which message resonates without spreading yourself thin. And every creative should be built from this formula:
Angle = the hook (e.g. "3 ingredients"). Persona = who it speaks to (e.g. "the eczema veteran"). Format = video or image. Offer = what they get. Change one element and you've got a new creative to test.
Here's a real test we ran — three creatives, same concept, ~$20–25 each over a week. This is exactly what your dashboard will look like:
| Creative | Impr. | CTR (link) | CPC (link) | LP views | Adds to cart | Cost / ATC |
|---|---|---|---|---|---|---|
| "Test" variant | 513 | 5.07% | $0.98 | 9 | 17 | $1.49 |
| "Variant" product | 656 | 6.68% | $0.57 | 17 | — | — |
| "Review" product | 365 | 10.11% | $0.49 | 12 | 2 | $9.02 |
What this tells you:
Run, read, tweak, repeat — every two weeks. Compound those small wins across page, offer, upsells and ads, and a 20% sales lift in 90 days is very achievable.
We ran this exact path for The Tallow Tribe, an Adelaide skincare brand. Here's what 90 days looked like — on the same traffic and the same ad budget.
No extra traffic. No bigger budget. The lift came purely from plugging the leaks: a page built around their customers' real burning question, upsells that raised order value, and tracking that finally showed what was actually working.
This is the exact path we run for clients — so you now know precisely what we'd do, step by step. Want us to find the 3 biggest leaks in your ecommerce store? Book a free 20-minute revenue audit. No mystery, no jargon — you can question us at every stage, and we'll back every call with your data.
Book a free 20-minute revenue audit →