How To Remove Slideshow Buttons On Mobile - Dawn Theme 9.0.0

Store Design
, , ,
1

Hi there,

I’m trying to remove the arrows and pause button from the slideshow on mobile only!

I know I have to edit the theme’s code, but I don’t know which part. I’ve tried a bunch of solutions from other posts, but none have worked. I just want tot remove the controls from the mobile view.

Thank you!

https://coolcookiesllc.myshopify.com/

IMG_5292F20B9DE3-1.jpeg
IMG_5292F20B9DE3-1.jpeg1179×610 54.3 KB

2

Hello SearchGhost1738!

Step 1: Go to Online Store → Theme → Edit code.

Step 2: Search file base.css

Step 3: Paste the below code at bottom of the file → Save

@media only screen and (max-width: 749px) {
	.slider-mobile-gutter .slideshow__controls { display: none; }	
}
1 Like
3

Worked perfectly! Thank you

1 Like
4

Do you know how to remove the arrows and pause button from the desktop view? I’d like to just keep the dots.

Thanks

Screenshot 2023-05-07 at 9.37.03 AM.png
Screenshot 2023-05-07 at 9.37.03 AM.png1409×729 145 KB

5

Hey @SearchGhost1738 ,

For keep dots but remove arrows and play/pause button from desktop,

Please follow below steps

Step 1: Go to Online Store → Theme → Edit code.

Step 2: Search file base.css

Step 3: Paste the below code at bottom of the file → Save

@media only screen and (min-width: 750px) {
	.slider-mobile-gutter .slideshow__controls .slider-button{ display: none; }
}
1 Like
6

That worked! Do you know how to remove the line at the bottom as well? Sorry for all the changes.

1 Like
7

Thanks @SearchGhost1738 for the Accepting solution and also for Like

For remove line at bottom, please add below code into base.css file

.slider-mobile-gutter .slideshow__controls{ border: none; }
1 Like
8

hi, my slideshow control settings are at the top of the page for some reason for both desktop and mobile.

  1. how do I bring it back down?

  2. Instead of dots how do i change it to just 3 lines?

  3. How do I make the control settings part of the image instead of having it at the bottom of the image?

Thank you.

9

Hey @dbacorp257

Can you share your store URL?

So we can go further it.

10

My store is pass protected at the moment. I’m pretty good with editing code if i know what im looking for. The controls are simply on top of the slideshow as a opposed to the bottom where it typically would be

11

Still works with Dawn version 15.2.0

12

If you want to remove everything and just have the pictures, add this to the button of your base.css

@media only screen and (min-width: 750px) {
    .slider-mobile-gutter .slideshow__controls .slider-button{ display: none; }
    .slider-mobile-gutter .slideshow__controls{ border: none; }
    .slider-mobile-gutter .slideshow__controls .slider-counter{ display: none; }