We have made extensive research and evaluated user feedback on what is the best format and style of the product recommendations. And the result was our product carousel that you get with Recolize out-of-the-box. So for the huge majority of cases we recommend our customers to use this carousel and the presented elements as it is.

In most of the cases it is not necessary to change the structure of the Recolize Carousel HTML. You can use the CSS pseudo classes ::before or ::after to nearly do anything you want without changing the structure.

Therefore we do not recommend to change the HTML structure.

If you really still want to change the structure, you can do this in our success callback:

var RecolizeParameters = RecolizeParameters || {};
RecolizeParameters.Api = RecolizeParameters.Api || {};
RecolizeParameters.Api.successCallback = function(resultObject) {
    for (var widgetPosition in resultObject.widgets) {
        // add your structure changes here in resultObject.widgets[widgetPosition].content[0] 
    }

    Recolize.Recommendation.Api.render(resultObject);
}
Is it possible to change the HTML structure of the Recolize Carousel