Guide Ecommerce & WooCommerce

How to take payments on your website

Hosted checkout, embedded fields, or building your own form — the choice affects your security workload far more than your conversion rate.

Updated 8 min read Beginner

"Accept payments" covers three genuinely different pieces of engineering, and which one you end up with has far more effect on your workload and your security exposure than most people expect when they start looking. This guide is about choosing between them, not about clicking through one provider's dashboard.

The three ways a site takes a card payment

MethodHow it worksWho handles the card number
Hosted / redirect checkoutThe customer leaves your site briefly, pays on a page run by the payment provider, then returns.The provider, entirely. Your server never sees the card.
Embedded / tokenised fieldsThe payment form appears to sit on your page, but the actual input fields are loaded from the provider (an iframe) and the card data goes straight to them.The provider. Your server receives a one-time token, never the card number.
Self-hosted card formYou build the form yourself and your server processes or forwards the raw card details.You do — the card number touches your code and your server.

Stripe Elements and PayPal's standard buttons are both examples of the middle row: they look integrated into your checkout, but the sensitive fields belong to the provider. That distinction matters enormously for compliance, which is covered properly in does my store need to be PCI compliant — in short, the first two options keep card data off your server and dramatically reduce what you are responsible for; the third does not, and very few small stores have a good reason to choose it.

Do not build your own card form unless you have a specific reason to

A self-hosted form is more work to build, more work to secure, and puts you in a much larger compliance category than a tokenised or hosted flow — for no benefit that a typical store actually needs. WooCommerce, Stripe and PayPal all offer tokenised or hosted options out of the box; use them.

What this looks like with WooCommerce

If your store runs on WooCommerce, you are choosing a payment gateway plugin, not writing payment code. The two most common are covered in their own guides:

  • Stripe, which handles cards directly through embedded, tokenised fields and is a common default for stores that want the checkout to feel like one continuous page.
  • PayPal, which offers both a hosted redirect flow and an on-page button, and brings its own base of customers who already have an account and trust the brand.

Most stores install both. PayPal at checkout costs nothing extra to offer and some customers actively prefer it; Stripe (or a similar card processor) covers everyone who would rather just type in a card. Check each provider's current transaction fees and country coverage before committing, since these change and vary by business type — treat any figure you find in an old blog post as unreliable.

What HTTPS has to do with this

Every method above requires the page collecting payment details to be served over HTTPS. Browsers actively block or strip payment forms on insecure pages, and providers refuse to load their embedded fields into one. Free SSL is included with hosting here — see getting HTTPS working on a store if your checkout is not already fully on HTTPS with no mixed-content warnings.

Recurring payments and subscriptions

If you sell subscriptions rather than one-off purchases, check that your chosen provider supports recurring billing before building around it — not every basic integration does out of the box, and retrofitting subscriptions onto a one-time-payment setup is more disruptive than choosing correctly at the start. Both Stripe and PayPal offer subscription products; the WooCommerce plugin ecosystem has extensions for either.

What to check before going live

  • Test mode works end to end. Every major provider offers a sandbox or test-card mode. Use it to place a full order before switching to live keys.
  • Live keys are actually live keys. The single most common launch-day payment fault is a store left in test mode after the switch, silently rejecting real customer cards.
  • Refunds work from your side. Confirm you know how to issue a refund through your provider's dashboard before you need to do it under pressure.
  • Currency matches what you priced in. A provider defaulting to the wrong currency either overcharges or undercharges every single customer.
Keep a record of every provider you connect

Payment gateways are exactly the kind of service that gets added, tested, and then forgotten about — and forgotten services are a common source of confusion months later when a setting needs revisiting. Note down what you connected and when, even if it is just a line in a private document.

Once payments are working, shipping and tax are the two settings customers actually see at checkout — shipping and tax are the natural next steps.

Related reading