Vendor Related Products

Highlighted
New Member
6 0 0

Hey everyone,

I'm looking to have a  "More products from this (vendor)" section on the product page.

For example:

If on a Honda Civic page I would like to have a related products section showing a Honda Accord, Honda Pilot and so on. I also need the current product to not show up in the related section. I have tried many codes on here without any luck of accomplishing this. Can anyone lend a helping hand?

0 Likes
Highlighted
Shopify Staff (Retired)
Shopify Staff (Retired)
5711 0 150

Hi Taylor!

This is the snippet you want (via the lovely Caroline) with an adjustment by me to eliminate the currently viewed product:

 

{% assign vendor = product.vendor %}
{% assign handle = product.handle %}
{% assign counter = '' %}
{% for product in collections.all.products %}
  {% if vendor == product.vendor and counter.size < 4 and handle != product.handle %}
  {% capture temp %}{{ counter }}*{% endcapture %}
  {% assign counter = temp %}
  <div class="recommendations_img">
    <a href="{{ product.url | within: collection }}" title="{{ product.title }}">
      <img src="{{ product.images.first | product_img_url: 'small' }}" alt="{{ product.title }}" />
    </a>		
  </div><!-- .recommendations_img -->
  {% endif %}	
{% endfor %}

Hope that helps!

 

http://shopifyplus.com ::: http://twitter.com/bacchus
0 Likes
Highlighted
New Member
6 0 0

This works great...thanks! I also need to add a header that would basically say "More From This Artist". I have added the header but for some reason it is repeating over each product instead of the just staying up top. 

Here is my code:

 

{% assign vendor = product.vendor %}
{% assign handle = product.handle %}
{% assign counter = '' %}
{% for product in collections.morefrom.products %}
  {% if vendor == product.vendor and counter.size < 3 and handle != product.handle %}
  {% capture temp %}{{ counter }}*{% endcapture %}
  {% assign counter = temp %}
<h2 class="light">YOU MIGHT ALSO LIKE</h2>
<p style="border-top:3px #000 solid; width:630px; padding-left:2px; margin-top:-8px;"></p>
  <div class="morefrom">
<a href="{{ product.url | within: collection }}">
<img src="{{ product.images.first | product_img_url: 'medium' }}" width="125" height="125" />
</a><h3 class="title">{{ product.title | truncate: 20 }}</h3><p style="text-align:center; padding:0; margin:0; font-size:13px;">{{ product.vendor | truncate: 22 }}<p align="center" style="margin-top:5px; margin-bottom:0px;"><span style="color:#900000; padding-top:5px;">{{ product.price | money }}
{% if product.price_varies %}
- {{ product.price_max | money }}
{% endif %}</p>
</div><!-- .recommendations_img -->
  {% endif %}	
{% endfor %}

 

 

 

0 Likes
Highlighted
Shopify Staff (Retired)
Shopify Staff (Retired)
5711 0 150

You're welcome Taylor!

re: repeats....You need to get the one off html out of the forloop and you should be good to go:

 

{% for product in collections.morefrom.products %}

 

 

http://shopifyplus.com ::: http://twitter.com/bacchus
0 Likes
Highlighted
New Member
6 0 0

I'm sorry Jamie can you explain further? Won't that leave the header when a product doesnt have any related products?

I'm looking to have the header "disappear" when a product has no related products.

Thanks for your help!

0 Likes
Highlighted
New Member
6 0 0

Actually I was able to produce this by putting the header in its own loop with a counter of 1. Thanks for your help!

0 Likes
Highlighted
Shopify Staff (Retired)
Shopify Staff (Retired)
5711 0 150

I'm sorry Jamie can you explain further? Won't that leave the header when a product doesnt have any related products?

It would I wrongly assumed that you would have one related product minimum.

Actually I was able to produce this by putting the header in its own loop with a counter of 1. Thanks for your help!

Great! For closure can you do me a favor and post your ammended snippet for others who find this thread?

Glad I could help!

http://shopifyplus.com ::: http://twitter.com/bacchus
0 Likes
Highlighted
New Member
6 0 0

Thanks again Jamie. My snippet is below:

 

 

{% assign vendor = product.vendor %}
{% assign handle = product.handle %}
{% assign counter = '' %}
{% for product in collections.morefrom.products %}
  {% if vendor == product.vendor and counter.size < 1 and handle != product.handle %}
  {% capture temp %}{{ counter }}*{% endcapture %}
  {% assign counter = temp %}
<h2 class="light">MORE FROM THIS ARTIST</h2>
<p style="border-top:3px #000 solid; width:630px; padding-left:2px; margin-top:-8px;"></p>
{% endif %}	
{% endfor %}


<div class="morefromcontainer">
{% assign vendor = product.vendor %}
{% assign handle = product.handle %}
{% assign counter = '' %}
{% for product in collections.morefrom.products %}
  {% if vendor == product.vendor and counter.size < 3 and handle != product.handle %}
  {% capture temp %}{{ counter }}*{% endcapture %}
  {% assign counter = temp %}

  <div class="morefrom">
    <a href="{{ product.url | within: collection }}"  title="{{ product.title }}">
      <img src="{{ product.images.first | product_img_url: 'medium' }}" width="125" height="125px" alt="{{ product.title }}" />
    </a><h3 class="title">{{ product.title | truncate: 20 }}</h3><p style="text-align:center; padding:0; margin:0; font-size:13px;">{{ product.vendor | truncate: 22 }}<p align="center" style="margin-top:5px; margin-bottom:0px;"><span style="color:#900000; padding-top:5px;">{{ product.price | money }}
{% if product.price_varies %}
- {{ product.price_max | money }}
{% endif %}</p>		
  </div><!-- .recommendations_img -->
  {% endif %}	
{% endfor %}
</div>

 

 

0 Likes
Highlighted
Shopify Partner
16 0 2
{% for product in collections.all.products %}

@Jamie This only selects 50 products. What if I have thousands of products in my store – and products with same vendor just don't get into the first 50?

Highlighted
New Member
1 0 0

This is currently the issue i'm facing too. Has anyone found a solution?

0 Likes