Move Section up

[Explore-Sherpa]

I need to move our "Best Selling Products" section up to be almost right under my "image with text overlay" section (and to get rid of the "Our Favorites" text block and line to give it more space to move up) I would need custom css for this. I am using an Influence theme. https://www.exploresherpa.com/

[theycallmemakka · Accepted solution]

Hi @Explore-Sherpa 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file
4) Add the following code just above tag </head>

<style>
div#shopify-section-template--21827397878039__1d0fa29b-8542-4612-9e7b-859c0f3e42fb .small-subtitle {
    display: none;
}

div#shopify-section-template--21827397878039__1d0fa29b-8542-4612-9e7b-859c0f3e42fb section.best-sellers-section {
    margin-top: 0px!important;
}
</style>

If you require further help to optimize your store, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated. And if this solves the problem, please Mark it as Solution!

Best Regards,
Makka

[Explore-Sherpa]

Thank you for the code, it worked like a charm for the desktop version of the site. However, there is a large white space on the mobile version between the "scroll arrows" and "Best Selling Products". Is there additional code I could input to move the product selection up to where "Best Selling Products" is between the arrows? ( I want to keep "Best Selling Products" where it is and move the section up to meet it).

[theycallmemakka]

Hi @Explore-Sherpa ,

Sorry for the late reply. Please try adding this code and let me know if it works

<style>
@media only screen and (max-width: 600px) {
  #shopify-section-template--21827397878039__1d0fa29b-8542-4612-9e7b-859c0f3e42fb .nav-wrapper {
        position: absolute;
        width: 100%;
    }
    #shopify-section-template--21827397878039__1d0fa29b-8542-4612-9e7b-859c0f3e42fb  .slider-section-heading {
        position: relative;
        display: flex;
        align-items: center;
    }
} 
</style>