Slideshow not full

Topic summary

A user seeks help making their slideshow display at full width across different desktop screen sizes.

Solutions Provided:

Option 1: Adjust slideshow settings through the theme customization interface (screenshot provided showing the relevant menu option)

Option 2: Add custom CSS code to the theme files

  • Navigate to: Online Store > Themes > Assets folder
  • Open the main CSS file (main.css, base.css, style.css, or theme.css)
  • Insert specific CSS targeting .slideshow.banner.slider elements with a media query for screens min-width 749px
  • Set height to 100vh to achieve full-screen display

Status: Solutions offered with code snippet and visual examples; awaiting user confirmation of results.

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

Hi there! I need help to make my slideshow appear in full regardless of which desktop size, is it possible?

https://fitnessflair.co/

2 Likes

Hi @nicolewx ,

You can try this option

I hope it helps!

Hi @nicolewx

Check this one.

From you Admin page, go to Online Store > Themes

Select the theme you want to edit

Under the Asset folder, open the main.css(base.css, style.css or theme.css)

Then place the code below at the very bottom of the file.

@media only screen and (min-width: 749px) {
    .slideshow.banner.slider.slider--everywhere .slider__slide {
        height: 100vh;
    }
}

And save.

Result:

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!