Removing scrolling

[projectthirteen]

Can anyone tell me how to disable scrolling on my homepage only?

Heres a link to a store that has this in place: https://www.aimeleondore.com

Any help is really appreciated, thanks.

My URL: https://project-thirteen.com.au

[BSSCommerce-TC]

Hi @projectthirteen ,

You can follow these step

Step 1: Navigate to Online store > Themes > Edit code 

Step 2: Insert code below at the end theme.liquid and Save. 

 <style>
    @media screen and (min-width: 750px) {
      #Banner-template--17116663906554__image_banner_zT8dWf::before,
      #Banner-template--17116663906554__image_banner_zT8dWf .banner__media::before {
        padding-bottom: 100vh;
        content: '';
        display: block;
      }
    }
</style>
      

Then go back to the storefront and check again. Let us know if it works by liking or giving us a solution. Thank you 😍

[projectthirteen]

Hey @BSSCommerce-TC, unfortunately this didnt work for me.

[BSSCommerce-TC]

Hi @projectthirteen ,

Let try insert at the end the base.css file

@media screen and (min-width: 750px) {
      #Banner-template--17116663906554__image_banner_zT8dWf::before,
      #Banner-template--17116663906554__image_banner_zT8dWf .banner__media::before {
        padding-bottom: 100vh !important;
      }
}   

It would be like that

[tim]

You should not edit your theme code for things like this -- it will make future theme updates difficult.

In the Custom CSS setting of your homepage Banner section enter this:

.banner__media:first-child {
  height: 100vh;
}

Note that depending on the browser width your image may be cropped -- this is the same behaviour as your example site.

[tim]

Also, your code for the time shows local time of your visitors, not the Melbourne time. Just in case.