WOOHL documentation

01 · Getting started

Domains & servers

WOOHL works best when you split where shoppers browse from where WordPress handles checkout: your main domain serves the Vue storefront, and a secure subdomain runs WordPress, WooCommerce, the WOOHL plugin and checkout.

DNS checklist

1. Point example.com (and www if used) to WOOHL using the CNAME shown in your dashboard. Self-hosting? Point it at your own server instead.
2. Create secure.example.com as an A or CNAME record pointing to your existing WordPress server.
3. In WordPress Settings → General, set both WordPress Address and Site Address to https://secure.example.com.
4. Set the storefront's API base URL to https://secure.example.com — we do this for you on managed hosting.
5. In the WOOHL plugin, allow your storefront origin (https://example.com) for CORS.

02 · Getting started

What is WOOHL?

WOOHL turns your WooCommerce store into a fast, modern headless storefront built with Vue.js. Shoppers browse on the storefront; WooCommerce still runs products, orders, payments and inventory on the secure subdomain.

In short: WooCommerce stays the back end (on secure.example.com); Vue.js is the customer-facing storefront (on example.com).

03 · Getting started

Who WOOHL is for

• Store owners who want better performance and Core Web Vitals without replacing WooCommerce.
• Teams who'd rather not run a second production system — WOOHL hosts and maintains the storefront.
• Developers and agencies who want headless WooCommerce with checkout kept on the secure WordPress domain.

04 · Getting started

What you get

05 · Getting started

How it works

1. You purchase WOOHL on woohl.dev.
2. When the order is paid, a license is created automatically.
3. You get an email with your license key and download links.
4. The WOOHL plugin is installed on secure.example.com with your license key — we do this with you during migration.
5. We deploy your storefront to example.com; you point your domain using the CNAME from your dashboard.
6. Shoppers browse on example.com; checkout completes on secure.example.com/checkout.

06 · Getting started

Requirements

Secure site (WordPress + WooCommerce)

• WordPress and WooCommerce on https://secure.example.com (or your chosen secure subdomain).
• An SSL certificate on the secure hostname.
• Pretty permalinks enabled, so the REST API is reachable.

Storefront

With WOOHL hosting (included): nothing to install — no server or build tools. We handle deployment.

Self-hosting (advanced): Node.js 22 with npm, pnpm or yarn, and a Node host such as DigitalOcean App Platform.

Account

Check out while logged in to your woohl.dev account so your license appears under My Account — guest checkout may not link it.

07 · Setup

Purchasing & licensing

After you buy

• A unique license key
• An expiry date that renews with your subscription
• A link to your order and account

Where to find your key

• Your purchase email
• My Account → Woohl Licenses on woohl.dev — key, status, activated domains and downloads

Renewals

Renewing extends the same license key — nothing on your store changes. Reminder emails go out 30 and 7 days before expiry. An expired license stops validation and downloads until renewed.

08 · Setup

Install the WOOHL plugin

Install it only on the WordPress site that runs WooCommerce — the secure subdomain.

1. Download the plugin ZIP from your email or My Account → Woohl Licenses.
2. In WordPress, go to Plugins → Add New → Upload Plugin, install and activate it on secure.example.com.
3. Open Woohl → License and enter your license key.
4. Under Woohl → Connection, allow your storefront origin for CORS — the WOOHL-assigned origin from your dashboard, or your own domain if self-hosting.
5. Confirm checkout works at https://secure.example.com/checkout.

09 · Setup

Storefront setup

9.1 Unpack and install

Download the storefront ZIP from My Account, unzip it and install dependencies with npm install (or pnpm / yarn).

9.2 Configure environment variables

Create a .env file pointing the app at your secure back end:

# WooCommerce back end (secure subdomain)
WC_BASE_URL=https://secure.example.com
WC_CONSUMER_KEY=ck_xxxxxxxxxxxxxxxx
WC_CONSUMER_SECRET=cs_xxxxxxxxxxxxxxxx

# The public storefront URL (the domain your license is locked to)
WOOHL_FRONTEND_URL=https://example.com

# Optional but recommended: pins WOOHL's license-signing key
WOOHL_LICENSE_PUBLIC_KEY=paste-from-the-pubkey-endpoint

Create the consumer key and secret in WooCommerce → Settings → Advanced → REST API with Read/Write permission (write is used only to post customer product reviews). They stay on the server; the storefront never sends them to the browser.

9.3 Build and deploy

1. Build production assets with npm run build.
2. Deploy the build output to your Node host (for example, a DigitalOcean App Platform app).
3. Attach example.com (and www if needed) and enable HTTPS.

9.4 Final checks

• The storefront loads at https://example.com.
• API calls succeed against https://secure.example.com, with no CORS errors in the browser console.
• Checkout completes on https://secure.example.com/checkout.

10 · Setup

License activation

The storefront only runs with a valid license. Validation happens on the server, and each license is locked to your storefront domain.

1. In WordPress on the secure site, open Woohl → License.
2. Enter your license key. Leave License server URL blank to use https://woohl.dev.
3. Optionally paste WOOHL's signing public key, published at https://woohl.dev/wp-json/woohl-license/v1/pubkey. It lets your store cryptographically verify that license responses really come from WOOHL.
4. Save. The status badge should read ACTIVE, with your storefront domain underneath.

The first successful validation activates your storefront domain. Need a second domain — say, a staging site? Contact support and we'll add it to your license.

11 · Help

Troubleshooting