Embeddable checkout · multi-store

Checkout you clip into any site.

One snippet. Every store you run. Your Stripe, your money, your design — and a card number never touches your server.

PCI SAQ-A scope Funds settle to you Live in minutes
<!-- Add Klyp to any page --> <script src="https://cart.dvmt.ca/v1/klyp.js" data-klyp-key="pk_live_northstars_8fae…"></script> <!-- Any element becomes a buy button --> <button class="klyp-add" data-klyp-price="price_jersey">Add to cart</button>
What Klyp is

The checkout layer — not another store builder.

Klyp turns the site you already have into a store. It runs the cart, the checkout, and the order record. The money rail underneath stays yours.

01

Clip it in

One script tag, then mark any element as a buy button. Works on static HTML, any CMS, any framework. No backend to stand up.

02

Your Stripe, your money

You connect your own Stripe account. Payouts settle directly to you. Klyp never holds, pools, or moves your funds.

03

Never touch a card

Card fields are hosted by the processor. The number goes straight to Stripe — never to Klyp, never to your server.

How a sale moves

Four steps, and the browser is never trusted with a price.

Every total is resolved on the server from your catalog. The webhook from Stripe — not the buyer's tab — is what marks an order paid.

STEP 01

Add to cart

The buyer adds items. Klyp builds the cart server-side and resolves each price from your catalog of record.

STEP 02

Hand off to pay

Klyp opens a checkout session on your connected Stripe account. Card details go to Stripe directly over its hosted fields.

STEP 03

Confirm by webhook

Stripe sends a signed event. Klyp verifies it, dedupes it, marks the order paid, and decrements inventory — exactly once.

STEP 04

Settle to you

Funds land in your Stripe balance and pay out on your schedule. Klyp's fee is collected as an application fee, nothing more.

Two ways to wire it

Markup for the quick path. An SDK for the precise one.

Use data attributes when you just want a buy button. Reach for the JavaScript SDK when you want full control of the cart. Either way, the price is decided by the server.

<button class="klyp-add"
  data-klyp-price="price_jersey"
  data-klyp-qty="1">
  Add jersey — $50
</button>

<a class="klyp-checkout">View cart</a>

Klyp reads the attributes, looks the price up in your catalog, and opens the cart. The number in the DOM is a label only — it is never the source of truth.

await Klyp.cart.add({ priceId: 'price_jersey', qty: 1 })
await Klyp.cart.apply('TEAM10')          // discount
Klyp.on('cart:updated', render)
await Klyp.checkout()                  // → Stripe

The SDK is promise-based, event-driven, and framework-agnostic. Build your own cart UI and let Klyp own the money path.

Security posture

Built the way you'd build for a bank.

The safest way to handle a card is to never have it. Everything below that follows the same instinct: assume the worst, isolate by default, and prove every event.

  • Card data never reaches us

    Hosted card fields keep you in PCI SAQ-A — the lightest possible scope. No PAN crosses a Klyp server.

  • You hold the money, not us

    Stripe Connect settles to your own account. Klyp is not a payment facilitator and never pools funds.

  • The server owns every price

    Totals, discounts, and tax are computed from your catalog. A tampered request is rejected, not charged.

  • Two-factor, by email and app

    A 7-digit email code on every sign-in, with authenticator-app 2FA and one-time recovery codes for owners.

  • Every key is scoped

    Publishable keys are locked to your domains. Secret keys are hashed at rest and revocable in one click.

  • Everything is logged

    An append-only audit trail records every money and admin event, with actor, IP, and timestamp.

At rest & in transit

No shortcuts on the boring parts.

Passwords hashed with Argon2id. Sessions rotated and short-lived. Webhooks verified and replay-proof. Edge WAF and bot challenges on every sensitive route.

PCI SAQ-A Argon2id TLS 1.3 Signed webhooks Idempotent Turnstile PIPEDA-aware
Pricing

Free to build. A flat slice when you sell.

