How to remove Slideshow Pagination on Dawn Theme

Solved
NathaliaChua
Tourist
6 0 3

Hi,

 

I have added a slideshow to homepage as a banner but as it automatically scrolls through the images I would like to remove the pagination / arrows / controls panel at the bottom of the slider.

 

Store URL - www.movinka.com.au

 

Advice appreciated thank you.

  • ST
Accepted Solution (1)

Accepted Solutions
Nick_Marketing
Shopify Partner
1486 334 446

This is an accepted solution.

Try adding this code to the bottom of component-slideshow.css

.slideshow__controls.slider-buttons.no-js-hidden {
  display:none;
}
Nick | Ecommerce & Marketing Technology Consultant | Toronto, CANADA
- For consulting work availability, please send me a Private Message or submit a ✍️Contact Form.
- For FREE Shopify Tutorials, Subscribe to my YouTube channel (▶️ Ecommerce TV).

View solution in original post

Replies 15 (15)
Nick_Marketing
Shopify Partner
1486 334 446

Consider adding a store URL so that devs on the forum can look into the .CSS.

Nick | Ecommerce & Marketing Technology Consultant | Toronto, CANADA
- For consulting work availability, please send me a Private Message or submit a ✍️Contact Form.
- For FREE Shopify Tutorials, Subscribe to my YouTube channel (▶️ Ecommerce TV).
Nick_Marketing
Shopify Partner
1486 334 446

This is an accepted solution.

Try adding this code to the bottom of component-slideshow.css

.slideshow__controls.slider-buttons.no-js-hidden {
  display:none;
}
Nick | Ecommerce & Marketing Technology Consultant | Toronto, CANADA
- For consulting work availability, please send me a Private Message or submit a ✍️Contact Form.
- For FREE Shopify Tutorials, Subscribe to my YouTube channel (▶️ Ecommerce TV).
NathaliaChua
Tourist
6 0 3

Hey @Nick_Marketing!

 

Thanks this removed the navigation but now the auto slide is gone and only manually switches to the next image with a swipe (which new visitors would not know to do).

 

Any advice here? I have updated on my website so you can see how it is currently with the above code is the css.

 

Thanks again

Nick_Marketing
Shopify Partner
1486 334 446

@NathaliaChuaThe slider switches banners automatically on my end, no swipes required. Desktop and mobile. Maybe a cache issue.

In case the CSS rule provided does not work as expected, you can always remove it.

Nick | Ecommerce & Marketing Technology Consultant | Toronto, CANADA
- For consulting work availability, please send me a Private Message or submit a ✍️Contact Form.
- For FREE Shopify Tutorials, Subscribe to my YouTube channel (▶️ Ecommerce TV).
NathaliaChua
Tourist
6 0 3

Yes it must have been a cache issue as it is working now. Thanks so much @Nick_Marketing !

groundz
Tourist
10 0 2

Hi Nick,

 

Would you know how to do this to the Featured Collection section of the dawn theme? i don't want the pagination showing under the actual slider on mobileScreenshot_4.jpg

seismic
New Member
2 0 0

Hey Nick! I'm having the same issue too, but unsure on where to paste the code?

seismic
New Member
2 0 0

Hey @Nick_Marketing  I'm having the same issue too, but unsure on where to paste the code?

TxDCV
New Member
3 0 0

Coding is gibberish to me still... But I went to edit code, the sections folder, slideshow.liquid, and deleted lines 137-184 then clicked save. It got rid of the previous and next sliders on desktop and mobile.

TxDCV
New Member
3 0 0

Nevermind it didn't work....

aion04
New Member
3 0 0

same situation , didn't work... the code work just for slider banner ... for collection list or featured prod or multicoll didn't work , I try many methods but no working..

 

someone can help please ?

 

I use Dawn theme

TxDCV
New Member
3 0 0

Assets... component-slider.css change the display from FLEX to NONEf.png

aion04
New Member
3 0 0

Respect mate now work very well this code,

have a nice day 

Exproarzana
Shopify Partner
2 0 0

Wow! It was a great and easy solution.

tom890
New Member
2 0 0

Will this code be overwritten if the theme is updated?