N
HeadlessCoreHeadless Core
Back to Newsroom
Development

Getting Started with HeadlessCore: From Purchase to a Live Site

jana
janaCONTENT CONTRIBUTOR
July 28, 2026
3 min read
1 views
Getting Started with HeadlessCore: From Purchase to a Live Site
📢 Google AdSense Slot (auto) — Configure Publisher ID in Theme Settings to enable live ads.

HeadlessCore pairs a WordPress theme with a Next.js 16 starter kit so you can run a fast, decoupled site without wiring the plumbing yourself. This guide walks through everything from purchase to your first deploy.

What you’re setting up

Two pieces, working together:

  • The WordPress theme — installs on your existing (or fresh)

WordPress site, exposes your content over WPGraphQL, and includes 47 pro Gutenberg blocks that are built to render correctly on the decoupled frontend (not just in wp-admin).

  • The Next.js starter kit — a ready-to-deploy frontend with 8 demo

layouts (blog, corporate, portfolio, shop, landing), ISR, on-demand revalidation, and draft preview already wired up.

Prerequisites

  • A WordPress site (existing or new) with admin access
  • Node.js installed locally, and a place to deploy the frontend (Vercel

works out of the box; any Node host works too)

  • A HeadlessCore license key

Step 1 — Purchase and get your license key

Buy through the Stripe-powered checkout on the HeadlessCore product page. Your license key is emailed instantly after payment, and also shown on the confirmation page — copy it somewhere safe, you’ll need it in Step 5.

Step 2 — Download the product

Once you have your license key, go to the download page and paste it in. This unlocks the current release ZIP, which contains the WordPress theme, the Next.js starter kit, and docs.

Step 3 — Install the WordPress theme

In wp-admin: Appearance → Themes → Add New → Upload Theme, select the theme ZIP from the download, install, and activate. Make sure WPGraphQL is active (it ships as a required plugin dependency) — this is what the Next.js frontend talks to.

Step 4 — Configure the Next.js frontend

Unzip the starter kit locally, run npm install, then set your WordPress GraphQL endpoint in .env.local:

NEXT_PUBLIC_WORDPRESS_API_URL="https://your-wordpress-site.com/graphql"

Run npm run dev and confirm your content loads at localhost:3000.

Step 5 — Activate your license

In wp-admin, go to Headless Core → Settings → Licensing and paste in the license key from Step 1. This unlocks product updates through the built-in updater.

Step 6 — Deploy

Deploy the Next.js app to Vercel (or any Node-compatible host) and point its production NEXT_PUBLIC_WORDPRESS_API_URL at your live WordPress site. Your WordPress install stays exactly where it is — nothing about the backend changes except that it now serves content over GraphQL instead of rendering it directly.

What to explore next

  • Pro Gutenberg blocks — mega menu, shop, forms, and more, all with

matching Next.js renderers already built in. Just add the block in wp-admin.

  • Draft preview — preview unpublished content through the real

Next.js frontend before you publish, not a guess.

  • ISR + on-demand revalidation — pages regenerate automatically when

you publish, without a full rebuild.

Need help?

Support is available at the contact address on the Terms of Service page. Installation issues, license activation, and reproducible bugs in the product itself are all in scope.

Related Stories

Comments (0)

Be the first to share your thoughts.