Shopify themes, liquid, logos, and UX
I found out how to change the background for certain sections on my homepage in the Debut theme. I ended up putting a dark image in the background of one of my images but now I can't seem to figure out how to change the font color to white. I used the css below to try it and it only changed the headline white but when I removed it and applied it again, the color never changed:
div#shopify-section-1515631652339 {
text-decoration-color: white;
}
How do you change the font color for a single section?
Found the solution. You have to add the child of the section in order to change the font color. See below:
div#shopify-section-1515631652339 {
background-image: url(IMAGE URL);
}
div#shopify-section-1515631652339 * {
color: white;
}
Hope this helps someone else.
Thank you for posting your result! Worked for me 🙂
Hi there
Sorry where are you pasting this code? I have managed to add an image background to my newsletter section by posting the below code at the bottom of theme.css, however I cannot work out how to change the text colour in this field only to white.
}.newsletter-section {
background: url(https://cdn.shopify.com/s/files/1/0583/9424/7331/files/feeties.jpg?v=1632638515);
background-color: $color-body;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
background-position:center;
Thank you
Sarah
@sarahhh
This should work to change the text color:
.newsletter-section * {
color: #cccccc !important;
}
We'd need to see your website to offer more accurate help, without seeing the actual website's code it's a shot in the dark, though this should do. You can change the font color #cccccc to any hex.
Kind regards,
Diego
nks so much Diego, that worked 🙂
Is there also a way I can add more fields to this section? I would like to add a first name and last name field and remove the background from these fields.
This is what it currently looks like
And this is what I would like it to look like
Thank you
Sarah
Hi @sarahhh
It's certainly possible but would require some more complex work. If this is something you'd like to get done feel free to contact me personally,
Kind regards,
Diego
Thank you Diego, I will do that. In the meantime, I have noticed that the text in the email field (when the customer types in their email) is also white, so the customer is unable to see what they are typing. Can you please let me know how to change this?
Thank you
Sarah
User | RANK |
---|---|
182 | |
150 | |
69 | |
46 | |
34 |
Thanks to all Community members that participated in our inaugural 2 week AMA on the new E...
By Jacqui Mar 10, 2023Upskill and stand out with the new Shopify Foundations Certification program
By SarahF_Shopify Mar 6, 2023One of the key components to running a successful online business is having clear and co...
By Ollie Mar 6, 2023