Design Archives

How can I change the carousel layout to a simple list?

22. November 2018 Chris

Our default mobile-optimized carousel layout was built as a result of a series of tests with many users as it proved the best conversion rates and adoption among different layouts, devices and users.

In case you want to style the recommendations yourself we can also deliver a simple item list.
Therefore you just have to set the following two configurations:

1. Go to your domain in the Recolize Tool and in “Advanced Configuration” add the following CSS code:
```
.recolizeRecommendationContainer .recolizeCarousel {
    display: block;
}
```
2. The second step is to the add the following additional JavaScript code also on the domain configuration page:
```
Recolize.Recommendation.Design.Carousel.initialize = function (position, viewId, element) { return this; }
```

The result is a simple list that can then afterwards easily be styled via CSS as described in this FAQ article.

In case you want to modify the layout of the carousel please also see our FAQ article on how to change the number of items displayed.

> Read more

Can I show banners in the Recolize carousel instead of products?

24. October 2017 Michael

Yes, this is possible as Recolize works content-independent. So basically you can recommend products, articles, banners and anything else. You can also arbitrary combine these elements.

All you have to do is provide us an item feed that contains your banners and links. So you have to generate a CSV feed on your side that matches the specification that is described in our FAQ here.

In that CSV feed you just put your URLs for the images and the URLs for the links and a title (which can also be hidden in frontend via CSS) and you’re done. Now you can enter that generated feed url into our Recolize tool.

> Read more

Can I add ratings or other elements to my recommendations?

24. October 2017 Michael

Yes, of course. You can use our success callback to do so:

var RecolizeParameters = RecolizeParameters || {};<br />
RecolizeParameters.Api = RecolizeParameters.Api || {};<br />
RecolizeParameters.Api.successCallback = function(resultObject) {<br />
Recolize.Recommendation.Api.render(resultObject);<br />
/***** ADD YOUR CODE HERE *****/<br />
jQuery(".recolizePrice").append("</p>
<div class="rating-box"></div>
<p>");<br />
};

> Read more