Creating a Custom Review Process for Episerver E-Commerce

March 7, 2016
by

During a major e-commerce project, the client requested functionality for its users to be able to write product reviews. This seemed like a normal request and standard process for any e-commerce site.Despite building in a way to add reviews to products, Episerver’s e-commerce system removed the implementation due to the use of 3rd party tools. For this project, this was not an option for our team.

Development

I recently had an opportunity to work on a major e-commerce project. During the project, the client requested functionality for its users to be able to write product reviews. This seemed like a normal request and a standard process for any e-commerce site.

Despite building in a way to add reviews to products, Episerver’s e-commerce system removed the implementation due to the use of third-party tools. For this particular project, this was not an option for our team.

So, I started looking at different implementation options for building the review process from scratch. By collaborating with my coworker, Brian Oliver, we came up with a plan based on creating pages as reviews and using a custom admin section where the client’s team would be able to moderate these reviews.

We started down this path before quickly realizing the strain the architecture put on the site would be too great, ultimately causing slowdowns on product page loads.

After research and recommendations from our team lead, Jon Price, we set out to create a custom navigation pane for iContent. The idea was to create reviews as iContent and display them under the product in their own folder, just like site assets. Without getting too technical, this would be connecting into Episerver’s built-in display and showing the reviews under each product in the admin section.

This was not as simple as copying and pasting the code. We used the built-in Episerver functionality to modify the custom pane to show what we wanted. Reviews were housed in their own folders under each product, mimicking how we were going to display them on the site:

Screen grab: tasks ready to publish
Screen grab: modifying the custom pane in Episerver

After this approach was implemented, we could create a review and associate the review with the appropriate product. Now, we had to address how best to implement the process of moderating reviews.

By saving the reviews as “ready to publish,” this made it so the client’s team would be able to see pending reviews in a list for approval. Using Episerver’s built-in task pane, we can filter different options, like “ready to publish.” This can be used for approval chains for any piece of content:

Screen grab: tasks ready to publish

However, the saving of reviews had been coded to publish right away, which didn’t work for our moderation process.

Screen grab: attempting to save reviews

With the help of the Episerver community, it turned out to be a simple answer. By implementing the IVersionable class on our custom review object, the reviews began to show in an unpublished state, allowing the client to moderate each review from one single pane.

The client requested that we display the reviews on an account reviews page by internal user. This was so each user could see, delete, or edit reviews. Initially, we planned to loop over each product, pull all the reviews, and then filter by email. We quickly realized this was not an option due to the processing time that it would take. We could, however, pull the reviews based on a product because of the asset folder association that we already built.

We tried to modify the code to pull from the SiteDefinition.Current.GlobalAssetsRoot to pull all assets and then filter on user email. That’s when another coworker, Jacob Pilkinton, came up with a solution. By modifying the code to load reviews based on contentUsage.contentlink, we were able to establish a moderation process that functioned exactly how the client needed it:

I have always believed that anything is possible with software, it just takes time, motivation, and will. This portion of the project was a challenge, but as a team, we collaborated to overcome it and find a solution that worked for the client.

What separates us from other Episerver partners? We're glad you asked.