The Product Details Page (aka PDP) is usually one of the most important parts of a storefront. In my next video, I show how to customize it step by step using the upcoming 2.0 version of Spartacus.

Scroll down for video ↓

The idea for such a video came from some requests on the Spartacus public Slack channel. People new to Spartacus wanted to see how to customize PDP in Spartacus. So here it is. You can see how quick and easy it is to modify the default product view. I also explain some basics of how Spartacus works so that even people new to SAP Commerce can follow. Here’s a list of topics that I touch on in the video:

  • Configuring Component Mapping
  • What is Layout Configuration?
  • How CMS data comes from the backend
  • Using Current Product Service
  • Using built-in components of Spartacus

Please bear in mind that I’m using the upcoming Spartacus 2.0, which uses Angular 9. Therefore, I didn’t have to add my components to entryComponents.

In the video, I use Capybara Theme for Vue Storefront as a reference design. So you can consider it as a kind of ‘The making of Spartacus Capybara’. I’ll deep dive in this topic in my next post, so stay tuned ;)

Mateusz Ostafil

Spartacus Specialist at Divante eCommerce Software House | LinkedIn | Twitter

Share your comment