is there a way to take out the dots from the slideshow?

Store Design

Topic summary

A user asked how to remove the navigation dots/controls displayed beneath a slideshow on their Shopify store.

Solutions Provided:

Multiple community members offered CSS-based solutions:

  • Add .slideshow__controls { display: none; } to the Custom CSS section of the slideshow
  • Insert the same CSS code (with !important flag) into the base.css file under Assets
  • Place the CSS snippet in theme.liquid just above the </body> tag

Resolution:

The original poster confirmed one of the solutions worked successfully. The discussion is resolved.

Summarized with AI on October 29. AI used: claude-sonnet-4-5-20250929.
1

Screenshot 2025-04-20 at 4.58.36 PM.png
Screenshot 2025-04-20 at 4.58.36 PM.png2288×1248 219 KB

i dont know how to take out the controls under the slideshow is there a way how?

2 Likes
2

@Degain it will need css, can you please share the website link?

3

Hi @Degain

You can do that by adding this code to Custom CSS of your slideshow section.

.slideshow__controls { display: none; }
4

Hello @Degain ,

Here are the steps to apply the necessary changes in your Shopify store:

  1. In your Shopify Admin, navigate to Online Store > Themes > Actions > Edit Code.
  2. Locate Asset > base.css and paste the following code at the bottom of the file:
.slideshow__controls{
display:none !important;
}

Let me know if you need further assistance!

5

Hey @Degain ,

I hope you’re doing well!

  1. From your Shopify Admin go to online store > themes > … > edit code
  2. In your theme.liquid file, find the (press CTRL + F or command + F on Mac)
  3. paste this code right above the tag:

I hope this helps! If you have any further questions or need additional assistance, feel free to let me know. Wishing you a great day ahead.

Best,
Diego
6

it works thanks!

7

I’m happy to hear! You’re most welcome.