Edit the color and size of the store vertical scrollbar on mobile view at Dawn theme

Store Design
1

Hello,

I’d like to edit the color and size of the store vertical scrollbar (all pages) on mobile view at Dawn theme

I can do it on PC view but couldn’t on mobile

Thank you

2
  1. Access your theme’s code:
  • In your Shopify admin, go to Online Store > Themes.
  • Find the Dawn theme and click Customize.
  • In the top left corner, click on the Theme settings dropdown, then select Edit code.
  • Open the theme.liquid file located under the Layout section.
  1. Insert custom CSS in the tag:
  • In the theme.liquid file, look for the section.
  • Add your custom scrollbar CSS inside the tags.

Should change the styling of the scrollbars on the site GLOBALLY. Let me know if you need additional help!

3

Thank you very much Kyle
Unfortunately the code works for PC view but not on the mobile view

4

Can you post a screenshot of what it looks like on mobile? And a bit of description of what you’re trying to do? Is this mobile on iOS or android?

5

I want to edit the store vertical scrollbar and make it thicker and change its color on both IOS and android

please check how it looks like now ( normal look)

e2f4d4e0.jpg
e2f4d4e0.jpg749×960 61.4 KB

6

Looks as though custom scrollbars on iOS 14 and above isn’t supported . The only way to do it would be to write custom code to create your own scrollbar, but not possible to style the native scrollbar.

7

Well, actually I have 6s and it have 5.8 ios, tomorrow will check the code on android and see if it will work and let you know

Thank you for you care and support I appreciate it

1 Like
8

No problem! Keep us updated on what you find!

9

Hi Kyle, the solution is working only on pc, not on IOS or Android

Hope to get help with this issue as it important for our store

Thank you

1 Like