SuiteStatic

How it works

How to add a shopping cart to a static website

A static site has no server to take a payment, look up stock or price a parcel. SuiteStatic supplies those pieces as a hosted service your pages call from the browser, so the site stays static and the commerce still works.

Create your store See pricing

The three pieces

Everything you add to your own HTML is below. There is no package to install, no build plugin and no server to run.

index.html
<!-- 1. Your store, once per page -->
<div id="suitestatic-cart"
     data-public-key="pk_live_..."></div>

<!-- 2. Any button you already have -->
<button class="commerce-add"
        data-item-id="a1b2c3d4-..."
        data-item-name="Ethiopian Yirgacheffe"
        data-item-price="22.50">
  Add to Cart
</button>

<!-- 3. The script, at the bottom -->
<script src="https://suitestatic.com/widget.js"></script>
  • The container carries your public key and mounts the cart drawer. One per page.
  • The button is any element with class="commerce-add". The data attributes tell us which product was clicked.
  • The script is loaded once, at the bottom. It weighs nothing until a shopper opens the cart.

What happens at checkout

How a SuiteStatic order flows Your static site sends cart items to SuiteStatic, which handles checkout and orders, and connects to Stripe for payment and USPS, UPS and FedEx for shipping rates and labels. Your website Netlify · Pages · any host SuiteStatic cart · checkout orders · labels Stripe payments USPS · UPS · FedEx rates & labels
Card details go from the shopper straight to Stripe. They never reach our servers, and they are never stored in our database.

Step by step

  1. The shopper adds an item

    The cart drawer opens on your page, in your colours. Nothing has left the browser yet.

  2. They enter an address

    We size the parcel from the real weight and dimensions of what is in the cart and ask the carriers for live rates.

  3. They pay

    Card details go straight to Stripe. We never see them. The payment settles into your own Stripe account.

  4. The order reaches you

    It appears in your dashboard with items, options, totals and the shipping address, and confirmation email goes out to both of you.

  5. You buy the label

    The parcel is already sized. Pick a service, buy the postage at cost, and tracking is emailed to your customer automatically.

What you do not have to build

  • A checkout page, or PCI compliance around it.
  • A database of orders, or a way to look them up.
  • Carrier accounts, rate tables or a label printer integration.
  • Transactional email for confirmations, tracking and refunds.
  • Inventory counting, discount codes or abandoned cart recovery.

Common questions

Does this slow my site down?

The script is small and loads at the bottom of the page. The cart itself is only built when a shopper opens it, so pages that nobody shops on pay almost nothing.

Do I need a build step?

No. It is three tags in your HTML. If you use a generator you will probably want a partial or component so you are not repeating them, but that is your choice, not a requirement.

Where does the money go?

Into your own Stripe account. We are not in the middle of it.

More questions

Try it on your own site

Create an account, add one product, and paste the snippet into a page. The Starter plan is free.

Create your store