Your Cart is Empty
$52.20 $54.95 You Save 5% ($2.75)
{% if section.settings.show_product_recommendations %}
<div class="product-recommendations-container">
{% comment %} Check whether product has any tags for custom related products {% endcomment %}
{% for tag in product.tags %}
{% if tag contains 'meta-related-collection-' %}
{% assign related_collection_handle = tag | remove: 'meta-related-collection-' %}
{% endif %}
{% endfor %}
{% comment %} Max amount of products visible {% endcomment %}
{% assign limit = section.settings.recommended_products_limit %}
{% comment %} Amount of product per row {% endcomment %}
{% assign products_per_row = section.settings.products_per_row %}
{% assign skip_product = product %}
{% if related_collection_handle != blank %}
{% comment %} Show products based on merchant-added tags prepended with 'meta-related-collection-' {% endcomment %}
{% assign collection_size = collections[related_collection_handle].all_products_count %}
{% if collection_size > 0 %}
{% assign custom_collection = collections[related_collection_handle] %}
{% assign products = custom_collection.products %}
{% endif %}
{% if custom_collection and collection_size > 0 %}
{% assign show_custom_collection = true %}
{% endif %}
{% else %}
{% comment %} Shopify generated dynamic recommendations, falling back to default related products (based on parent collection) {% endcomment %}
{% assign dynamic_collection = recommendations %}
{% assign products = recommendations.products %}
{% assign show_dynamic_collection = true %}
{% endif %}
{% comment %} HTML markup {% endcomment %}
{% capture product_collections_markup %}
<div class="recommended-products__title {% unless section.settings.product_recommendations_style == 'slider' %}sixteen columns{% endunless %}" data-recommended-product-count="{% if show_dynamic_collection == true %}{{ recommendations.products_count }}{% else %}{{ collection_size }}{% endif %}">
<h4 class="title center">{{ section.settings.product_recommendations_heading }}</h4>
<div class="feature_divider"></div>
</div>
<div class="clear"></div>
{% if section.settings.product_recommendations_style == 'slider' %}
{% comment %} Recommended Products Slider {% endcomment %}
<div class="recommended-products--slider js-recommended-products-slider">
{% include 'product-slider', limit:limit, per_slide:products_per_row %}
</div>
{% else %}
{% comment %} Recommended Products Grid {% endcomment %}
<div class="container recommended-products--grid">
<div class="sixteen columns equal-columns--outside-trim">
{% include 'product-loop' %}
</div>
</div>
{% endif %}
{% endcapture %}
{% if show_custom_collection %}
<div class="meta-related-recommended-collection" data-enabled="{{ section.settings.show_product_recommendations }}">
{{ product_collections_markup }}
</div>
{% elsif show_dynamic_collection %}
<div class="product-recommendations" data-product-id="{{ product.id }}" data-limit="{{ limit }}" data-enabled="{{ section.settings.show_product_recommendations }}">
{{ product_collections_markup }}
</div>
{% endif %}
</div>
{% endif %}
{% schema %}
{
"name": "Recommended products",
"class": "recommended-products-section",
"settings": [
{
"type": "header",
"content": "Product recommendations"
},
{
"type":"paragraph",
"content": "The settings configured in this section will remain consistent across all product templates. If using the product.details template, adding the Recommended Products content block is also required. [Learn more](https://help.outofthesandbox.com/hc/en-us/articles/360034424013)"
},
{
"type": "checkbox",
"id": "show_product_recommendations",
"label": "Show dynamic recommendations",
"info": "Dynamic recommendations change and improve with time. [Learn more](https://help.shopify.com/en/themes/development/recommended-products)",
"default": true
},
{
"type": "radio",
"id": "product_recommendations_style",
"label": "Layout",
"default": "grid",
"options": [
{
"value": "slider",
"label": "Slider"
},
{
"value": "grid",
"label": "Grid"
}
]
},
{
"type": "text",
"id": "product_recommendations_heading",
"label": "Heading",
"default": "You may also like"
},
{
"type": "range",
"id": "products_per_row",
"label": "Products per row",
"min": 2,
"max": 5,
"step": 1,
"default": 3
},
{
"type": "range",
"id": "recommended_products_limit",
"label": "Limit products",
"min": 2,
"max": 10,
"step": 1,
"default": 4
}
]
}
{% endschema %}