— go to the documentation home page
SubscriptionFlow documentation

Checkout Customization

Enhance the WooCommerce checkout with subscription-friendly layouts, trust messaging and conversion blocks, helping more visitors complete the purchase.

Available onPro

Documents version1.5.5

Last updated

On this page

What this does

Checkout customization lets you present a cleaner, more persuasive checkout — with a chosen layout, a visual preset, and trust elements like a “secure payment” note, a guarantee, and support text. There are two ways to apply it:

  • Store‑wide defaults via Settings → Checkout (Pro).
  • Per‑page design via the Elementor Checkout Widget (Pro), for full drag‑and‑drop control.

Why it exists: the default checkout is functional but plain. A subscription purchase benefits from reassurance (security, guarantees, support) and a layout that keeps buyers focused.

Typical use cases

  • A clean, single‑column SaaS‑style checkout for a software subscription.
  • A trust‑building checkout with a money‑back guarantee line.
  • A branded, dark or corporate look that matches your site.

Store‑wide checkout settings

Go to SubscriptionFlow → Settings → Checkout to set defaults:

Setting What it controls
Enable checkout enhancements Turns the SubscriptionFlow checkout features on.
Default Layout The overall structure (one column, two columns, summary‑left, card, compact, minimal).
Default Preset A ready‑made visual style (minimal, dark, corporate, agency, compact, or none).
Secure Notice / Guarantee / Support text Trust messages shown at checkout.
Import / Export Copy settings as JSON to reuse on another site.

Full details on the settings screen are in Checkout Settings.


Per‑page design with Elementor

For pixel‑level control, build your checkout with the Elementor Checkout Widget (Pro). It offers the same layouts and presets plus Elementor’s styling controls, so you can match your brand exactly.


How to set it up

Step 1 — Activate Pro under SubscriptionFlow → License.

Step 2 — Enable and choose a default look. In Settings → Checkout, enable enhancements and pick a Layout and Preset.

Step 3 — Add trust messaging. Fill in the Secure, Guarantee, and Support texts.

Step 4 — (Optional) Design with Elementor. Add the Checkout widget to a page for full visual control.

Step 5 — Test a purchase. Buy a subscription in an incognito window to confirm the checkout looks and works as intended.


Tips & Best Practices

  • Keep it focused. For subscriptions, a single‑column or summary‑left layout reduces distractions and boosts completion.

  • Add reassurance. A short security note and a guarantee line can noticeably improve conversions.

  • Match your brand. Choose a preset (or the Elementor widget) that fits your site’s look.

  • Export your settings. Once you’re happy, export the JSON so you can reuse the exact checkout on other stores.

  • Always test on mobile. Most checkouts happen on phones — confirm the layout looks great there too.


Frequently Asked Questions

Is checkout customization available on the Free plan?

No. On Free, your standard WooCommerce checkout is used. Enhancements and the Elementor Checkout widget are Pro.

Will this replace my WooCommerce checkout entirely?

It enhances and restyles the checkout experience; payments still run through your WooCommerce gateways.

Do I need Elementor to customize checkout?

No. Store‑wide defaults are set in Settings → Checkout. Elementor is only for pixel‑level, per‑page design.

Can I reuse my checkout design on another site?

Yes — use the Import/Export JSON in the Checkout settings.

Will changing the layout affect existing orders?

No. It only changes how the checkout page is presented going forward.

Does it work on mobile?

Yes — the layouts are responsive. Always test to confirm it fits your theme.