Hi everyone,
I want to hide the text below the photo in my collections, I tried some codes but it also hides the product titles in my home page and other products.
See the photo below for reference.
Topic summary
A user wants to hide text appearing below collection images on their Shopify collection page, but previous attempts also removed product titles from the homepage.
Initial Problem:
- Text below collection photos needs to be hidden
- Earlier CSS code affected product titles site-wide, not just collection pages
Solution Provided:
A community member shared CSS code to add to the component-card.css file:
.collection-list .card:not(.ratio)>.card__content {
opacity: 0;
height: 0;
}
Key Details:
- The code targets only collection page titles by specifying the
.collection-listpath - This prevents unwanted hiding of product titles elsewhere on the site
Resolution:
The solution successfully resolved the issue. The user confirmed the code works as intended, hiding only the collection card text without affecting other product displays.
Hi, @IntechCarl
Send me Page URL
Hi! I sent you privately the link
https://yywy1ulr838gm-13830324282.shopifypreview.com
Add the letters (a), (p), and (k) betwen 8 and 38gm in the link
hey ^^
Try adding this code at the bottom of your ‘component-card.css’ file (you have to edit your theme code).
/* HIDE TITLES IN COLLECTION PAGE */
.card:not(.ratio)>.card__content {
opacity: 0;
height: 0;
}
Let me know if it works 
Hi! i tried using this code and it works, but the problem is it also hide the title of the card in my products. I want it only in the collection cards.
Hi ^^,
Sorry for the mistake, with this code the edit is made only on the titles on the collections page 
(I specified the path of titles to be edited).
/* HIDE TITLES IN COLLECTION PAGE */
.collection-list .card:not(.ratio)>.card__content {
opacity: 0;
height: 0;
}
Let me know if it works!
1 Like
It worked! Thanks a lot!
You’re welcome!
1 Like