Payload Website Template is a boilerplate that combines the Payload headless CMS with a Next.js App Router website, giving you a working blog, pages, authentication, and an admin panel out of the box.
What is the Payload Website Template?
The Payload Website Template is an official starter from the Payload CMS repository that bundles a pre-configured backend, an enterprise-grade admin panel, and a production-ready front-end website. It accepts content created in Payload's admin interface and renders it as a static or server-rendered site on Next.js, and it can be deployed to Vercel with a single click. The template is maintained by Payload CMS and is open source.
Key Features
- Layout Builder — Compose unique page layouts using pre-built blocks: Hero, Content, Media, Call To Action, and Archive.
- Draft Preview and Live Preview — Posts and pages are draft-enabled via Payload Versions, and live preview renders the page with server-side rendering while you edit.
- On-demand Revalidation — Hooks on collections and globals trigger Next.js revalidation so published changes appear without a full rebuild; after cropping an image you must republish the page using it.
- SEO Control — The official Payload SEO Plugin provides title, description, and social metadata fields directly in the admin panel.
- Search — The Payload Search Plugin is pre-configured to support server-side search in the Next.js front-end.
- Redirects — A built-in redirects collection lets you map old URLs to new ones so search engines and visitors get correct status codes.
- Scheduled Publishing — The jobs queue can publish or unpublish content on a schedule, executed by a cron task; on Vercel the cron frequency may be limited by your plan tier.
- Modern Front-end Stack — The site uses Next.js App Router, TypeScript, TailwindCSS, shadcn/ui components, React Hook Form, and includes dark mode, user accounts, and a fully featured blog.
Who should use the Payload Website Template?
- Developers — Build a custom website or content platform without writing a CMS from scratch, then extend the Payload config with new collections, fields, and plugins.
- Content teams — Publish blog posts and pages with a full editorial workflow featuring drafts, live preview, and scheduled publishing, all managed from the Payload admin.
- Agencies and niche publishers — Ship client websites or niche content sites that need a hosted admin panel, static or server-rendered front-end, and built-in SEO and redirect handling.
What can you do with the Payload Website Template?
- Launch a blog — Create a publication workflow where authors draft posts, reviewers preview them, and admins schedule them to go live.
- Build a portfolio — Use the Layout Builder blocks to assemble project pages, galleries, and call-to-action sections without custom code.
- Create a content publishing platform — Manage posts, categories, media, header, and footer from one admin, with search and redirects ready for growth.
How does the Payload Website Template work?
The setup flows are documented in the README. For local development, clone the repo, copy the example environment variables, install dependencies with pnpm install, and start the dev server with pnpm dev; the app runs at http://localhost:3000. For production, the one-click Vercel deploy connects a Neon Postgres database and Vercel Blob Storage, then prompts you to add three secrets: CRON_SECRET, PAYLOAD_SECRET, and PREVIEW_SECRET. After deployment, visit /admin to create an admin user and click "Seed the database" to populate example posts and pages.
Pros and cons
- Open source — The template is part of the Payload repository and licensed under MIT.
- One-click deploy — The Vercel button creates a GitHub repo, attaches services, and deploys the app automatically.
- Postgres migration requirement — In production you must create and run migrations for schema changes, because Postgres uses a strict schema.
- Destructive seeding — Running the seed script drops your current database and replaces it with the demo data, so it's only safe on a fresh project.
FAQ
Is the Payload Website Template free?
Yes, the template is open source under the MIT license and is maintained by the Payload CMS team.
What services does it need on Vercel?
It uses Neon Database for Postgres storage and Vercel Blob Storage for files such as images and videos. The connection variables are automatically set up when you connect those services.
Does it support draft and live preview?
Yes. All posts and pages are versioned with drafts enabled, so unpublished changes stay hidden until you publish. Live preview is also included, and it uses server-side rendering to display your edits in real time.
Can I use Docker for local development?
Yes, a docker-compose.yml file is included. Update the Postgres connection URL to point to localhost:54320, set the database name, and run docker-compose up.
Is the seed data destructive?
Yes, seeding drops your current database and populates a fresh one from the template. You should only run it when starting a new project or when you can afford to lose existing data.
