Also Bought Products¶
This Module keeps a running count of products purchased together and provides a template layer to display the results at a product level.
Installation¶
- Install the
Also Bought Products
Module on your store - Set up the
pdsalsobought
Item ( if applicable )- Assign item to desired pages
Template¶
You may need to configure the Also Bought Product List Layout
template and settings.
- Configure the
Also Bought Product List Layout
settings - Update the
Also Bought Product List Layout
template using this template code.
<div class="g-layout">
<div class="g-layout__item">
<h2 class="g-type-title-2 u-text-center">Customers Also Bought</h2>
</div>
</div>
<div class="js-carousel g-carousel u-mt-m lazyload" data-options="">
<div class="g-carousel__arrows">
<button type="button" class="g-carousel__arrow--prev">
<span class="splide__arrow--icon u-icon-chevron-left"></span>
</button>
<button type="button" class="g-carousel__arrow--next">
<span class="splide__arrow--icon u-icon-chevron-right"></span>
</button>
</div>
<div class="g-carousel__track">
<div class="g-carousel__slides">
<mvt:assign name="l.product" value="l.settings:product" />
<mvt:do file="g.Module_Feature_TUI_DB" name="l.loaded" value="ManagedTemplate_Load_ID( g.readytheme_templates:product_card_iterator:templ_id, l.loaded_paged )" />
<mvt:foreach iterator="product" array="pdsalsobought:products">
<mvt:comment>
|
| Product Card Template
|
</mvt:comment>
<div class="g-carousel__slide">
<mvt:do file="g.Store_Template_Path $ l.loaded_paged:filename" name="l.success" value="Template_Render( l.empty, l.settings )" />
</div>
</mvt:foreach>
<mvt:assign name="l.settings:product" value="l.product" />
</div>
</div>
</div>
- Render
Also Bought Product List Layout
template with the below code<mvt:if expr="l.settings:pdsalsobought_product_count"> <mvt:item name="pdsalsobought" /> </mvt:if>