How to reduce spacing between collection title and products in collection view?

[KimGottwald]

Hi everyone,

I’m looking to reduce the space between the collection title and the products in the collection view on my store. I’ve attached images showing the current layout and the issue I’d like to resolve.

Here’s the preview link to my store: https://ll4w4t6j24v2zyxo-86217654598.shopifypreview.com
Password: Password

Thanks in advance for your help!

Best,
Kim

 

[Made4uo-Ribe · Accepted solution]

Hi @KimGottwald 

Check this one. 

From your Shopify admin dashboard, click on "Online Store" and then "Themes"

Find the theme that you want to edit and click on "Actions" and then "Edit code".

In the "theme. Liquid" file. Find the </body> tag and paste the code below before the tag. 

<style>
.collection__title.title-wrapper, .collection__title--desktop-slider .title {
    margin-bottom: 0 !important;
}
ul#Slider-template--22604233867590__featured_collection_cqchjr {
    margin-top: 0;
}
.slider.slider--desktop .slider__slide {
    padding-top: 0;
}

</style>

And Save. 

Result:

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

[Moeed]

Hey @KimGottwald 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
.collection__title.title-wrapper--self-padded-tablet-down {
    margin-bottom: 0 !important;
}
.collection__title--desktop-slider .title {
    margin-bottom: 0 !important;
}
.slider {
    margin-top: 0 !important;
}
.slider--desktop.grid--4-col-desktop .grid__item {
    padding-top: 0 !important;
}
</style>

RESULT:

If I managed to help you then, don't forget to Like it and Mark it as Solution!

Best Regards,
Moeed