Test mode is unlimited and free forever. In production, Klyp adds a small application fee on top of your processor's rate — and your processor pays you directly.

Test
$0 / forever

Everything, in test mode.

  • Unlimited test stores
  • Full dashboard & SDK
  • Stripe test cards
  • No card required
Live
1.5% + your processor

Pay only on real sales.

  • Unlimited live stores
  • Funds settle to your Stripe
  • Discounts, inventory, webhooks
  • Email & chat support
Agency / License
Custom

For builders & resellers.

  • White-label the checkout
  • Client sub-accounts
  • Revenue share or flat license
  • Priority support
Built for people who ship

Wire up a real checkout before your coffee's cold.

Start in test mode, connect your Stripe when you're ready, flip to live. The same snippet works from your first sale to your thousandth.

← Back to klyp.dev Documentation & support

Everything, in one place.

How Klyp works end to end, how to wire it in, what it does with your money and your data, and answers to the questions every team asks.

Overview

Klyp is an embeddable checkout. You keep the site you already have — static HTML, a CMS, or a framework — and Klyp adds the part that's genuinely hard to get right: a cart, a secure checkout, and an order record, across as many stores as you run.

Three ideas hold the whole product together:

  • Klyp is the checkout layer, not the bank. You connect your own Stripe account. Klyp orchestrates the sale; Stripe moves the money and pays out to you.
  • The card never reaches Klyp. Card fields are hosted by Stripe. The number goes from the buyer's browser to Stripe directly, which keeps you in the lightest PCI scope (SAQ-A).
  • The server decides the price. Every total is computed from your catalog of record. A request that tries to set its own price is rejected, never charged.
Mental model

If you've used a hosted cart before: Klyp is the cart and checkout. Stripe is the gateway underneath. You bring Stripe; Klyp brings everything around it.

Quickstart

From zero to a working test checkout in about five minutes.

  1. Create an account and verify your email.
  2. Create your first store and copy its publishable key (pk_test_…).
  3. Add a product with at least one price.
  4. Drop the snippet on any page and mark a button as a buy button.
  5. Check out with a Stripe test card and watch the order appear in your dashboard.
<script src="https://cart.dvmt.ca/v1/klyp.js"
        data-klyp-key="pk_test_yourstore_…"></script>

<button class="klyp-add" data-klyp-price="price_123">Add to cart</button>
<a class="klyp-checkout">Checkout</a>
No money moves in test mode

Test mode uses Stripe test keys and test cards. You can build the entire flow before you ever connect a live account.

Accounts & teams

An account belongs to a person. An organization owns stores and billing. People join an organization with a role:

  • Owner — full control, including billing, Stripe connection, and deleting the org. There is always exactly one owner; ownership can be transferred.
  • Admin — manage stores, products, orders, team members, and keys. Cannot delete the org or change billing.
  • Staff — view orders and products, issue refunds if granted. No access to keys or team settings.

Invites are sent by email and expire after 7 days. Removing a member ends their sessions immediately.

Sign-in & two-factor

Every sign-in is protected. After your password, Klyp sends a 7-digit code to your email that's valid for 10 minutes. Enter it to finish signing in.

Stronger 2FA

Owners and admins can add an authenticator app (TOTP). When enabled, the app's 6-digit code replaces the email code at sign-in, and Klyp issues ten one-time recovery codes — store them somewhere safe, as they're the only way back in if you lose the device.

What happens on too many tries

Five failed codes locks the attempt for 15 minutes and emails you an alert. Five failed passwords locks the account and requires a reset link.

Why 7 digits by email, 6 in the app?

Authenticator apps follow a standard that produces 6-digit codes. Email and SMS codes can be any length, so Klyp uses 7 digits there for a little extra strength. Both are valid; the app method is the more secure of the two.

Connect Stripe

