How to add a Custom property in Sitecore XC Entity – Part 2

This blog is in continuation of the previous blog. I write this blog with the below version of the Sitecore.

XP9.0.2
XC9.0.3

Since we are done with the creation of new property on the XC side, let’s import the same in XP to rendered on the website as well. Go back to the Sitecore experience platform’s content editor and from ribbon select Update Data templates.

Customize-property-xc_2_1

Once the update gets completed, verify that your template is generated under the

Template > Commerce > Catalog Generated > Components

Customize-property-xc_2_2

Now inherit the “Commerce Product” template of

Template > Commerce > Catalog

with your new one so that you can see your property in the catalog item of the content tree. Commerce Product template is responsible for displaying product property to the content tree.

Customize-property-xc_2_3

Note: In case if your property data is not displayed, then make sure that this sellable item corresponding entity version is published on the XC side.

Customize-property-xc_2_4

For the next, we have to extend the SXA rending to display this newly added entity on the pageCreate a new Feature project in your solution, for the purpose of simplicity I had only create a single project solution.

You would require below mention dependencies within your solution.

Sitecore project Dependencies

Now let’s perform coding for creating a new SXA component.

Create a model for the new product property –

Create the repository for fetching the data and binding –

Create a controller for binding with View –

Create a View for controller –

We have to create the initiator for dependency injections –

We do have to create the config file for the initiator as well –

Publish the code into your Sitecore instance, and gets let’s start setting up the rendering in Sitecore, I have created a new controller Rendering as below –

New Rendering for customization

Now make it available your rendering to commerce sxa tool in experience editor. First of all I had created a new container named Commerce Customization –

Customize-property-xc_2_6

Now add the controller rendering into the container –

Customize-property-xc_2_7

Now add open your product Item in Experience editor. The new container will be available in the toolbox drag and drop the rendering below to your Product details section. Save and Publish the page.

Open the page on the site, your new property will be available.

Older View

Customize-property-xc_2_8

New View –

New Product property

Find the solution to my GIT.

10950cookie-checkHow to add a Custom property in Sitecore XC Entity – Part 2

Add a Comment

Your email address will not be published. Required fields are marked *