All cookies accepted? Start exploring!
We use cookies to give you the best experience and to analyse how you use our website, these cookies are necessary for our website to function and cannot be switched off in our systems. We call these essential cookies as they are used to ensure site security and to provide core functionality. Without this type of technology, our website won't work properly. We also allow third parties to use tracking technologies for similar purposes. These cookies are used by social media services to enable you to share our content with your friends and networks.

Share In a previous article, I’ve illustrated how we created the core functionality for using product data with promotional content. In this article, I’ll show how we used this core functionality to create a client specific implementation.

We successfully implemented the core banner functionality provided by Mercury for one of our clients on multiple levels.

First, we identified the various product banners that were needed and then implemented functionality to create and maintain these banners within the client solution. I will not go into detail about which banner types were identified. A simple banner type is used as an example to show how easy it is to create and place a new product banner on a site’s homepage using the default content editor tool in Sitecore, the Experience Editor.

We start by adding a new component to the homepage. This shows the available placeholders where a new component can be added.


Next, we need to select a rendering to add to the page. In this example, we’ll add a simple price banner.

Once the rendering has been added to the page, we can either select an existing banner (or data source in Sitecore terminology) or create a new one. In this case, we’ll opt to create a new banner. A new popup is displayed to select the banner type we want to use, as shown in this simple demo.


Although the data source item and the rendering have been created, we still need to add an image and product details to the data source. For this purpose, we’ve created an additional Experience Editor button so the content editor can quickly edit the banner properties. Clicking this button will show the banner properties available for editing.



As you can see, for this banner type we can edit the image to be displayed, we can add a pre-defined header (price signal), which is shown at the top of the banner when selected, and we can add a product ID. In this case, I have selected a responsive couch image to display but have not selected a price signal.

I have also entered the corresponding ID of the product. By using the product ID, the price block knows which data to return: the product name, the price and the URL for displaying the product detail page for this specific item.

After saving and publishing the page, the result will look like this.

Please note that the component could use output caching for performance reasons. The actual price displayed might therefore be different.

Related articles

Articles related to this topic

Share a Tweet
Nice article on how Kwantum uses product banners with @sitecoremercury in their Sitecore platform #SITECORE # PRODUCTBANNERS # EXPERIENCE  Share
See how one of Hollands largest furnishers uses dynamic product banners in Sitecore to create a richer customer experience #SITECORE # PRODUCTBANNERS # EXPERIENCE  Share