Shopify themes, liquid, logos, and UX
Hello There,
1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > base.css and paste this at the bottom of the file:
@media (max-width:767px){
.collection-list__item .card__information {
display: none;
}
}
Hi @Linealy87 ,
The white space is not blank; it displays the collection name. To make the collection name visible, you can change the text color. Please follow the steps below.
1.In your Shopify admin, navigate to "Online Store" under Sales Channels. Click the three dots next to the theme you wish to edit, then select "Edit Code".
2. Next you can find main.css/theme.css/base.css/style.css(it will be based on your theme file)
Add the below code to your CSS file:
.slider-mobile-gutter .card__content a {
color: #000;
}
If you wish to hide the white space please use the CSS below:
.slider-mobile-gutter .card__content {
display: none;
}
If you need further assistance, feel free to reach out!
I hope this helps! If it does, please like it and mark it as a solution!
Regards,
Sweans
HI @Linealy87 ,
If the above solution needs to be fixed. Please share your store link with us. So we can help you with detailed solutions.
Regards,
Sweans
Hello @Linealy87
Go to online store ---------> themes --------------> actions ------> edit code------->base.css
add this code at the end of the file
@media screen and (max-width: 749px) {
.grid--2-col-tablet-down .grid__item {
height: 207px;
}
}
and the result will be
If this was helpful, hit the like button and mark the job as completed.
Thanks
This worked and looked great, but then when I clicked on the collection the prices/description would no longer show on the products.
Hi @Linealy87
Is this only on mobile screen? Or include Dekstop?
I include both screen on this code.
.collection-list:not(.slider) .card__information {
display: none;
}
Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
- Here is the solution for you @Linealy87
- Please follow these steps:
- Then find the base.css file.
- Then add the following code at the end of the file and press 'Save' to save it.
.card--standard>.card__content {
display: none !important;
}
- Here is the result you will achieve:
- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.
If our suggestions are useful, please let us know by giving it a like or marking it as a solution.
Salepify: Efficiently increase sales conversion with sale-driven features like auto add to cart, free gifts (free plan available)
Salemate: Boost your AVO with 2-layer offer, countdown upsell in your post purchase page
I looked several times and I’m not seeing the “base.css” file
I found it, but the problem is when the code is applied I can no longer click on the collection on the site.
Starting a B2B store is a big undertaking that requires careful planning and execution. W...
By JasonH Sep 23, 2024By investing 30 minutes of your time, you can unlock the potential for increased sales,...
By Jacqui Sep 11, 2024We appreciate the diverse ways you participate in and engage with the Shopify Communi...
By JasonH Sep 9, 2024