[Studio Theme] How to make slideshow on mobile display text banner box

I would like to have the text banner box on the slideshow liquid still display when on small screen or mobile

As you can see on mobile the box disappears and thus makes the text hard to read. I already have custom CSS for the text box to be slightly transparent so im not worried about it covering the image. However in lieu of the textbox perhaps code that changes the text from the themes dark purple to white when in mobile would also suffice.

Thanks

Hey @Brotaoski
Kindly share your Store URL and Password if enabled

Hi Moeed i would prefer not to at this time. The theme in question is the shopify studio theme ver 10 and its related to the slideshow liquid. I just want to make it where the banner box does not disable when the screen is below the min constraint for mobile.

Hey @Brotaoski

For that I need to have a look on the website so that I can provide you a code according to your requirements. If you’re not able to share your store url and password publicly for privacy reasons then feel free to share it with me personally so that I can assist you.

Best Regards,
Moeed

Hey @Brotaoski

Follow these Steps:

  1. Go to Online Store
  2. Edit Code
  3. Find section-image-banner.css file
  4. Remove the following code from the file at line number 216.
.banner:not(.banner--mobile-bottom):not(.email-signup-banner) .banner__box {
    background: transparent;
}

You just have to remove the background transparent and after that it should look something like this:

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

Best Regards,
Moeed

1 Like