How to Remove dots/arrow from Slideshow Debut Theme on Desktop and Mobile

Store Design

Topic summary

A user seeks to remove slideshow navigation elements (dots, arrows, and pause button) from the Debut theme on both desktop and mobile devices.

Solution for Desktop:

  • Add CSS code to theme/edit code/Asset/Theme.css:
.slideshow__controls {
  display: none !important;
}
  • This successfully removes controls on desktop.

Outstanding Issue:

  • The CSS solution does not work for mobile devices.
  • Additional request: relocate text to center of image (overlay) instead of appearing in a white box at the bottom.
  • Multiple users report experiencing the same mobile display problem.

Status: Partially resolved—desktop controls removed, but mobile solution and text positioning remain unaddressed.

Summarized with AI on November 11. AI used: claude-sonnet-4-5-20250929.
1

I would like to remove dots, arrows and Pause button from slide show on debut theme

For desktop and mobile view

Thanks

Screen Shot 2022-03-09 at 12.14.32 am.png
Screen Shot 2022-03-09 at 12.14.32 am.png630Ă—468 347 KB

1 Like
2

Hi @Trash ,

Please share your store URL and if your store is password protected then please provide password too.

So that we can help you.

3

HI @Trash
Try to follow this path: theme/edit code/Asset/Theme.css
and add this code into the bottom of the file:

.slideshow__controls {
display: none!important;
}
1 Like
4

Thankyou! this worked :slightly_smiling_face:

5

That worked for Desktop, But not for mobile. How do you remove them fom mobile. and have the text appear in the middle of the image (overlay) rather than in a white box at the bottom.

Thank you

6

I am facing the same issue.

7

Same issue currently