orcaqubits/sf-b2b-experience
dist/codex/salesforce-commerce/skills/sf-b2b-experience/SKILL.md
Build B2B Commerce storefronts with Experience Builder — LWR templates, page types (Home, Product, Category, Cart, Checkout), standard and custom components, theme layouts, navigation, SEO configuration, and site publishing. Use when assembling B2B/D2C storefronts.
$ install --global
skillsauthnpx skillsauth add orcaqubits/agentic-commerce-claude-plugins sf-b2b-experienceInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
Security Scan Results
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
3
Scanners Passed
9
Scanners in report
Clean
TrivyContainer and dependency vulnerability scanner
95%
Clean
SemgrepStatic code analysis for vulnerabilities
95%
Clean
mcp-scan (Snyk)Model Context Protocol security validation
95%
Skipped
Snyk (dep)Open source security scanning
50%
Skipped
Socket.devSupply chain security analysis
50%
Skipped
VirusTotalMulti-engine malware detection
50%
Skipped
CrowdStrikeAdvanced threat intelligence
50%
Skipped
OSV-ScannerOpen Source Vulnerability database check
50%
Skipped
OWASP Dep-Check
50%
Last scanned: May 14, 2026, 5:58 AM162.1s1 file scanned
SKILL.md
- name:
- sf-b2b-experience
- description:
- >
sf-b2b-experience
Build B2B Commerce storefronts using Salesforce Experience Builder (formerly Community Builder).
Before Writing Code
Fetch live docs BEFORE writing code:
-
Web-search the latest:
- "Salesforce Experience Builder documentation 2026"
- "Salesforce B2B Commerce storefront setup guide 2026"
- "Lightning Web Runtime LWR template 2026"
- "Salesforce Commerce standard components 2026"
- "Experience Builder SEO configuration 2026"
-
Web-fetch official sources:
developer.salesforce.com/docs/commerce/salesforce-commerce/guide/experience-builder.htmlhelp.salesforce.com/s/articleView?id=sf.b2b_comm_lightning_storefront_setup.htmdeveloper.salesforce.com/docs/platform/lwc/guide/lwr-get-started.html
-
Verify current LWR template structure, standard component catalog, page types, buyer group configuration, and SEO metadata options.
Conceptual Architecture
LWR vs Aura Comparison
| Feature | LWR (Modern) | Aura (Legacy) | |---------|--------------|---------------| | Performance | Faster, optimized rendering | Slower, heavier framework | | Standards | Web standards (ES modules, Shadow DOM) | Proprietary component model | | Components | LWC only | Aura + LWC | | SEO | Better server-side rendering | Limited | | PWA support | Progressive Web App capable | No | | Future | Active development | Maintenance mode |
Always use LWR templates for new B2B Commerce storefronts.
Page Types
| Page Type | Purpose | Key Components | |-----------|---------|---------------| | Home | Landing page | Hero banner, featured products, category nav, search | | Product Detail (PDP) | Single product view | Gallery, pricing, inventory, add-to-cart, variations | | Product List (PLP) | Category/search results | Product grid, filters, sorting, pagination, breadcrumbs | | Cart | Shopping cart | Line items, quantities, pricing summary, promo codes | | Checkout | Multi-step purchase flow | Shipping, delivery, payment, review, submit | | Order Confirmation | Post-purchase | Order number, details, shipping, continue shopping | | Search Results | Query results | Product matches, filters, sorting, suggestions | | Account Management | Customer self-service | Order history, addresses, payment methods, profile |
Template and Theme Structure
Theme Configuration
├── Company Settings (logo, favicon)
├── Color Palette (primary, secondary, text, bg)
├── Typography (headings, body, font families)
└── Custom CSS (advanced overrides)
Layout components: Header (logo, nav, search, cart, account), Footer (links, contact, social), Sidebar (filters, category tree), Grid System (responsive columns).
Responsive breakpoints: Desktop (1024px+), Tablet (768-1023px), Mobile (<768px). Component visibility can be configured per device type.
Buyer Groups and Entitlements
Buyer groups are collections of accounts that share product catalog visibility, pricing rules, entitlement policies, and payment terms.
| Concept | Description | |---------|-------------| | Product entitlements | Which products each buyer group can see | | Pricing rules | Group-specific pricing (negotiated, volume, contract) | | Payment terms | Net 30, Net 60, credit limits per group | | Guest browsing | Limited catalog, list prices only, no checkout (configurable) |
Use cases: VIP customers, regional buyers, partner tiers (Gold/Silver/Bronze), contract-based pricing.
SEO Considerations
| Element | Configuration |
|---------|--------------|
| Page title | <title> tag, 50-60 chars, set per page |
| Meta description | Search snippet, 150-160 chars |
| URL slug | User-friendly path (no random IDs) |
| Open Graph tags | Social media sharing metadata |
| Canonical URL | Prevent duplicate content |
| Structured data | Schema.org (Product, Breadcrumb, Organization) |
| Sitemap | Automatic XML generation; submit to Search Console |
Component Visibility Rules
Experience Builder supports conditional component visibility:
- Show/hide components per device type (desktop, tablet, mobile)
- Show/hide based on user authentication state (guest vs logged-in)
- Buyer group-specific component visibility
- Page-level access control (public vs authenticated)
Custom Components in Experience Builder
Custom LWC components are exposed to Experience Builder via js-meta.xml (see sf-b2b-lwc skill for development details):
- Set
isExposed: trueand targetlightningCommunity__Page/lightningCommunity__Default - Define configurable properties (String, Integer, Boolean) visible in the builder property panel
- Components appear in the Components panel for drag-and-drop placement
Site Publishing Workflow
| Stage | Description | |-------|-------------| | Draft | Build pages, add components, configure settings (not visible to visitors) | | Preview | Preview as different user types (guest, authenticated, buyer groups) | | Publish | One-click publish; changes go live immediately; version history for rollback | | Activate/Deactivate | Control site availability; set maintenance page when deactivated |
Best Practices
Component Strategy
- Use standard commerce components first (proven, maintained, optimized)
- Build custom components only for brand-specific or unique functionality
- Compose standard components creatively before building from scratch
User Experience
- Mobile-first design (many B2B buyers browse on mobile)
- Clear checkout flow with progress indication
- Intuitive category navigation and faceted search
- WCAG AA accessibility compliance
B2B Specific
- Respect buyer group entitlements for product visibility and pricing
- Support multi-user accounts (buyer, approver, admin roles)
- Enable bulk ordering (CSV upload, quick order forms)
- Provide reorder functionality from order history
- Display contract/negotiated pricing per account
Testing and Deployment
- Test with multiple buyer groups to verify entitlements and pricing
- Cross-browser testing (Chrome, Firefox, Safari, Edge)
- Build in sandbox, deploy via change sets or Metadata API
- Run Lighthouse and accessibility audits before go-live
Fetch Experience Builder docs, LWR template guide, and B2B Commerce setup documentation for exact page configuration, component catalog, and buyer group setup before implementing.
Related Skills
orcaqubits/spree-headless-storefront
development
VerifiedTrustedCommunity
Build with Spree's headless Next.js storefront — the official `spree/storefront` repo (Next.js 16 App Router with Server Actions and Turbopack, React 19 Server Components, Tailwind CSS 4, TypeScript 5, `@spree/sdk`, Sentry), server-only auth (httpOnly JWT cookies + publishable key), MeiliSearch faceted catalog, one-page checkout with Apple/Google Pay/Klarna/Affirm/SEPA, multi-region market routing, GA4 + JSON-LD SEO, and Vercel/Docker deployment. Use when forking or customizing the storefront, or evaluating headless adoption.
27SKILL.mdUpdated May 14, 2026
orcaqubits/spree-extensions
tools
VerifiedTrustedCommunity
Build Spree extensions as Rails engines — gem scaffolding, `bin/rails g spree:extension`, mounting routes/migrations/assets, the modern `prepend` decorator pattern (`*_decorator.rb` with `self.prepended(base)`), generators (`spree:model_decorator`, `spree:controller_decorator`), the four customization surfaces in preference order (Events > Webhooks > Dependencies > Decorators), Spree::Dependencies for swapping service objects, gem release/versioning, and the deprecated Deface engine. Use when building a reusable Spree extension or adding non-trivial customization to an app.
27SKILL.mdUpdated May 14, 2026
orcaqubits/spree-events-webhooks
development
VerifiedTrustedCommunity
Build with Spree's event bus and Webhooks 2.0 — `Spree::Events` publication, `Spree::Subscriber` DSL with `subscribes_to` and `on`, wildcard matching, lifecycle events (`{model}.created/.updated/.deleted` via `publishes_lifecycle_events`), the canonical event catalog (order.*, payment.*, shipment.*, product.*), Webhooks 2.0 endpoints, HMAC-SHA256 signing (`X-Spree-Webhook-Signature`), exponential-backoff retries, and Sidekiq job orchestration. Use when wiring event-driven business logic, building webhook consumers, or replacing ActiveSupport callback chains.
27SKILL.mdUpdated May 14, 2026
orcaqubits/spree-dev-patterns
tools
VerifiedTrustedCommunity
Cross-cutting Spree development patterns — the customization preference hierarchy (Events > Webhooks > Dependencies > Decorators), `Spree::Dependencies` service-object swapping, the `_decorator.rb` + `prepend` + `self.prepended` idiom, idempotent subscribers and webhook receivers, multi-store scoping discipline, prefixed IDs, calculator polymorphism (shipping/promotion/tax share the base), service-object composition with `dry-monads` or simple results, why to avoid `class_eval` reopening and Deface, and Spree-on-Rails idioms (Hotwire/Turbo Stimulus, ActiveStorage, Action Cable, Sidekiq). Use when designing the architecture of a Spree extension or solving cross-cutting concerns.
27SKILL.mdUpdated May 14, 2026