Re: Removing empty space between collections

Removing empty space between collections

Linealy87
Tourist
5 0 3

IMG_8019.jpeg

Replies 10 (10)

ZestardTech
Shopify Partner
5764 1051 1390

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;
}
}

 

ZestardTech_0-1721365504934.png

 

Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: [email protected]
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing
Linealy87
Tourist
5 0 3
You rock!! Thanks so much! Fixed! ##- Please type your reply above this
line -##

Sweans
Shopify Partner
406 80 124

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".

Sweans_0-1721363123574.png

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

- Was my reply helpful? Please Like and Accept the Solution or let me know by Buying me coffee!
- Want to modify or custom changes on store Hire me.
- Feel free to contact me at [email protected] regarding any help.
- To know more about me check out www.sweans.com

Sweans
Shopify Partner
406 80 124

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

- Was my reply helpful? Please Like and Accept the Solution or let me know by Buying me coffee!
- Want to modify or custom changes on store Hire me.
- Feel free to contact me at [email protected] regarding any help.
- To know more about me check out www.sweans.com

Rahul_dhiman
Shopify Partner
558 112 110

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
13.png


If this was helpful, hit the like button and mark the job as completed.
Thanks

Was I helpful?

Buy me a coffee



Want to modify or custom changes or bug fix on store . Or Need help with your store? Or -Want Complete Storefront
Email me [email protected] - Skype: live:dhiman.639
Checkout Some Free Sections Here
Mobile:- +91 62390-46167
Linealy87
Tourist
5 0 3

This worked and looked great, but then when I clicked on the collection the prices/description would no longer show on the products. 

IMG_8091.jpeg

Made4uo-Ribe
Shopify Partner
8292 1988 2443

Hi @Linealy87 

Is this only on mobile screen? Or include Dekstop?

I include both screen on this code. 

  1. From you Admin page, go to Online Store > Themes
  1. Select the theme you want to edit
  2. Under the Asset folder, open the main.css(base.css, style.css or theme.css)
  3. Then place the code below at the very bottom of the file.

 

.collection-list:not(.slider) .card__information {
    display: none;
}

 

  • And Save. 
  • Result:
  • Made4uoRibe_0-1721385630736.png

     

 

 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.
Need THEME UPDATES but has custom codes? No worries, contact us for affordable price.

BSS-TekLabs
Shopify Partner
2350 702 827

- Here is the solution for you @Linealy87 
- Please follow these steps:

step.png

- 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:

BSSTekLabs_0-1721393706329.png

 

BSSTekLabs_1-1721393715672.png

 

 

- 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


BSS Commerce - Full-service eCommerce Agency | Use Shopify for 1$ in the first month now
Linealy87
Tourist
5 0 3

I looked several times and I’m not seeing the “base.css” file

Linealy87
Tourist
5 0 3

I found it, but the problem is when the code is applied I can no longer click on the collection on the site.