Klyp uses Stripe Connect. You authorize Klyp to create charges on your Stripe account; Stripe settles the funds to you and pays out on your schedule.

  1. Open Store → Payments and choose Connect Stripe.
  2. Sign in to Stripe (or create an account) and approve the connection.
  3. You'll return to Klyp. The store shows Charges enabled once Stripe has what it needs.

You can connect a different Stripe account per store, which is what makes multi-store and agency setups clean — each store's money goes exactly where it should.

Klyp never holds your funds

Because charges happen on your connected account, payouts are between you and Stripe. Klyp is not a payment facilitator and cannot access your balance.

Products & prices

A product is the thing you sell. A price is an amount in a currency attached to a product — a product can have several (e.g. CAD and USD, or sizes). Optional variants carry SKUs and inventory.

  • Create products in the dashboard, or import them via the API.
  • Each price gets a stable ID (price_…) that you reference from your site.
  • Set inventory per variant to have Klyp block oversells and decrement on payment.

Install the snippet

Add one script tag to any page, using your store's publishable key. It's safe to commit — the publishable key is public and locked to your domains.

<script src="https://cart.dvmt.ca/v1/klyp.js"
        data-klyp-key="pk_live_yourstore_…"
        integrity="sha384-…" crossorigin="anonymous"></script>

Register your domain

In Store → Domains, add the domains the snippet runs on. Klyp checks the request origin against this list, so a copied key can't be used on a site you don't control.

The two cart models

Klyp supports both at once. Pick per page; mix freely.

1 · HTML attributes

The fastest path. Mark any element with klyp-add and a price ID. No JavaScript to write.

<button class="klyp-add"
  data-klyp-price="price_123"
  data-klyp-qty="1">Add to cart</button>

2 · JavaScript SDK

Full control. Build your own cart UI and drive Klyp programmatically.

await Klyp.cart.add({ priceId: 'price_123', qty: 2 })
await Klyp.cart.remove('item_abc')
await Klyp.cart.apply('TEAM10')
Klyp.on('cart:updated', (cart) => render(cart))
await Klyp.checkout()
The price in your markup is a label

In both models, Klyp resolves the real amount from your catalog server-side. Editing a number in the DOM changes the label, never the charge.

Testing

Test mode mirrors live exactly, with no money moving. Use Stripe's test cards:

  • 4242 4242 4242 4242 — succeeds
  • 4000 0000 0000 9995 — declined (insufficient funds)
  • 4000 0027 6000 3184 — requires 3-D Secure

Any future expiry, any CVC, any postal code. Orders from test mode are tagged and kept separate from live data.

Going live

  1. Connect a live Stripe account (Connect Stripe).
  2. Swap your snippet's key from pk_test_… to pk_live_….
  3. Confirm your live domains are registered.
  4. Run one real transaction and refund it to confirm the full loop.

Payments & webhooks

When a buyer pays, Stripe processes the charge and sends Klyp a signed webhook. Klyp verifies the signature, ignores duplicates, marks the order paid, decrements inventory, and emails a receipt — all exactly once, even if the event is delivered twice.

You can subscribe to Klyp's own webhooks (order.paid, order.refunded, cart.abandoned) to sync orders into your own systems. Klyp signs them; verify the signature before trusting the payload.

The browser is never the source of truth

A success page can be faked or skipped. Klyp only considers an order paid when the verified webhook says so.

Refunds & disputes

Refund a full or partial order from Orders → Refund; Klyp issues it against the original charge on your connected account. Disputes (chargebacks) are handled in your Stripe dashboard, since the funds and the relationship are yours — Klyp surfaces the dispute and links straight to it.

Payouts

Payouts are between you and Stripe. Your sales land in your Stripe balance and pay out on whatever schedule you've set there (daily, weekly, manual). Klyp does not touch, delay, or route your payouts.

Fees & billing

Test mode is free. On live sales, Klyp collects a 1.5% application fee at the moment of payment, on top of Stripe's processing rate, which Stripe charges separately. Nothing is invoiced after the fact — the fee is taken per transaction, so you never owe Klyp a balance.

