| name | payloadcms-ecommerce-3-82-1 |
| description | Payload CMS ecommerce template providing production-ready online store with products, variants, carts, orders, Stripe payments, and user accounts. Use when building e-commerce platforms, online stores, or any digital commerce project requiring product catalogs, shopping carts, order management, payment processing, or inventory management following official Payload best practices. |
| license | MIT |
| author | Tangled <noreply@tangledgroup.com> |
| version | 0.1.0 |
| tags | ["payloadcms","ecommerce","commerce","stripe","payments","nextjs","headless-cms"] |
| category | cms-template |
| external_references | ["https://payloadcms.com/docs/ecommerce/plugin","https://github.com/payloadcms/payload/tree/v3.82.1/templates/ecommerce"] |
Payload CMS Ecommerce Template v3.82.1
Overview
The official Payload Ecommerce Template is a production-ready, full-stack ecommerce solution built on Payload CMS v3 with Next.js App Router. It provides a complete online store with a working backend, enterprise-grade admin panel, and a beautifully designed frontend — all in a single deployable application.
The template uses the @payloadcms/plugin-ecommerce package to provide collections for products, variants, carts, orders, transactions, and addresses. Stripe is the default payment adapter. The frontend is built with Next.js 16, Tailwind CSS 4, shadcn/ui components, and React Hook Form.
When to Use
- Building a new ecommerce platform or online store from scratch
- Creating marketplaces with product catalogs and shopping carts
- Implementing payment processing with Stripe in a Payload project
- Setting up guest checkout flows with secure order access
- Building stores that need multi-currency support
- Adding ecommerce functionality to an existing Payload CMS site
- Prototyping commerce features rapidly with a production-ready foundation
Quick Start
Create the project using the Payload CLI:
pnpx create-payload-app my-project -t ecommerce
Then set up locally:
cd my-project
cp .env.example .env
pnpm install && pnpm dev
Open http://localhost:3000 and follow on-screen instructions to create the first admin user.
Required Environment Variables
PAYLOAD_SECRET — Application secret for signing JWTsDATABASE_URL — MongoDB connection string (default adapter)STRIPE_SECRET_KEY — Stripe secret API keyNEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY — Stripe publishable keySTRIPE_WEBHOOKS_SIGNING_SECRET — Stripe webhook signing secretPAYLOAD_PUBLIC_SERVER_URL — Server URL for PayloadNEXT_PUBLIC_SERVER_URL — Server URL for the frontendPREVIEW_SECRET — Secret for draft preview authentication
Core Architecture
The template follows a unified monorepo structure where Payload backend and Next.js frontend share a single instance:
