Dawn theme pagination customization

Store Design
, , ,
1

I’m using Dawn theme with pagination dots and want to make two changes.

First, I’d like to change the dots to white.

Second, the dots were originally under the slideshow and I used the below code to place them over the image at the bottom. Everything works, however when I click pause, the pause button disappears and the play button appears but rather than replacing the pause button placement, appears to the right of where the pause button was and at the edge of the screen. Is it possible for it to simply replace the pause button in the same place instead of appearing to the side?

.slideshow__controls.slideshow__controls--top.slider-buttons {
    position: absolute;
    bottom: 0;
    margin: 0 auto;
    left: 0;
    right: 0;
}

Screenshot_9-2-2026_123739_jccu5h-0s.myshopify.com
Screenshot_9-2-2026_123739_jccu5h-0s.myshopify.com1479×765 86.6 KB

2

Hey @kristd

Can you share your store URL and Password if enabled?

Best,
Moeed

3

Hi @Moeed

Here, thank you!

Killeen Security Products

4

Follow these Steps:

  1. Go to Online Store
  2. Edit Code
  3. Find theme.liquid file
  4. Add the following code in the bottom of the file above </ body> tag
<style>
.slider-counter__link--active.slider-counter__link--dots .dot {
    background: white !important;
}
</style>

RESULT:

image
image1245×681 140 KB

If I managed to help you then a Like would be truly appreciated.

Best,
Moeed

5

Great, this helped. Thank you!