Add your checkout button and publish your site

Create your offer first and set it active. The button is tied to a specific offer, so there needs to be one to select. See Create an offer.

The Button tab in the Koarge plugin panel. Before you can add a button, install the runtime into your Framer project — this is the code that makes checkout work on your live site.

You do this once per project, not once per button.

The offer is chosen in the Offer tab, not the Button tab.

1. Open the Offer tab and select the offer you want to sell. It shows as Active · Selected.

2. Move to the Button tab. Your choice appears there under Selected offer.

3. Select Insert default button. A Buy now button appears on your canvas.

4. Style it however you like using Framer's normal controls — size, colour, corners, typography, hover states. It's a normal Framer element.

The button's wiring survives restyling. Change anything about how it looks; it keeps selling the same offer.

Each button sells the offer that was selected when you inserted it, and that can't be changed afterwards. There's no way to re-point an existing button at a different offer.

So for every offer you sell, the sequence is the same: select it in the Offer tab, then insert its own button. Three products means three buttons, each inserted after selecting its own offer.

If you've put a button on the wrong page or attached it to the wrong offer, delete it, select the right offer, and insert a fresh one.

There's no cart, so buyers purchase one offer at a time.

This is the step that catches everyone.

Framer keeps your editor and your live site separate. Nothing you do on the canvas reaches visitors until you publish. So it's entirely possible to have a working button in the editor, a correct offer, and a connected Stripe account — while your live site sells nothing, because the page your visitors see was published before you added any of it.

Use Framer's publish button. Publish to the domain your buyers actually visit — if you've set up a custom domain, publishing only to your .framer.website address won't help people arriving at your real one.

Two checks:

In Koarge. Go to Setup → Framer. When your site is published with checkout on it, you'll see Checkout is live on your site, the address it's published at, and when you last published. Koarge detects this, so it's a real check rather than a reminder.

On your site. Open your live site in a private browsing window, go to the page with your button, and select it. If the drawer opens, you're live. The private window matters — your normal browser may be showing you a cached version of the old page.

Republish after: adding, moving, or restyling a button, or saving a new checkout drawer theme.

No republish needed: changing an offer's price, file, name, or description. Those take effect on your live site straight away, because the button reads them live.

• No offers appear to select. Either you haven't created an offer yet, or your license isn't activated.

• Selected offer is empty in the Button tab. Go back to the Offer tab and select an offer first.

• The offer is listed but can't be selected. It's probably inactive — see Why can't I activate my offer?

• The button is in the editor but not on your live site. You haven't published since adding it.

• Checkout is still missing after publishing. Confirm you published to the domain your buyers use, then hard-reload or open a private window.

• The button appears but does nothing. Your license may be inactive, or the offer it points at may have been archived.

• Style your checkout drawer

• Create an offer

• Take a test payment before you go live