Shopify themes, liquid, logos, and UX
Hi, shopify store URL:
Tiny Little Humans
tiny-little-humans-uk.myshopify.com
At the moment, when I add a collection list to my homepage, the tile shows with a white collection name over it. I would like to remove this overlay entirely to just show the collection image on the tile. I have tried altering the code myself but... as you can tell haven't been very successful.
Any help would be fab!
Thanks
TLH
Solved! Go to the solution
This is an accepted solution.
hello @linzal
please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.
.template-index .collection-grid-item__title-wrapper {
display: none;
}
Hello There,
Please share your store password and screenshot.
So that I will check and let you know the exact solution here.
Thanks, password: ahrtea
Ideally, I would like no text on on the overlay, or the text to appear at the bottom as it is covering the design.
Thanks
TLH
Hi,
To hide the title, you can install my free app Custom CSS and add the following code
If you don't want to install the app, you can add the following at the bottom of your assets/styles.scss.liquid or assets/theme.scss.liquid file
.template-index .collection-grid-item__title-wrapper {
display: none;
}
Thank you - What am I doing wrong....
Hi,
Could you put that code to the file theme.css so I can take a look at the problem closer?
This is an accepted solution.
hello @linzal
please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.
.template-index .collection-grid-item__title-wrapper {
display: none;
}
Hello There,
1.In your Shopify Admin go to online store > themes > actions > edit code
2.Find Asset >theme.scss.css and paste this at the bottom of the file:
.template-index .collection-grid-item__title-wrapper {
display: none!important;
}
Thank you - this worked a charm. Can I please ask what I would need to change in the code to move the wording to the bottom of the tile? As I think it may be helpful to still be there.
Thank you for your response. It's good to know that it's worked for you. Kindly feel free to get back to me if you need any further assistance.
Thanks! Can I ask what the code would be to move the writing to the bottom of the tile?
I cannot get this to work for me. I tried adding
.template-index .collection-grid-item__title-wrapper { display: none!important; }
to the theme.css file. I am using debut. URL https://gtsswag.com/
Hi There Kinjaldavra thanks for sharing. Is it possible to only avoid the overlay if an image is present ?
thanks
RJ
Like if there is an image for that collection then display the image if not then display the text which is the collection title.
Hey Community! As the holiday season unfolds, we want to extend heartfelt thanks to a...
By JasonH Dec 6, 2024Dropshipping, a high-growth, $226 billion-dollar industry, remains a highly dynamic bus...
By JasonH Nov 27, 2024Hey Community! It’s time to share some appreciation and celebrate what we have accomplis...
By JasonH Nov 14, 2024