Change the logos from stack to carrousel/slide

arivon
Excursionist
26 0 5

Hey guys! i need your help 

How can i make this section in mobile a slider / carrousel instead of stacked? I have the honey theme and this block is named "Logo Banner" 

Is there any CSS ¿?

arivon_0-1715253914233.png

 

Replies 2 (2)

BSSCommerce-HDL
Shopify Expert
733 244 255

Hi @arivon ,

 

You can follow these steps so that the banner logo will be a slider on mobile:

 

1. Navigate to Online store => Themes => Customize

 

2. Open the banner logo editor and add CSS code to the Custom CSS section

 

view (2).png

 

@media only screen and (max-width: 767px) {
  .logo-banner ul {
    flex-wrap: nowrap;
    overflow-x: scroll;
    overflow-y: hidden;
    padding-bottom: 16px;
  }
  .logo-banner ul::-webkit-scrollbar {
    height: 7px;
    background-color: #616162;
    border-radius: 10px;
  }
  .logo-banner ul::-webkit-scrollbar-thumb {
    background-color: #fff;
    border-radius: 10px;
  }
  .logo-banner ul li {
    padding: 0px;
    margin-right: 10px;
  }
  .logo-banner ul li img {
    max-width: 400px;
  }
}

 

This is the result

 

view (3).png

 

Hope this will help!

If our suggestions are useful, please let us know by giving it a like, marking it as a solution, or donating here .


B2B Solution & Custom Pricing | Product Labels by BSS


Need help from our expert? Kindly share your request with us via community@bsscommerce.com


BSS Commerce - Full-service eCommerce Agency
arivon
Excursionist
26 0 5

Hello! Thank you very much. It is working but i need to take out the horizontal bar. is this posible?