Back to the blog
  • Jun 29, 2021
  • --
Category Tech
Headless Commerce with Salesforce 656x400
Headless Commerce with Salesforce Commerce Cloud

Headless Commerce with Salesforce Commerce Cloud

You're looking to create the next generation of your online shop. Or you are about to launch your first serious e-commerce initiative. Is it time for you to make the jump to headless commerce? What are the tools and trade-offs to consider?

Headless commerce

Let me give a quick recap of headless commerce and how headless commerce works.

"Head" refers to the customer experience, the online storefront, be it a native mobile app, a mobile PWA, or a website. Front ends can also include an Alexa app, in-store displays, and even social channels.

So, a “head”-less commerce system does not provide its own front end. Instead it has REST APIs to connect to the front ends.

The commerce system still manages all catalogs, product information, SKUs, prices and possibly carts, order processing and POS.

The key benefits are:

  • Omnichannel customer experience: You want all of your channels to connect to one commerce system. Both because it's more straightforward for you to manage, and because it enables you to give your customers a unified and seamless experience across channels.


  • Headless commerce without limits: You want to choose your front-end storefront without being limited by what comes with the commerce system. An important motivation for choosing the headless commerce approach is giving developers the freedom to work with technologies that they know and like. 


  • You can better optimize your storefronts for performance, i.e. page load time. This has a strong and direct impact on conversion. To improve site performance, check out Jamstack, for example.


  • Limitless authoring: As a marketer you get to build shopping experiences with full WYSIWYG editing, scheduled publication, and multi-device preview. Magnolia’s content authoring tools include a visual editor, that you can use in a headless approach.

Great headless commerce

Now that we've summarized headless commerce, what does it take to make a truly great customer experience?

A basic online storefront is a huge first step to enable customers to find and purchase your products. But you can do so much better than that. :)

Magnolia ecommerce Integration

Learn why Magnolia is the perfect content platform for ecommerce

Content Commerce

You know your products, and you know your customers. So get in there and help them shop.

Content Commerce, or Content Marketing is the practice of using content to generate awareness and bring traffic to your shopping experiences. (Kind of like this blog post.) It's also about both nurturing and leveraging your brand in your experiences, for example, with great visuals and stories. And it's a tool for creating engaging curated experiences: you can have a story which links to some of your products, or simply hand-craft your category pages.

Here's a good example: Au Lit Fine Linens blog posts promote their products.


Even a typical online storefront can mix category pages or landing pages with curated content.


Headless content management and the headless commerce trinity

An ecommerce headless CMS is also "a thing" - with just the same motivations, benefits and concepts as headless commerce. In the case of the CMS the focus is not products necessarily, but any kind of content from landing pages, campaign banners, stories, blog posts, press releases, job offerings, events, brick-and-mortar store information, and all types of reusable content fragments.

The blueprint for a great headless commerce initiative are these three systems:

  • Headless commerce system

  • Headless CMS

  • Front end 

Create engaging PWA experiences by combining marketing content from Magnolia and products from SFCC. Create engaging PWA experiences by combining marketing content from Magnolia and products from SFCC.

One decision to make is which system "owns the experience" or "owns the glass". The front end delivers the experience to your customers’ screens, but it doesn’t necessarily control the experience.

In a tech-centric company with many developers on staff you may indeed want the front end to control the experience. Think Netflix or Spotify. The front end might be a bespoke, highly optimized native mobile app. To update the experience, marketers and UX engineers would need to collaborate with developers.

But in general, businesses want to empower their marketing staff to manage the experience without needing developers for every update. In this case a headless CMS is the most appropriate tool. Marketers can create campaigns and mix editorial content with product information from the headless commerce system.

Is it worth it?

If you are used to working with an end-to-end storefront system like Shopify, the headless commerce approach might sound a little complicated. And to be perfectly frank, it is more complex. So I would not recommend it to a mom&pop shop. It isn't the right setup for a neighborhood restaurant, but it is for a franchise with 50 restaurants.

The downside of the headless commerce approach is that it generally takes more work. The upside is that it scales with you, giving you the opportunity to grow in the direction that makes sense for your business, rather than being limited by the constraints of an end-to-end storefront system.

Learn more about integrating your cms and your commerce system.

Headless with Salesforce Commerce Cloud

Salesforce has a very robust and deep e-commerce system, offering features for mid-market to enterprise requirements. And a wealth of APIs to match. While their existing APIs are comprehensive and powerful, they have also rolled out a new breed of cutting-edge modern APIs following their recent acquisition of top-rated API platform Mulesoft. Their wealth of APIs means it can take a little longer to onboard, but it's worth it. Salesforce Commerce Cloud (SFCC) covers every use case including valuable search and discovery capabilities.

Another recent Salesforce acquisition is the well-known PWA service Mobify, which was rebranded as PWA Kit and Managed Runtime. It fleshes out their headless commerce offering, by giving you an out-of-the-box PWA platform so you can hit the ground running. But it's optional, so you still have the flexibility to choose your own PWA platform or other front-end delivery systems.

The headless Salesforce + Magnolia solution

The Magnolia headless CMS is a great match for headless commerce with Salesforce, especially with their new PWA Kit or another PWA or SPA.

Magnolia brings an amazing headless authoring experience for marketers and retailers. While typical headless CMS sadly only provide rigid form-based editing, Magnolia offers full visual WYSIWYG editing which is intuitive for users and provides a live high-fidelity preview.


With Magnolia, marketers and other business users own the experience. They have the tools and creative freedom to actually do their job, without any obstacles and without needing technical assistance to make changes. This means that your team can stay ahead of the curve and update your sites daily instead of monthly. It also frees developers to work on new features, rather than just maintaining the front end.

With the SFCC integration, marketers can now browse catalogs and products and instantly add them to their pages along with other editorial content.

“I’m proud to welcome Magnolia as a launch partner of our new Headless Commerce for B2C collection in the Salesforce App Exchange.” said Igor Faletski, VP Product, Salesforce Commerce Cloud. “They have more than demonstrated how innovative and agile their solution is. And they are simply fun to work with. And they are simply fun to work with. Salesforce Commerce Cloud plus a commerce cloud CMS like Magnolia is a huge win for marketing and merchandising teams going for first-class customer experiences.”

To learn more, check out our listing on the Salesforce AppExchange.

Integrating Salesforce Commerce Cloud with Magnolia

Magnolia is a headless CMS - but it's also a composable DXP. Besides offering enterprise features like personalization, multisite content reuse, A/B/n testing, and translation support, we pride ourselves to be integration-first. This means we have a dedicated API for each key connector type: e-commerce, marketing automation, analytics and DAM. And dedicated connectors for the most popular enterprise systems in these categories, like Salesforce Commerce Cloud, and Salesforce Marketing Automation too. All are available on our Marketplace.

Sounds interesting? Learn more or get a demo.

About the Author

Christopher Zimmermann Product Manager at Magnolia

Christopher is a product manager at Magnolia with an emphasis on developer experience & productivity. He helped introduce the ‘light development’ paradigm and is now focused on headless, hybrid headless and making integrations easier to implement. While trained in Physics in university, the buzz and wild west openness of software development drew him to a career as a programmer in product companies, creative web agencies, freelancing and startups. Christopher is an outdoors enthusiast who got started with backcountry camping in the USA, but is slowly getting the hang of finding a coffee and cake in a rustic hut at 3000+ meters altitude in the Swiss Alps.

Read more