Developer Considerations for Product Recommendations

To implement product recommendations, you must modify ISML templates to:

When defining content slots for product recommendations, make sure you give the slot a unique ID. Also, set the context to global. Finally, if this content slot is used to render recommendations on a product detail page or a category-landing page—include a reference to the referring product’s (or category's) ID as part of the context-object attribute.

You can also pass the context-object attribute a basket or dw.util.Collection of products. This lets you create and use recommendations based on specifically selected products (up to 5), or all of the products in the basket.

The following example <islot> tag shows how to define a slot to be used on a product detail page:

<isslot id="myslotid" context="global" context-object="${pdict.Product}"/>

This next example shows how to define a slot to be used on a category landing page:

<isslot id="cat-banner" context="category" context-object="${pdict.ProductSearchResult.category}" />

When you have defined content slots on your storefront, the next step is to create a page template to render the recommended products. You might already have a template that renders other types product content slots. Such templates can be reused with just a little modification. If you do have a template that can be reused, copy it to the following folder.

/templates/default/slots/recommendation/

The following example is of a product template that can be used to show product recommendations:

<iscontent type="text/html" charset="UTF-8" compact="true"/>
<iscomment> should not be cached, the tiles are cached individually.</iscomment>

<isif condition="${slotcontent}">
<div class="product-listing product-listing-1x4">
        <h2>${slotcontent.calloutMsg}</h2>

        <ul class="search-result-items tiles-container">
                <isloop items="${slotcontent.content}" var="product" begin="0" end="3">
                        <isobject object="${product}" view="recommendation">
                                <li class="grid-tile">
                                        <isinclude url="${URLUtils.url('Product-HitTile',
                                                'pid', product.ID,
                                                'showswatches', 'true',
                                                'showpricing', 'true',
                                                'showpromotion', 'true',
                                                'showrating', 'true')}"/>
                                </li>
                        </isobject>
                </isloop>
        </ul>

</div>
</isif>

When developing slot-rendering templates for product recommendations, make sure that caching of slot content is performed properly. Because of the dynamic nature of product recommendations, make sure that the entire slot isn't cached; otherwise, every visitor experiences the same recommendations. Ensure caching occurs when rendering individual product tiles instead of the entire template.