How can i change size of slider to 1400 pxl?

Store Design
, , ,

Topic summary

Goal: Set the slideshow (slider) in the Shopify Dawn theme to 1400 px width without enlarging the entire page.

Key solutions:

  • CSS in base.css (preferred, concrete): Add at the bottom of Assets > base.css: slideshow-component.page-width { max-width: 1400px; } This constrains only the slideshow section to 1400px while leaving other site elements unchanged.
  • Alternative approach: Add custom code in theme.liquid above the tag. (Details of the code were not shown in the thread; a screenshot demonstrated the result.)

Outcome and status:

  • The original poster confirmed success and expressed thanks after applying the guidance, indicating the issue is effectively resolved.
  • No additional questions or outstanding issues were raised.

Notes:

  • Visual examples (screenshots) were shared to illustrate the desired and achieved results.
  • Context: “Dawn” is Shopify’s default theme; changes were made via Online Store > Edit code to adjust only the slideshow component’s width.
Summarized with AI on December 13. AI used: gpt-5.
1

Hi, i want to change the size of my slider (diashow) to 1400pxl. I know i can change it at the settings at page width but every other thing is bigger than too and i don’t want it.

Dawn theme

https://t71vm9-qa.myshopify.com/

I want it like here:

111.png
111.png1900×947 293 KB

I hope you can help me.

Thanks!

1 Like
2

Hey @Anonymous

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 tag

RESULT:

Moeed_0-1732638672085.png
Moeed_0-1732638672085.png1899×918 270 KB

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

1 Like
3

Hi @Anonymous ,

Please go to Actions > Edit code > Assets > base.css file and paste this at the bottom of the file:

slideshow-component.page-width {
    max-width: 1400px;
}
1 Like
4

Thank you!!!

1 Like
5

Thank you for your reply. I’m glad to hear that the solution worked well for you. If you require any more help, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated.

1 Like
6

Thank you!!!

1 Like
7

Hi @Anonymous ,

You’re welcome and happy to help

1 Like