View All button on featured collections directs to default collection

[FunTakers]

Hi there, 

I have been trying to fix this for several hours to no avail, lol. 

Site: www.funtakers.com 

So, all of my collections are separated by category (i.e; tees, bottoms, etc) and have associated tags and all products are manually associated with their correct collection. For example, when I select my shirts collection I have the maximum (25) products listed. However, if customers wish to view all of the tees in the collection they would select the "View All" button as seen in the attached snippet. However, this redirects customers to the "Default Collection" which is apparently assigned to 5 collections. This Default Collection is not needed and is redundant as each collection is already separated accordingly. There are no URL redirects and my code seems in order. This issue is persistent across multiple collections (another example: Stickers page)

I haven't had any luck trying to redirect the button correctly so all products in the featured collection can be viewed and I'd appreciate any help! 

Here is the snippet from my sections/featured-collection:

{%- if section.settings.show_view_all and more_in_collection -%}
  <div class="center collection__view-all">
    <a
      href="/collections/{{ section.settings.collection.title }}?view=all"
      class="{% if section.settings.view_all_style == 'link' %}link underlined-link{% elsif section.settings.view_all_style == 'solid' %}button{% else %}button button--secondary{% endif %}"
      aria-label="{{ 'sections.featured_collection.view_all_label' | t: collection_name: section.settings.collection.title }}"
    >
      {{ 'sections.featured_collection.view_all' | t }} {{ collections[section.settings.collection].title }}
    </a>
  </div>

      "type": "checkbox",
      "id": "show_view_all",
      "default": true,
      "label": "t:sections.featured-collection.settings.show_view_all.label"
    },
    {
      "type": "select",
      "id": "view_all_style",
      "label": "t:sections.featured-collection.settings.view_all_style.label",
      "options": [
        {
          "value": "link",
          "label": "t:sections.featured-collection.settings.view_all_style.options__1.label"
        },
        {
          "value": "outline",
          "label": "t:sections.featured-collection.settings.view_all_style.options__2.label"
        },
        {
          "value": "solid",
          "label": "t:sections.featured-collection.settings.view_all_style.options__3.label"
        }
      ],

Thanks for your help, I'll be heading to sleep now and will check-in later on! ❤️

[rajweb]

Hey @FunTakers ,

It looks like the issue lies in the href of the "View All" button. The URL being generated by your current code uses {{ section.settings.collection.title }} to pull the collection title, which may not match the exact URL structure of your collections.

It looks like the issue lies in the href of the "View All" button. The URL being generated by your current code uses {{ section.settings.collection.title }} to pull the collection title, which may not match the exact URL structure of your collections.

You can try updating the link to use the actual handle of the collection (which is a URL-friendly version of the collection's title) rather than the collection's title. This will ensure that the URL is correct, and customers are directed to the correct collection.

Here's the modified code for the "View All" button:

{%- if section.settings.show_view_all and more_in_collection -%}
  <div class="center collection__view-all">
    <a
      href="/collections/{{ section.settings.collection.handle }}?view=all"
      class="{% if section.settings.view_all_style == 'link' %}link underlined-link{% elsif section.settings.view_all_style == 'solid' %}button{% else %}button button--secondary{% endif %}"
      aria-label="{{ 'sections.featured_collection.view_all_label' | t: collection_name: section.settings.collection.title }}"
    >
      {{ 'sections.featured_collection.view_all' | t }} {{ collections[section.settings.collection].title }}
    </a>
  </div>
{%- endif -%}

In this change:

{{ section.settings.collection.handle }} is used instead of {{ section.settings.collection.title }} to ensure that the correct collection handle is used in the URL.

The handle will match the actual URL of the collection on your site (e.g., /collections/tees), and it should resolve the issue of the "View All" button redirecting to the "Default Collection".

Let me know if this resolves the issue!

If I was able to help you, please don't forget to Like and mark it as the Solution!
If you’re looking for expert help with customization or coding, I’d be delighted to support you. Please don’t hesitate to reach out via the email in my signature below—I’m here to help bring your vision to life!

Best Regard,
Rajat

[FunTakers]

Hi Raj, 

Thanks for your insight, I appreciate it. I tried your snippet and seems the issue is persistent. The URL "https://funtakers.com/collections/tees?view=all" still re-directs to the default collections. This is said for both stickers & tees pages respectively. Would you be open to taking a look into our code yourself; Thanks! ❤️

[rajweb]

I appreciate the feedback and the opportunity to assist you further.

I’m sorry to hear that the issue persists. I’d be happy to take a closer look at your code to identify the root cause. To proceed efficiently, please send me a message via email so we can discuss this in more detail and ensure we resolve the issue promptly.

Looking forward to your email!

Best regards,

Rajat

[FunTakers · Accepted solution]

For anyone with a similar issue, this is dependent on the theme you are using. I don't use a common theme such as Dawn so, the results can vary. 

I was unable to resolve the issue. I worked with Raj for several days and he helped explain why my theme was the issue. Since I didn't want to modify the theme, I instead opt'ed to modify the results page per category on our site. Increasing the default preview from 20 to 100 products. This seems a bit excessive, but with modern image compression/optimization it didn't make much of a difference in terms of loading speeds and overall connectivity to our site visitors.