Salesforce Commerce Cloud (SFCC) is a cloud-based e-commerce platform to manage and scale B2C and B2B commerce operations across web, mobile, and social channels. It offers capabilities for storefront management, personalization, and headless commerce through API-first design. SFCC is part of the broader Salesforce Customer Success Platform for seamless integration with CRM, marketing automation, and service tools.
Commerce Cloud for B2C, B2B, and Marketplaces
Salesforce Commerce Cloud allows businesses to run B2C, B2B, and marketplace operations on one central platform. All site configurations, product catalogs, inventory rules, and pricing logic are managed through Business Manager. Whenever you update something like a price or product detail, it syncs across channels in real-time using OCAPI (Open Commerce API) and SCAPI (Shop API).
Key Features of Salesforce Commerce Cloud
Unified Commerce Operations Across Models
Salesforce Commerce Cloud centralizes B2C, B2B, and marketplace operations on a combined platform. Business Manager controls catalog hierarchies, pricing rules, and inventory distribution across storefronts. Every modification triggers real-time sync via the OCAPI and SCAPI layers for consistency across channels.
Rendering Modes: Monolithic, Headless, and Hybrid
SFCC gives developers flexibility in how they render storefronts. It supports server-side templates, headless storefronts using React, and hybrid rendering for better performance and SEO.
SFRA (Storefront Reference Architecture)
A traditional server-side architecture using ISML (Interactive Script Markup Language) and controllers. Ideal for teams who want monolithic control over layout and business logic.
<isif condition="${pdict.renderClientSideWidget}"><div id="rec-video-banner" data-user-id="${pdict.userId}"></div><script>window.addEventListener('DOMContentLoaded', () => {new PersonalizedVideo('#rec-video-banner');});</script></isif>Headless with PWA Kit
The PWA Kit allows building headless storefronts using React and communicates with SFCC via SCAPI and OCAPI.
npx pwa-kit-create-appAfter scaffolding, configure environment variables and deploy to Node.js or Heroku environments. Headless deployment improves frontend flexibility and performance.
Hybrid Rendering
Hybrid mode combines SSR (Server-Side Rendering) and CSR (Client-Side Rendering). Product metadata is server-rendered, while dynamic features (e.g., carousels, video banners) load on the client. This offers SEO benefits with interactivity.
Example: Hybrid component rendering in SFRA
<isif condition="${pdict.renderClientSideWidget}"><div id="rec-video-banner" data-user-id="${pdict.userId}"></div><script>window.addEventListener('DOMContentLoaded', () => {new PersonalizedVideo('#rec-video-banner');});</script></isif>Explanation:
- Injects a div with the ID rec-video-banner and binds the current user's ID via the data-user-id attribute.
- Uses client-side JavaScript to instantiate a PersonalizedVideo component after the DOM fully loads.
AI-Powered Personalization via Einstein Commerce
Salesforce Einstein provides machine learning–driven personalization based on real-time user behavior, such as browsing and video engagement, product search terms, and purchase history. Einstein tailors recommendations, search results, and even personalized banners. It uses DAM (Digital Asset Management) to serve segmented content, including personalized video banners triggered during exit-intent or cart abandonment.
Multi-Site Orchestration and Localization
SFCC supports multiple storefronts across regions with centralized control. Localization includes currency and tax formatting, language and content variations, and localized media and video.
Example: Region-specific tax calculation via SCAPI
POST /checkout/tax{"items": [{"sku": "VID-HD-BUNDLE-001","quantity": 1,"price": 29.99}],"location": {"country": "US","postalCode": "94105"}}Explanation:
- Calls the SCAPI /checkout/tax endpoint and estimates geo-specific tax based on SKU and location input.
- Supports bundled media SKUs, ensuring compliance for mixed physical + digital orders.
Video Commerce and Media Integration
Video commerce is essential in verticals like industrial tools, medical devices, and electronics, where visual demonstration drives conversion. SFCC supports:
Video Rendering
Salesforce Commerce Cloud includes built-in support for video-based shopping experiences. Products can be linked to video timestamps so users can click on interactive hotspots within videos. Here’s an example of a conditional video component in ISML:
<isif condition="${pdict.videos.length > 0}"><video-playersrc="${pdict.videos[0].url}"data-product-id="${pdict.product.id}"lazy-load="true"></video-player></isif>Interaction Tracking
Videos are stored on Salesforce’s CDN, which automatically adjusts resolution and format based on the device. Pre-roll advertisements can be added dynamically by calling external ad servers.
Video + Einstein Personalization
Einstein analyzes video engagement data to optimize product recommendations, dynamic sort order of listings, and cross-sell and upsell suggestions.
B2B and B2C Experience Customization
Salesforce Commerce Cloud supports both consumer and business storefronts with tailored experiences.
B2C Commerce
Merchandisers use Business Manager to update catalogs, pricing, and promotions. For example, they can schedule a homepage banner that includes a YouTube video to go live during a holiday campaign, no code required.
B2B Commerce
B2B buyers authenticate with business accounts and get access to contract-based pricing, custom catalogs, and role-specific product videos.
<!-- CMS: Role-based video embed --><video slot="productDemo"data-role="procurement_manager"src="{!v.videoAssetUrl}"controls></video>Deployment, Cartridges, and DevOps
Development in SFCC is cartridge-based. A cartridge is a modular unit containing ISML templates, JavaScript, and SCAPI endpoints.
Developers use private sandboxes for development.
Changes are version-controlled and promoted to staging/production.
CI/CD can be done using Salesforce tools, GitHub Actions, or Jenkins.
# Example GitHub Action for cartridge deploymentnpm run buildsfcc-ci code:deploy <cartridge-name> --instance <hostname>Salesforce manages infrastructure tasks like auto-scaling, SSL, and updates. Developers can focus on feature development and experience optimization.