How to show different collections using one collection template

How to show different collections using one collection template

mariannemca
New Member
9 0 0

I have a gift shop on shopify. In my main menu I have an 'Occasions' drop down and in the drop down there are 5 occasions - happy birthday, thanks, etc. Each page uses the same occasions template but should only pull in the gifts for the specific occasion. These are already set up in separate 'collections' like the Happy birthday collection. Is there a way of only using one collection template and pulling in collections to a page dynamically? The problem I have is every occasion page is showing the same collection from the template. 

Reply 1 (1)

LilyTaylor
Tourist
16 2 1

Hi @mariannemca,

 

You're right, it's inefficient to have separate templates for each occasion when they share a similar structure. Here's how you can use a single collection template to display different collections dynamically:

 

1. Use Liquid to Determine the Collection:

  • In your occasions.liquid template:

    {% assign current_collection_handle = page.handle %} 
    
    {% case current_collection_handle %}
      {% when 'happy-birthday' %}
        {% assign collection = collections.get('happy-birthday') %} 
      {% when 'thanks' %}
        {% assign collection = collections.get('thanks') %}
      {% when 'graduation' %}
        {% assign collection = collections.get('graduation') %}
      {% when 'anniversary' %}
        {% assign collection = collections.get('anniversary') %}
      {% when 'sympathy' %}
        {% assign collection = collections.get('sympathy') %}
      {% else %}
        {% assign collection = collections.all %} 
    {% endcase %}
    
    {% if collection %}
      <h2>{{ collection.title }}</h2> 
      {% for product in collection.products %}
        {% endfor %}
    {% endif %}
  • Explanation:

    • page.handle gets the handle of the current page (e.g., "happy-birthday").
    • The case statement checks the page.handle and assigns the corresponding collection object to the collection variable.
    • If no matching collection handle is found, it defaults to the all collection.
    • The code then loops through the products in the assigned collection and displays them.

2. Adjust Collection URLs:

  • In your navigation menu: Make sure the links in your "Occasions" dropdown point to the correct collection handles (e.g., /collections/happy-birthday).

3. Customize and Style:

  • You can further customize the template by adding filters, sorting options, and styling elements to the product loop.

By using this approach, you can effectively reuse a single template for all your occasion pages while dynamically displaying the products from the relevant collection.

 

Remember:

  • Always test your changes thoroughly before making them live on your store.
  • You can adjust this code to handle any number of occasions and collections.
  • Pro Tip: Tools like SEOPro can help you optimize your product pages and improve your store's overall search engine visibility.

I hope this helps!

Let me know if you have any further questions.

 

Lily

SEOPro Developer - If this reply was helpful, please let us know by liking it or accepting it as a solution

Need help with your Shopify Store SEO? Check out SEOPro - an app that helps Shopify store owners optimize products to boost SEO. If you have any question, feel free to reach out to us at support@seo-pro.app