Back to templates

Template details

Plasmic Split Content Template

A Plasmic app template for server-side rendered split content using middleware, deployable to Vercel.

About this template

The Plasmic Split Content Template is a starter kit that hosts a Plasmic-designed app with middleware-based server-side rendering of split content — enabling A/B testing and user segmenting at render time. It is preconfigured with a demo Plasmic project so you can deploy and start editing immediately.

What is the Plasmic Split Content Template?

It is a deployable app template that serves Plasmic-built pages with server-side rendering, using middleware to resolve which content variant a visitor sees. The app receives a Plasmic project ID and public API token as input and outputs a hosted website rendered through Plasmic Studio content. It is designed to be cloned and hosted on Vercel.

What makes it stand out?

  • SSR split content — uses middleware to render different content variants per request, the core of the template.
  • Preconfigured demo project — ships with a projectId and token from the demo Plasmic project so it runs before you configure anything.
  • Vercel Deploy button — one-click clone-and-deploy flow that also creates your repository.
  • Plasmic Studio hosting connection — documented steps connect the deployed app host back to Plasmic Studio.
  • Publish webhooks — optional Vercel deploy hook integration rebuilds the site whenever you publish from Plasmic.
  • Local development — npm install once, then npm run dev to run the server locally.
  • Live editing — the page auto-updates as you edit the project in Plasmic Studio.

Who is it for?

  • Marketers running A/B tests: serve different Plasmic page variants to different visitors without redeploying code per variant.
  • Teams with non-developers authoring pages: let designers and content editors publish pages via Plasmic Studio while developers keep the rendering layer.
  • Developers evaluating Plasmic: a minimal, working reference for wiring Plasmic content into an SSR app with middleware.

How does it work?

  1. Deploy with Vercel to host the app and create your repo, then note the public deployment link.
  2. Add your PLASMIC_PROJECT_ID and PLASMIC_TOKEN to plasmic-init.ts; the project ID is in the Studio URL and the public API token is under the Code toolbar button.
  3. Connect the app host in Plasmic Studio to your deployment link, and optionally add a Vercel deploy hook as a Publish webhook to rebuild on publish.

FAQ

Is the template ready to run without configuration?

Yes — the repo ships preconfigured with the demo project's projectId and token, so it deploys and renders immediately. You swap in your own Plasmic project ID and token when you want to use your own content.

Where do I find the Plasmic project ID and API token?

The project ID appears in the Studio URL, as studio.plasmic.app/projects/PROJECTID. The public API token is found by clicking the Code toolbar button in Plasmic Studio.

Does it support local development?

Yes. Run npm install once to install dependencies, then npm run dev to start the server locally.

Screenshot of Plasmic Split Content Template