Shopify themes, liquid, logos, and UX
On my homepage, I have a couple of collections with preview images displayed. The problem is that you HAVE to have text overlaying the image -- there's no way to just have the image. So for now, I've just done a "." over the images for the smallest footprint, but I would like to remove the text altogether. I have searched for a solution to this dilemma, but have only found people saying that you should add text at the bottom of "assets/theme.scss.liquid," however I don't have such asset in my theme's code.
Any help would be much appreciated!
My theme is Capital and my website can be found at https://bit.ly/3HKXkTk.
Solved! Go to the solution
This is an accepted solution.
Hello @pinegrover
I would like to give you a solution to support you:
1. Go to Online Store-> Theme-> Edit code
2. Open your theme.liquid theme file
3. Paste the below code before </body> :
<style>
.index-features-item-content.center {
display: none !important;
}
</style>
Hello there,
1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset >theme-collection-list.min.css and paste this at the bottom of the file:
.collection__list-item-content--inner span.collection__list--title {
display: none!important;
}
This is an accepted solution.
Hello @pinegrover
I would like to give you a solution to support you:
1. Go to Online Store-> Theme-> Edit code
2. Open your theme.liquid theme file
3. Paste the below code before </body> :
<style>
.index-features-item-content.center {
display: none !important;
}
</style>
This worked, thank you so much!
I will say that despite being fixed visually, it strangely has become that you cannot click the images as links to go to the collections anymore. They just act as images on the home screen now.
Problem is if there is no image for that collection then i would prefer to show the text. Is there a way to remove if only if there is an image present for that collection.
thanks
RJ
Hello @pinegrover,
Glad to support you today.
To can remove the text "." on the collection, you can check out my suggestion below to remove it:
1. Go to Edit code on Online Store:
2. Add my code above the </body> tag on file Theme.liquid:
<style>
body.template-index .index-collectionlist .index-features-item-content .index-features-title {
display: none !important;
}
</style>
Eg:
It show like this when you add my code:
I hope you find the answer helpful 😁.
Kind & Best regards,
GemPages Support Team.
This is Victor from PageFly - Shopify Page Builder App, I’d like to suggest this idea:
Add this CSS at the bottom
Online Store ->Theme ->Edit code
Assets ->section-features.min.css
.index-features-item.image-content .index-features-item-content {
display: none !important;
}
Hope you find my answer helpful!
Best regards,
Victor | PageFly
We recently spoke with Zopi developers @Zopi about how dropshipping businesses can enha...
By JasonH Oct 23, 2024A big shout out to all of the merchants who participated in our AMA with 2H Media: Holi...
By Jacqui Oct 21, 2024We want to take a moment to celebrate the incredible ways you all engage with the Shopi...
By JasonH Oct 15, 2024