Worked example

On a $100 sale: Stripe takes its rate (about $3.20 in Canada), Klyp takes $1.50, and the remainder settles to your Stripe balance. You pay Klyp nothing on the $0 days.

Security model

The full posture, plainly:

  • Card data: hosted fields only. No PAN reaches Klyp. PCI SAQ-A.
  • Funds: Stripe Connect. Klyp is not a facilitator and holds nothing.
  • Auth: Argon2id password hashing, rotating short-lived sessions, email 2FA plus optional TOTP, lockout and alerting on abuse.
  • Keys: publishable keys are domain-scoped; secret keys are hashed at rest and revocable instantly.
  • Integrity: server-side pricing, idempotent order creation, signature-verified and replay-proof webhooks.
  • Edge: WAF rules and a bot challenge (Turnstile) on sign-in, sign-up, and checkout.
  • Audit: an append-only log of every money and admin action, with actor, IP, and time.
  • Isolation: every row is scoped to a store; one tenant can never read another's data.

Report a vulnerability at security@cart.dvmt.ca. We acknowledge within one business day and don't pursue good-faith researchers.

Data & privacy

Klyp stores the minimum: account details for you, and for buyers, the order and the email needed to send a receipt — never card numbers. We don't sell data. Handling aligns with Canada's PIPEDA, and a Data Processing Agreement is available for teams that need one.

  • Export or delete a buyer's data on request from Orders → Customer.
  • Data is encrypted in transit (TLS 1.3) and at rest.
  • You can request full account deletion; live records are retained only as long as tax and dispute rules require.

Status & SLA

Live status is published at status.cart.dvmt.ca. Live-plan target uptime is 99.9%. Incidents are posted within 15 minutes of detection with rolling updates until resolved, followed by a post-mortem for anything customer-impacting.

Troubleshooting

The cart won't open

Check that the snippet loaded (no console errors) and that the current domain is registered under Store → Domains. An unregistered origin is rejected by design.

"Price not found"

The data-klyp-price ID doesn't exist in this store or mode. Confirm you're using the matching pk_test/pk_live key for the mode the price lives in.

Checkout opens but payment fails

Confirm the store shows Charges enabled in Payments. If Stripe onboarding is incomplete, charges are blocked until it's finished.

Order paid but not showing

Orders are written on the webhook. If Stripe is delayed, it can take a moment; the webhook log in Developers → Events shows delivery and any errors.

FAQ

Is Klyp a payment processor?
No. Klyp is the cart and checkout. The processor — Stripe — is yours. You connect it, and it pays you directly.
Do I need my own server?
No. The snippet works on fully static sites. Klyp's backend handles the cart, pricing, and orders.
Can I use this on client sites I build?
Yes — that's a core use case. Each store can connect its own Stripe account, and the Agency/License plan adds white-labeling and client sub-accounts.
What happens to a card number?
It goes from the buyer's browser to Stripe's hosted fields and never touches Klyp or your server. That's what keeps you in PCI SAQ-A.
Can someone fake a lower price by editing the page?
No. Prices in your markup are labels. Klyp resolves the real amount server-side from your catalog before charging.
Will there be processors other than Stripe?
Klyp is built on a provider abstraction, so additional processors can be added without changing how you wire your site. Stripe is the supported processor today.
How do refunds work?
From the dashboard, full or partial, against the original charge on your connected account.
What does it cost?
Free in test mode. In live mode, a 1.5% application fee per sale on top of Stripe's rate, collected automatically — no invoices.

Contact support

Live-plan teams get email and chat support. Reach us at support@cart.dvmt.ca with your store ID (found in Store → Settings) and we'll have what we need to help fast. For anything security-related, use security@cart.dvmt.ca.

Before you write in

Including your store ID, the mode (test or live), and the order or price ID in question gets you a real answer on the first reply instead of a round of questions.