How to fix the links in my collection list

Shopify Discussion

Topic summary

A user’s collection list links became unclickable despite previously working correctly. An image shows the affected collection grid on their Shopify store.

Root Cause Identified:
Code in the base.css file using display: none on .collection-list .card__information was blocking link functionality on screens 750px and wider.

Solution Provided:

  • Replace the problematic CSS with code that uses opacity: 0 and height: 0 instead of display: none
  • This preserves the clickable link area while maintaining the visual appearance
  • A screenshot demonstrates the fix working correctly

Alternative Troubleshooting Steps Suggested:

  • Check theme Liquid files (collection.liquid, collection-list.liquid) for recent changes
  • Disable recently installed apps to identify conflicts
  • Clear browser/store cache or test in incognito mode
  • Verify “Enable Clickable Links” setting in Collection List section
  • Review CSS for styles that might hide links

Status: Solution provided with specific code replacement; awaiting confirmation from original poster.

Summarized with AI on October 30. AI used: claude-sonnet-4-5-20250929.
1

Hi eveyone,

I need help with my collection list, my collection lists are not clickable I don’t know what happened, but it was working fine and it is not.
Store preview link:https://vpmhjfi2bnp4v1y9-13830324282.shopifypreview.com

IntechCarl_0-1743668174763.png
IntechCarl_0-1743668174763.png1496×834 194 KB

1 Like
2

Sometimes, theme updates or code changes can affect the behavior of elements like collection links. I’d recommend looking at the theme’s Liquid files (specifically the collection.liquid and collection-list.liquid files) to ensure nothing has changed that would prevent links from being clickable.

If you recently installed a new app or plugin, it could be conflicting with the collection links. Try disabling the app temporarily and see if the issue resolves.

If your browser or the store’s cache is outdated, it could be displaying an old version of the site. Clearing the cache or checking in an incognito window can help confirm this. If your theme was recently updated, there may be a compatibility issue. You might want to roll back to an earlier version of the theme to see if that resolves the issue.

1 Like
3

Hi @IntechCarl

This code in base.css file caused the issue.

@media screen and (min-width: 750px) {
    .collection-list .card__information {
        display: none;
    }
}

Please replace the above code with this code to solve the issue.

@media screen and (min-width: 750px) {
    .collection-list .card__information {
        opacity: 0;
        height: 0;
        margin: 0;
    }
    .collection-list .card--standard > .card__content { height: 0; }
}

Screenshot 2025-04-03 at 15.45.32.png
Screenshot 2025-04-03 at 15.45.32.png1960×874 96 KB

1 Like
4

Hi,

Hope this will help

  • Collection List section and check setting for “Enable Clickable Links.” If you find it, turn it ON

if above step not working

  • Fix the Code in Theme Files

Code example


   

      
      

{{ collection.title }}
  • Check css for Invisible Links
1 Like