Magic code needed - get products with certain criteria - Product title / Collection id returned

Highlighted
New Member
32 0 0

I would like to insert some code into a section of a tab on my product page that gets products with the same title from 6 collections and displays them as small 150 x 150 px thumbs but excludes the current product from the results and displays the collection title under the image. 

Page is here and tab is more options for the results https://theworldreflected.com/collections/acrylic-prints/products/river-etive-falls-two?variant=2960...

 

A mock up is here 

 

IMG_0100.jpeg

 

I am using Parallax Theme and would really like for the title such as in this example 'River Etive Falls' to work because then the same would work for all other products and it would not require and taging or data entry. 

 

Oh the product thumbs would link to the products

 

Thanks

 

Below are the collections 

Product type - Print - Collection ID - 142462386248  

Product type - Framed Print - Collection ID - 142451212360

Product type - Acrylic Print - Collection ID - 142448197704

Product type - Metal Print- Collection ID - 142463467592

Product type - Wood Print - Collection ID - 142463565896

Product type - Limited Edition - Collection ID - 142991130696

 

Note , I can will remunerate 

0 Likes
New Member
32 0 0

Code to go here 

<div>
<p>This is where the other products go<br><br>
</p>
</div>

 

   <!--Start tab labels-->
        <ul class="tabs">
          <li>
            <a class="active" href="#tab1">
  				{% for collection in product.collections %}
   				{{ collection.title }}
 				 {% endfor %}
            </a>
          </li>
          <li>
            <a href="#tab2" class="">
              
                More Options
            </a>
          </li>
          <li>
            <a href="#tab3" class="">
              
            </a>
          </li>
        </ul>
        <!--Start tab content-->
        <ul class="tabs-content">
          <li class="active" id="tab1" style="display: block;">
            <div>
            <p>{{ product.description | split: '<!-- split -->' | first }}</p><p><span style="font-style: normal;">{% unless collection_handles contains 'coming-soon' %}</span></p><p>          {% include 'product-form' with 'product' %}</p><p>        {% endunless %}</p>
                    {% if section.settings.display_collections or section.settings.display_tags or section.settings.display_type %}
        {% endif %}

        <div class="meta">
          {% if section.settings.display_social_buttons %}
            {% include "social-buttons" with "product" %}
          {% endif %}

          {% if section.settings.display_collections %}
            <p>
              <span class="label">{{ 'products.product.collections' | t }}:</span>
              <span>
               {% for col in product.collections %}
                 <a href="{{ col.url }}" title="{{ col.title }}">{{ col.title }}</a>{% unless forloop.last %},{% endunless %}
               {% endfor %}
             </span>
           </p>
          {% endif %}

          {% if section.settings.display_tags %}
             <p>
               {% for tag in product.tags %}
                 {% if forloop.first %}
                   <span class="label">{{ 'products.product.tags' | t }}:</span>
                 {% endif %}

                 {% unless tag contains 'meta-' %}
                   <span>
                     <a href="/collections/{% if collection %}{{ collection.handle }}{% else %}all{% endif %}/{{ tag | handle }}" title="{{ 'products.product.products_tagged' | t: tag: tag }}">{{ tag }}</a>{% unless forloop.last %},{% endunless %}
                   </span>
                 {% endunless %}
               {% endfor %}
             </p>
          {% endif %}

         {% if section.settings.display_type %}
            <p>
              <span class="label">{{ 'products.product.product_types' | t }}:</span>
              <span>{{ product.type | link_to_type }}</span>
            </p>
         {% endif %}
        </div>
      </div>
            </div>
          </li>
          <li id="tab2" class="" style="display: none;">
            <div>
             <p>This is where the other products go<br><br>
            </p>
            </div>
          </li>
          <li id="tab3" class="" style="display: none;">
            <div>
            <p><br>
            </p>
            </div>
          </li>
        </ul>
    
        
0 Likes