Re: Slideshow arrows on mobile view

Slideshow arrows on mobile view

tranquilweaves
Excursionist
52 0 2

Hi I used some code to add these arrows onto my slideshow, the desktop view is how I want. However in mobile view they are showing at the bottom rather than being at each side in the middle. Also the pagination dots is not over the image like in the desktop view. Please can someone help! 

 

 

Replies 3 (3)

tranquilweaves
Excursionist
52 0 2

Screenshot 2024-05-17 at 11.13.48.png

BSSCommerce-B2B
Shopify Partner
565 114 137

Hi @tranquilweaves 

I have reviewed your requirement , I think you just need add custom font in base.css and the issue will be resolved.  You can follow my instructions! 

Step 1: Go to Admin -> Online store -> Theme > Edit code: 

view.png

Step 2: Search base.css and add the script css  in the end of file: 

@media (max-width: 768px) {
    button.slider-button.slider-button--next {
        margin-bottom: 150% !important;
    }
}

Step 3: Save and reload page in storefront. 

And the result, Slideshow arrows on mobile view was set higher.

view.png

 

I hope these instructions will help you. If they are helpful, don't forget to like and mark as the solution.

Have a nice day sir!

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


B2B Solution & Custom Pricing |BSS: B2B Portal, Quote, Net 30 | BSS: B2B Login Lock Hide Price


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


BSS Commerce - Full-service eCommerce Agency
tranquilweaves
Excursionist
52 0 2

Hi @BSSCommerce-B2B , thanks so much for your response! I really appreciate it. I input the code and it worked for the right arrow however the left arrow is still at the bottom, I have attached a screenshot. Do you know why this would be? Thanks again! 🙂 

 

Screenshot 2024-05-23 at 22.31.08.png