Hi, I was wondering how I could make my text in the slideshow on 2 lines?
This is the link to my store: https://redfroglab.myshopify.com/
The password is: redgrenouille
Thank you
Topic summary
A user needed help formatting slideshow text to display across two lines on their Shopify store.
Solutions Provided:
- Add a line break (
<br>) tag or wrap text segments in separate<div>elements - Insert custom CSS code in the theme.liquid file below the
<head>tag, targeting specific slideshow slides usingaria-labelattributes and settingmax-widthproperties
Outcome:
The CSS solution successfully resolved the issue. The user confirmed it worked and asked about applying the same formatting to additional slides. They were instructed to add similar CSS rules for each slide by targeting different aria-label values (e.g., “2 of 5”, “3 of 5”, “5 of 5”).
Status: Resolved. The user successfully implemented the multi-line text formatting across their slideshow.
1 Like
Hi @lauhug , You need some customization on the code. You’ll need to adjust the text so that it spans two lines. You might need to add a line break
tag or wrap the text before, in a
and the text after, in another.
Hey @lauhug ,
Go to your theme’s “Edit Code” Option, then in the search bar type “theme.liquid”
Below the tag “” tag paste the following. Screenshot attached for reference.
Screenshot is for reference only, the correct code to paste is the one shown above.
1 Like
Thank you, it works!
And if I want to apply it to other slides, do I just add the lines of the code below like this:
@media only screen and (min-width: 750px) { .slideshow__slide[aria-label="2 of 5"] .banner__text.rte p { .slideshow__slide[aria-label="3 of 5"] .banner__text.rte p { .slideshow__slide[aria-label="5 of 5"] .banner__text.rte p { max-width: 200px !important; } }?
Then you will do
1 Like
Yes perfect, thank you!