# Transcript: build-me-an-online-shop One conversation, session 825cd6b1-1dfa-4127-a3e6-8c44c91680a0 (prompts 1 to 4 were sent in session 5b4496da-3810-486a-aeb8-06bd2ad93017; from prompt 5 on, the conversation was continued from that exact point with a new prompt, so Claude saw everything before it), model claude-sonnet-5-5, 2.1.287 (Claude Code), run with claude -p on 2026-10-01. Claude could only create, read and edit files in an empty folder (told that files it saves are offered to the user as downloads), the nearest headless equivalent of claude.ai with file creation switched on. No terminal, no web search, no connectors. Each step was sent with --resume so Claude saw everything before it. Replies are verbatim; lines in *[brackets]* mark where Claude saved a file, and the files themselves are published unedited. --- ## Prompt 1: you I make candles at home and sell them at markets under the name Fern & Wick. I'd like a simple online shop so people can buy from me online too. I've never built a website and I'm not technical. What I sell: - Riverside candle (fig and cedar), 200g: £18 - Allotment candle (tomato leaf and basil), 200g: £18 - Fireside candle (smoke and vanilla), 300g: £24 - Wax melts, pack of 6, any scent: £8 - Gift set (one 200g candle, one pack of wax melts, matches): £30 Delivery is £3.95 to anywhere in the UK, free on orders over £40. UK only. I don't want a complicated shop system or anything I have to run myself. A friend said I can make a payment link for each product in Stripe (they call them Payment Links) and put those links on my website, so Stripe takes the card and the delivery address. I'd like to do it that way, and I want the website itself to be free to run. Before you make anything, ask me anything you need to know, and tell me in plain English what you're going to make: the pages, what a customer does from arriving to paying, and how my delivery charge and "free over £40" would work with payment links. ### Claude Nothing is built yet. Here's what I'd make, then a few questions. ## What I'd make A small, free website of 4 pages: 1. **Home**: Fern & Wick name, a short intro, and your five products with photo, description, price and a "Buy" button. 2. **Delivery & returns**: UK only, £3.95 postage, free over £40, how long you take to post, and what happens if something arrives damaged. 3. **About / contact**: a few lines about you and the markets, plus your email. 4. **Thank you**: where Stripe sends people after they've paid. It would be plain files hosted free on something like Cloudflare Pages or GitHub Pages. Nothing for you to run or update except when you change a product or price. I'd also write a step-by-step guide for setting up the Stripe links and putting the website online. ## What a customer does 1. They arrive on the site and look at the candles. 2. They click **Buy** on a product. 3. They land on Stripe's secure payment page. They choose a quantity, and for wax melts or the gift set, pick a scent from a dropdown. They enter their card and UK delivery address. 4. They see the thank-you page and get a Stripe receipt by email. 5. Stripe emails you the order, and you pack and post it. ## Delivery and "free over £40": the catch This is the one place where Payment Links have a limit. A Payment Link can add a **fixed** delivery charge, and it can limit delivery to the UK. It **can't** change the delivery charge based on the basket total. Also, each link is for its own product, so a customer can't put a candle and wax melts in one basket. I'm fairly sure of this, but we'll check it in your Stripe account. The options, simplest first: - **A. Free-delivery bundle links (my recommendation).** - Every single-product link charges £3.95 delivery. - I'd add a few ready-made bundles over £40 with free delivery, for example "3 candles" or "gift set + candle + melts". - It's simple and free. The downside is that customers can only get free delivery through those bundles. - **B. Quantity-based pairs.** For each product, one link charges delivery and a second "buy 3 or more" link has free delivery. It's more links, and mixing products still doesn't work. - **C. A real basket.** The site totals the basket and applies the right delivery. This needs a small free "serverless" function that talks to Stripe. It's the only way to get a true "free over £40", but it's more technical and goes beyond the Payment Links approach your friend suggested. I'd only do this if A feels too limiting. ## Questions 1. **Delivery option:** A, B or C? If A, which bundles would you like? 2. **Stripe:** Do you already have an account? Is it activated to take payments? 3. **Scents:** What scents are available for wax melts? For the gift set, can customers choose the candle, and which melt scent comes with it? 4. **Photos:** Do you have product photos? If not, I'll leave tidy placeholders. 5. **Web address:** A free address like `fernandwick.pages.dev` is fine, or would you like your own `.co.uk`? That's roughly £10 a year. 6. **Contact details:** What email address (and Instagram, if any) should go on the site? 7. **Posting:** How long to post an order (e.g. 2–3 working days)? Which courier? What's your returns policy? 8. **Market pickup:** Do you want a "collect at the next market" option, or only delivery? 9. **Look and feel:** Any colours, logo or style in mind? I'd default to soft greens and cream, which suits "Fern". 10. **Product descriptions:** Should I write short ones for you to edit? Do you have burn times, ingredients (soy wax, etc.) and safety wording you'd like included? Once you answer, I'll build it. --- ## Prompt 2: you Thanks, that's really clear. My answers: 1. Option A. Please suggest two bundles over £40 with free delivery and tell me what you picked. 2. I've just opened a Stripe account but haven't made any links yet. 3. Wax melts come in the same three scents as the candles. For the gift set, the customer picks the candle, and the melts match it. 4. No photos yet. 5. The free address is fine for now. 6. Email: hello@fernandwick.example (I'll change it). No Instagram yet. 7. I post within 2 to 3 working days by Royal Mail. Unused candles can come back within 14 days. 8. Delivery only, no market pickup. 9. I've attached a screenshot of a website I like the look of. I like the cream background, the dark green, the elegant old-style headings and the rounded buttons. Don't copy its words, just the feel. 10. Please write short descriptions for me to edit. All my candles are soy wax. Leave burn times out for now. Please make the website now. Keep it as simple as possible: just the files I'll need to upload, nothing I have to install. It must look good on a phone. As I haven't made the payment links yet, make it obvious where each one goes and tell me what to swap in once I've made them. *[Attached: site-i-like.png]* ### Claude I'll build the site files first, then the setup guide. *[Claude saved the file `fern-and-wick/style.css`]* *[Claude saved the file `fern-and-wick/shop-settings.js`]* *[Claude saved the file `fern-and-wick/site.js`]* *[Claude saved the file `fern-and-wick/index.html`]* *[Claude saved the file `fern-and-wick/delivery.html`]* *[Claude saved the file `fern-and-wick/about.html`]* *[Claude saved the file `fern-and-wick/thanks.html`]* *[Claude saved the file `fern-and-wick/images/put-your-photos-here.txt`]* Now the setup guide, which sits outside the upload folder. *[Claude saved the file `START-HERE.txt`]* I've built the site, but I couldn't open it in a browser here, so I haven't seen it on a phone. Look it over on your phone before you share it. ## What you have There's a folder called `fern-and-wick`, which is the whole website, and a guide next to it called `START-HERE.txt`. - **Pages:** Home (with all the products), Delivery & returns, About, and the Thank-you page that Stripe sends customers to after paying. - **Look:** cream background, dark green, old-style serif headings and rounded buttons, in the spirit of your screenshot. None of its words are copied. - **Phone:** the layout stacks into a single column on small screens. - **Photos:** each product shows a coloured placeholder until you add photos. Drop `.jpg` files into the `images` folder with the names listed in the note inside it. - **Hosting:** nothing to install. It's plain files you drag onto free hosting, and the guide walks you through Cloudflare Pages. ## The two bundles with free delivery - **The Trio, £60:** Riverside, Allotment and Fireside together. - **Gift set + a candle, £48:** the gift set plus a second 200g candle, with both scents picked at checkout. I priced them at the full sum of the items, with no discount. The saving is the free delivery. You can change that. ## Where the payment links go Open `shop-settings.js`. It has 7 clearly labelled lines, each saying `PASTE-…-HERE`. Paste each Stripe link between the quote marks. Your email address is on the first line of that file, and changing it updates the whole site. Until a link is pasted in, its button shows a dashed orange **"Payment link not added yet"**. That makes it easy to spot any you've missed. ## Things to check - **Delivery rule:** a Payment Link can't turn delivery free once the total passes £40. The guide has you cap quantities so no single-product order goes over £40 while still paying delivery. For example, Fireside is limited to 1 because 2 would be £48. Customers who want more are steered to the bundles. The Delivery page says "free on our bundles (both over £40)" rather than promising free delivery on every order over £40, because that wouldn't be true for every order. - **Gift set candle choice:** the gift set has a 200g candle, and Fireside only comes in 300g. I offered only Riverside and Allotment in the dropdown. If you make a 200g Fireside, add it. - **Wording:** the returns text is based on what you told me (unused candles, 14 days). Check it, including who pays postage on a return. The About page is simple starter text for you to rewrite. - **Order of setup:** Stripe needs your site's address for the thank-you page. So upload the site first, then make the links, paste them in, and upload again. The guide covers this, plus how to test with Stripe's test card. I haven't checked every button name in Stripe's current dashboard, so some screens may look slightly different from the guide. If you get stuck, tell me what you see. --- ## Prompt 3: you I opened it by double-clicking index.html and it looks lovely. Before I put it online, please check it carefully, as if you were a customer on a small phone and as if you were trying to break it: every "Buy now" button and link, someone who wants two different candles, someone expecting free delivery on a £42 order, someone outside the UK, someone who presses "Buy now" before I've added my real links, someone who uses a screen reader or only a keyboard, writing that's too small or too faint, anything that spills off the side of the screen, and anything a customer would want to know before trusting a small shop like mine (returns, contact, who I am). Tell me in plain English what you found, then fix it in the files. ### Claude I'll re-read the files as a customer would, looking for faults. Before changing anything I'll check the ones I'm least sure of. The review is done. I'll fix the stylesheet, the script and your settings file first, then the pages. *[Claude saved the file `fern-and-wick/style.css`]* *[Claude saved the file `fern-and-wick/shop-settings.js`]* *[Claude saved the file `fern-and-wick/site.js`]* Now the home page. *[Claude edited the file `fern-and-wick/index.html`]* *[Claude edited the file `fern-and-wick/index.html`]* *[Claude edited the file `fern-and-wick/index.html`]* *[Claude edited the file `fern-and-wick/index.html`]* *[Claude edited the file `fern-and-wick/index.html`]* *[Claude edited the file `fern-and-wick/index.html`]* *[Claude edited the file `fern-and-wick/index.html`]* *[Claude edited the file `fern-and-wick/index.html`]* *[Claude edited the file `fern-and-wick/index.html`]* *[Claude edited the file `fern-and-wick/index.html`]* *[Claude edited the file `fern-and-wick/index.html`]* *[Claude edited the file `fern-and-wick/index.html`]* *[Claude edited the file `fern-and-wick/index.html`]* One fix before the other pages. My script would overwrite the words "Email us" with the raw address, so I'll make it leave link text alone where I ask. *[Claude edited the file `fern-and-wick/site.js`]* *[Claude edited the file `fern-and-wick/index.html`]* *[Claude saved the file `fern-and-wick/delivery.html`]* *[Claude saved the file `fern-and-wick/about.html`]* *[Claude saved the file `fern-and-wick/thanks.html`]* Next I'll update the guide to match the new behaviour. *[Claude edited the file `START-HERE.txt`]* *[Claude edited the file `START-HERE.txt`]* *[Claude edited the file `START-HERE.txt`]* *[Claude edited the file `START-HERE.txt`]* *[Claude edited the file `START-HERE.txt`]* I reviewed every page, link and button and fixed the problems below. I read through the code but didn't run it in a browser or on a real phone. Please open `index.html` once more on your phone, and tick through the test steps in `START-HERE.txt` before you launch. ## What I found and fixed **Things that would have hurt you** - **The header would spill off a small phone.** The logo and the three menu links didn't fit side by side on a narrow screen. The menu now drops onto a second line when there isn't room. I also made the tap targets bigger, as they were fiddly. - **"Free delivery over £40" wasn't really achievable for mixed orders.** The site has no basket, so someone buying a Riverside and a Fireside (£42) would pay delivery twice and be annoyed. I've added a short invitation on the shop and Delivery pages: "email us and we'll set it up as one order, with free delivery if it's over £40". You'd make a one-off Stripe link by hand. The guide has the steps, and also how to remove the invitation if you'd rather not do that. This is the one thing I'd like you to decide on. - **Pressing "Buy now" before your links exist.** On your own computer it still shows a dashed orange "Payment link not added yet" and does nothing. If you uploaded without a link, customers would see a dead button, so on the live site that button now becomes **"Email us to order"** with the product already in the subject line. - **Mistakes in the settings file.** A yellow "Setup check" box at the top of the page (only on your own computer) now flags several problems: - links you haven't added yet - the same link pasted twice - the example email address - your name and address not filled in If you accidentally paste Stripe *test* links, a "Test mode" strip appears on every page, including the live one. - **Someone outside the UK.** The site already said UK only in a couple of places. I made it plainer: it's on the home page and the Delivery page, and Stripe's checkout will also refuse a non-UK address. **Trust** - **Who you are.** There was nothing about you. The About page now has "who we are" lines for your name and address, which you fill in in `shop-settings.js`. They stay hidden on the live site until you do. UK online sellers are generally expected to give a name and contact address. It can be a business address rather than your home, and the guide points you to gov.uk, as I can't give legal advice. - **Delivery page.** It now covers outside the UK, mixed orders, returns "within 14 days of them arriving", what to do if something is damaged, and a line saying the site uses no cookies or tracking and your details are only used to post orders. - **Smaller trust touches.** There's a small leaf icon in the browser tab. I also removed "local" and "loved" from the home page because you hadn't told me those. **Screen readers and keyboards** - The seven "Buy now" buttons now say what they buy, e.g. "Buy Riverside candle, £18". Before, a screen reader just heard "Buy now" seven times. - Added a visible outline on whatever has keyboard focus, and a "skip to content" link on every page. - Marked the current page in the menu, and removed a confusing duplicate label on the hero picture. - Smooth scrolling is switched off for people who ask their device to reduce motion. **Text size and contrast** - The orange warning text was too faint, so I darkened it. I enlarged the small grey notes (the "+ £3.95 UK delivery" lines, the badge and the footer). - Everything else already had good contrast. I also fixed the candle drawing in the picture placeholders, which was being drawn smaller than intended. ## Still for you to decide 1. **Mix-and-match by email.** Keep it, or would you rather I add a third bundle? A Fireside + 200g candle at £42 would cover the £42 case neatly. 2. **Returns wording.** I changed it to "14 days of them arriving". Does it cover wax melts and gift sets too, and who pays return postage? 3. **Privacy promise.** The Delivery page says you only use customers' details to post orders. Check you're happy with that. 4. **Royal Mail timing.** The site doesn't say how long delivery takes once posted. Add it if you like. The guide `START-HERE.txt` is updated to match, including how to turn on Stripe receipts, because the Thank-you page promises one. --- ## Prompt 4: you Thank you, that's a lot I wouldn't have thought of. I've decided: 1. Please add your third bundle: a Fireside candle plus a 200g candle (customer picks Riverside or Allotment) for £42, with free delivery. 2. Then take out the "email us and we'll set it up as one order" bit. I'd rather keep it simple with the three bundles. 3. Returns: wax melts and gift sets can come back too if they're unopened. The customer pays return postage unless it arrived damaged. Then tell me which files you changed, so I know what's different. ### Claude I'll look at the parts I need to change. Now the edits. First the home page and settings. *[Claude edited the file `fern-and-wick/index.html`]* *[Claude edited the file `fern-and-wick/index.html`]* *[Claude edited the file `fern-and-wick/index.html`]* *[Claude edited the file `fern-and-wick/index.html`]* *[Claude edited the file `fern-and-wick/shop-settings.js`]* *[Claude edited the file `fern-and-wick/site.js`]* *[Claude edited the file `fern-and-wick/site.js`]* *[Claude edited the file `fern-and-wick/delivery.html`]* *[Claude edited the file `fern-and-wick/delivery.html`]* *[Claude saved the file `fern-and-wick/images/put-your-photos-here.txt`]* Last, the guide. *[Claude edited the file `START-HERE.txt`]* *[Claude edited the file `START-HERE.txt`]* *[Claude edited the file `START-HERE.txt`]* *[Claude edited the file `START-HERE.txt`]* *[Claude edited the file `START-HERE.txt`]* *[Claude edited the file `START-HERE.txt`]* *[Claude edited the file `START-HERE.txt`]* *[Claude edited the file `START-HERE.txt`]* *[Claude edited the file `START-HERE.txt`]* *[Claude edited the file `START-HERE.txt`]* All three changes are made. I haven't opened the pages in a browser since editing, so refresh `index.html` on your phone and check the new bundle card. ## What changed 1. **Third bundle added: Fireside + a candle, £42, free delivery.** It's a Fireside 300g plus a 200g candle, with Riverside or Allotment picked at checkout. The bundles section now shows three cards, and the "free delivery" wording now says "all three". 2. **The "email us and we'll set it up as one order" offer is gone** from the shop section, the Delivery page and the guide. I kept one plain sentence saying each Buy button is its own order with its own delivery charge, and that the bundles are how to get several things together with free delivery. Without it, someone buying a Riverside and a Fireside separately would be surprised by two delivery charges. I also removed "for more, just email us" from the quantity line. 3. **Returns now say what you decided.** The Delivery page now reads: - Unused candles, and unopened wax melts and gift sets, can be returned within 14 days of arriving. - The customer pays return postage unless the item arrived damaged, in which case you cover it. ## Files changed In the `fern-and-wick` folder (the ones you upload): - **`index.html`:** new bundle card, the shop-section wording, the "all three" line, and the quantity line. - **`delivery.html`:** the "all three", "Ordering more than one thing" and returns wording. - **`shop-settings.js`:** one new line for the third bundle's link (`firesideplus`). Your links are now 8 instead of 7. - **`site.js`:** it now checks for 8 links, so the yellow "Setup check" box counts correctly. - **`images/put-your-photos-here.txt`:** adds `fireside-plus.jpg` to the list of photo names. Next to the folder: - **`START-HERE.txt`:** every "7 links" now says 8, the table has a row for the new bundle, and the mix-and-match section is replaced by a short note on delivery. The returns item is updated to match what you decided. Unchanged: `style.css`, `about.html` and `thanks.html`. ## Before you launch You'll make **8** Stripe links now. The new one is "Fireside + a candle": £42, free delivery, a maximum of 1, and one dropdown, "Extra candle: choose your scent" with Riverside or Allotment. The table in the guide has the full list. --- ## Prompt 5: you I've made free GitHub and Cloudflare accounts, and I've opened my Stripe account. On GitHub I made a new repository called fernandwick (I switched on "Add README"), and in Cloudflare I went to Workers & Pages, Create application, Pages, Connect to Git, and picked that repository, so the shop should go live by itself whenever the files on GitHub change. I don't want to use the terminal or install anything. Please tell me, step by step, by clicking around the Stripe, GitHub and Cloudflare websites: 1. how to make my payment links in Stripe, with the right delivery settings, and where I paste them, 2. how to get the shop's files into my GitHub repository and find the address where it's live, 3. how I put a change live later. Tell me what I should see at each step. ### Claude Do the steps in a different order from the one you asked for. Stripe's "thank you" setting needs your shop's live address, and you only get that address once the files are on GitHub. So the order is: - **Part A:** get the files onto GitHub and find your address. - **Part B:** make the 8 Stripe links. - **Part C:** paste the links in. - **Part D:** how to change things later. I can't see your screens, and GitHub, Cloudflare and Stripe rearrange their menus now and then. If a button has moved, look for the nearest match. If what you see doesn't match what I describe, tell me what's on screen and I'll sort it out. Ignore Steps 1 and 4 of `START-HERE.txt`. They describe drag-and-drop upload to Cloudflare, which you're replacing with GitHub. The rest of that file (the table of links and the settings notes) still applies. --- ## Part A: Put the files on GitHub and find your address **A1. Upload the files** 1. Go to github.com, open your **fernandwick** repository, and make sure you're on its main page. You should see one file, `README.md`. 2. On your computer, **open** the `fern-and-wick` folder so you can see what's inside. You should see `index.html`, `about.html`, `delivery.html`, `thanks.html`, `style.css`, `site.js`, `shop-settings.js` and an `images` folder. 3. On GitHub, click **Add file**, then **Upload files**. You should see a big "Drag files here" area. 4. Select **everything inside** the folder (Ctrl+A on Windows, Cmd+A on a Mac) and drag it into that area. Don't drag the `fern-and-wick` folder itself. If you do, your shop ends up in a sub-folder and the address will show a "not found" page. 5. Wait for the list of files to appear. You should see all the files, and `images/put-your-photos-here.txt` listed too. 6. Scroll down and click the green **Commit changes** button. You should be taken back to the main page, which now lists your files with `index.html` at the top level, not inside another folder. **A2. Watch Cloudflare publish it** 1. Go to dash.cloudflare.com, then **Workers & Pages**, then click your project. 2. Open the **Deployments** tab. After a minute or two you should see a new deployment with a green **Success**. If a deployment is still "Building", wait and refresh. 3. If Cloudflare ever asks for **Build settings**, leave the framework as **None**, leave the build command **empty**, and leave the output directory empty (or `/` if it won't accept empty). 4. If it asks for a "deploy command", you're in the other kind of Cloudflare setup (Workers) rather than Pages. Stop and tell me. **A3. Find your address** 1. On the project's page, look for the **Domains** or **Visit site** link near the top. It will look like `https://fernandwick.pages.dev`. If that name was taken, it will have some extra letters on the end. 2. Click it. You should see your shop. The Buy buttons will say **"Email us to order"**, which is expected until Part C. 3. **Copy this address.** You need it in Part B. --- ## Part B: Make the 8 payment links in Stripe You can make the links in Stripe's test mode first to practise. But test links are separate from live ones, so you'd have to redo all 8. The simpler route is to make them live, then test with one real purchase and refund it. If Stripe shows a banner saying your account isn't activated yet, finish that first. It asks for identity and bank details, so that you can actually be paid. **B1. Start a link** 1. Go to dashboard.stripe.com and log in. 2. Find **Payment links**. It may be on the left menu, or under **More +** or **Product catalogue**. 3. Click **New** (or **Create payment link**). You should see a page with a form on the left and a preview of the payment page on the right. **B2. Make the first link: Riverside candle** Work down the form: 1. **Products**: click **Add a product**, then **Add new product**. - Name: `Riverside candle, fig and cedar 200g` - Pricing: **One-off**, **£18.00**, currency **GBP** - Click **Add product**. It should appear in the list with its price. 2. **Quantity**: click **Adjustable quantity** and set the **maximum to 2**. The reason is in the table below. 3. **Collect customers' addresses**: choose **Billing and shipping addresses**, or **Shipping addresses** if offered. - Under the countries, remove everything except **United Kingdom**. You should see only that one country listed. 4. **Shipping options** (it appears once shipping addresses are on): click **Add shipping rate** or **Create new rate**. - Display name: `UK delivery` - Amount: `3.95`, GBP - Save it. The preview on the right should now show the delivery cost. 5. **Tax**: leave automatic tax **off**. 6. **Options**: leave promotion codes **off**. 7. Click the **After payment** tab (it may be a section lower down). - Choose **Don't show confirmation page**, then **Redirect customers to your website**. - Paste your address plus `/thanks.html`, for example `https://fernandwick.pages.dev/thanks.html`. Use your real address, with no spaces. 8. Click **Create link** (top right). You should see a page with a link starting `https://buy.stripe.com/`. Copy it with the **Copy** button and paste it into a plain notes file for now. Label it "Riverside". Do **not** use a link that contains `test_`. That means you're in test mode, and you'll get the yellow "Test mode" warning on your site. **B3. Make the other 7** Repeat B2 using this table. Everything stays the same each time (UK only, thank-you address, delivery), except the product, the delivery choice, the maximum quantity and the dropdown. | Product (name it like this) | Price | Delivery | Max qty | Dropdown to add | |---|---|---|---|---| | Riverside candle (done) | £18 | UK delivery £3.95 | 2 | none | | Allotment candle, tomato leaf and basil 200g | £18 | UK delivery £3.95 | 2 | none | | Fireside candle, smoke and vanilla 300g | £24 | UK delivery £3.95 | 1 | none | | Wax melts, pack of 6 | £8 | UK delivery £3.95 | 4 | **Scent**: Fig and cedar, Tomato leaf and basil, Smoke and vanilla | | Gift set | £30 | UK delivery £3.95 | 1 | **Choose your candle (melts will match)**: Riverside fig and cedar, Allotment tomato leaf and basil | | The Trio (one of each candle) | £60 | **Free UK delivery £0** | 1 | none | | Fireside + a candle | £42 | **Free UK delivery £0** | 1 | **Extra candle: choose your scent**: Riverside, Allotment | | Gift set + a candle | £48 | **Free UK delivery £0** | 1 | **Gift set: choose your candle (melts will match)**: Riverside, Allotment, and a second dropdown **Extra candle: choose your scent**: Riverside, Allotment | How to do the specific bits: - **Free delivery:** in the shipping section, create a second rate named `Free UK delivery` with amount `0`. For the three bundles, choose that one only. For the others, choose `UK delivery`. Only one rate should be ticked per link. - **Dropdowns:** find **Add custom fields**, then **Add custom field**, then **Dropdown**. Type the label from the table, then add each option on its own line. The preview should show the dropdown. - **Why the quantity limits?** A payment link can't make delivery free once the basket passes £40. The limits stop anyone running up a £40+ order on a link that charges delivery. Two Fireside would be £48 with delivery charged, which is why it's capped at 1. - **Trio and bundles:** for these, create one product each (for example "The Trio" at £60). It's simpler than multi-product links. - **Shortcut:** if the page for a finished link has **Duplicate** or **Copy** somewhere, use it to save retyping the settings. I can't promise Stripe has this. **B4. Check the list** Go back to the **Payment links** list. You should see 8 links, each with the right price. Open one to check the delivery and UK-only setting. **B5. Receipts and order emails (do once)** - Go to **Settings**, then **Business**, then **Customer emails**, and switch on **Successful payments**. The Thank-you page promises customers a receipt. - Go to **Settings**, then **Notifications**, and switch on emails for successful payments, so that you hear about each order. --- ## Part C: Paste the links in and publish 1. On GitHub, open your repository and click **`shop-settings.js`**. 2. Click the **pencil icon** at the top right of the file. You should see the text become editable. 3. Replace each `PASTE-…-HERE` text with your link, keeping the quote marks and the comma at the end of the line. Each line has a comment (the text after `//`) telling you which product it is. Match them carefully: ``` riverside: "https://buy.stripe.com/abc123", // Riverside candle, £18 ``` 4. While you're in the file, replace the example email, and fill in `owner` and `address` (your name and a contact address). Until you do, the name and address lines on the About page stay hidden. 5. Click **Commit changes…** (green button, top right), then **Commit changes** again in the box that appears. 6. Give it a minute or two. Check Cloudflare **Deployments** for a new green **Success**. 7. Open your live address and hard-refresh (Ctrl+F5, or Cmd+Shift+R on a Mac). Every Buy button should now say **"Buy now"**. **Test it:** on your phone, press the **Wax melts** button (£8). - You should see the Stripe page with the three scents in a dropdown, £8, and £3.95 delivery. - It should only accept a UK address. - Make a real purchase with your own card, check that you land on your thank-you page, and look in the Stripe dashboard for the order, address and scent choice. - Then refund it in the dashboard (open the payment, click **Refund**). - Open a bundle link too, to check delivery shows as free. --- ## Part D: Putting a change live later **Small text change (words, an email, a link):** 1. On GitHub, click the file, then the **pencil**. 2. Change the text, then click **Commit changes…** and **Commit changes**. 3. Wait a minute or two. Cloudflare publishes it automatically. **Replacing a file or adding photos:** 1. Open the repository, then **Add file**, then **Upload files**. 2. Drag in the new file. Use **exactly the same name** to replace the old one. For photos, name them as in `images/put-your-photos-here.txt`. 3. Commit changes. The new version replaces the old one. For a photo, first click into the `images` folder on GitHub, then do Add file, Upload files. Otherwise it lands in the wrong place. **A price change:** make a new link in Stripe, paste it into `shop-settings.js`, and change the price shown in `index.html`. **If something goes wrong:** in Cloudflare, **Deployments** shows each version. A red "Failed" means the last change broke something, so tell me what it says. Your previous version stays live meanwhile.