skills.rest
WP-Coaching
WP-CoachingOFFICIAL
Explore all skills by this author →
WebsiteGitHub

payload-ecommerce

Configures the Payload CMS ecommerce plugin for products, carts, orders, and Stripe checkout flows.

Updated Sep 1, 2021
Search Tags:#next.js#stripe#react hooks#checkout#ecommerce#payload cms#shopping cart
One-click install
npx skills add https://github.com/WP-Coaching/pellegrims.coach --skill payload-ecommerce-wp-coaching
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: payload-ecommerce
Source: https://github.com/WP-Coaching/pellegrims.coach/tree/main/.agents/skills/payload-ecommerce
Command: npx skills add https://github.com/WP-Coaching/pellegrims.coach --skill payload-ecommerce-wp-coaching

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires @payloadcms/plugin-ecommerce.

What problem does it solve? Adding ecommerce to a Payload CMS project requires wiring up collections, payment adapters, and frontend hooks correctly, which is error-prone without guidance. This Skill provides the configuration patterns and React integration code needed to implement products, carts, orders, and Stripe payments in a Payload 3 application. ## Core Features & Use Cases - Plugin Configuration: Set up @payloadcms/plugin-ecommerce in payload.config.ts with payment adapters like Stripe and optional collection overrides. - Frontend Integration: Wrap a Next.js app with EcommerceProvider and use hooks like useCart, usePayments, useAddresses, and useCurrency for cart and checkout logic. - Collections Reference: Understand the auto-registered products, carts, orders, transactions, and customers collections, their fields, and default access control rules. - Use Case: A developer building a merchandise store on Payload CMS can configure the plugin with Stripe, add an Add to Cart button using useCart, and implement a checkout flow with initiatePayment and confirmOrder. ## Quick Start Ask the AI to configure the Payload ecommerce plugin with Stripe payments and scaffold a checkout flow using the EcommerceProvider and payment hooks.

Frequently Asked Questions about payload-ecommerce

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I add ecommerce to a Payload CMS project?▼

Install @payloadcms/plugin-ecommerce and register ecommercePlugin in payload.config.ts with a payment adapter such as stripeAdapter. The plugin automatically registers products, carts, orders, transactions, and customers collections with secure default access control.

How do I implement a checkout flow with the Payload ecommerce plugin?▼

Wrap your Next.js app in EcommerceProvider with a client payment adapter, then use the usePayments hook. Call initiatePayment to create a Stripe PaymentIntent, then confirmOrder to finalize the purchase and create the order record.

What hooks does the Payload ecommerce plugin provide for React?▼

The plugin exports useCart for cart management, usePayments for checkout, useAddresses for shipping and billing addresses, and useCurrency for currency formatting. All are imported from @payloadcms/plugin-ecommerce/client/react.

Does the Payload ecommerce plugin support Stripe payments?▼

Yes, it includes a Stripe adapter for both server and client. Configure stripeAdapter with your secret key in the plugin options and stripeAdapterClient with the publishable key in the EcommerceProvider.

Can I customize the ecommerce collections in Payload?▼

Yes, the plugin options let you override default collection slugs and configs, such as renaming products to merch. The collections still retain their core fields like price, items, total, and status.

What access control does the Payload ecommerce plugin apply by default?▼

Products are publicly readable with admin-only writes. Orders are readable by the owner or admin and cannot be created publicly, while carts are readable and writable only by their owner or an admin.

Related Skills

Explore More Software Engineering Skills→
gil00pitagil00pita

payload

Automate building a self-hosted, type-safe content backend for Next.js apps with Payload CMS.

Community
Intermediate
secondskysecondsky
204

payment-gateway-integration

Process secure payments and reconcile transactions across Stripe, PayPal, and Square in Node.js.

Community
Advanced
HieubkavHieubkav

laravel-medialibrary

Organize and serve media assets in Laravel using Spatie's Media Library.

Community
Advanced
fronticfrontic

shopify-headless-commerce

Manage Shopify carts, checkouts, and customer accounts via the Storefront API.

Official
Advanced