Shopify themes, liquid, logos, and UX
Hi everyone,
I'm trying to change the page sections background and text color in dawn theme, but there's no option for it. Product box catalog page and contact page. At least so far these are the pages on which I'm experiencing the problem. Most likely I will encounter the same problem on cart page and product page.
As you can see I've inserted a code for sticky and transparent header, but I would like to change the white section to black and the CONTACT text to white.
I've tried with a DIV code in the editors CSS section but it doesn't change the text color only the background.
The send message button also doesn't change according to the color scheme I've selected. This should also should have black background and white text with white box outline.
And last I would like to apply this to all pages of the website (except home page which is actually how it should be.
Does anyone have a solution for this?
Many thanks in advance.
Solved! Go to the solution
This is an accepted solution.
Try this one. I just copy the color of your text.
.section-template--19917975454033__product-grid-padding, section#shopify-section-template--19917975519569__main {
background: #121212;
}
.section-template--19917975454033__product-grid-padding * {
color: #CBAE43;
}
h1.main-page-title.page-title.h0.scroll-trigger.animate--fade-in {
color: #CBAE43;
}
button.button {
border: 1px solid #CBAE43;
}
This is an accepted solution.
No, use this one instead. Same Instruction.
.collection-hero.color-accent-1.gradient, h1.main-page-title.page-title.h0.scroll-trigger.animate--fade-in {
padding-top: 8vw !important;
}
And Save.
It wil change the title of the product and contact.
And I notice your cart page also.
Try this one.
div#shopify-section-template--19917975421265__cart-items {
background: #121212;
padding-top: 8vw;
}
div#shopify-section-template--19917975421265__cart-items * {
color: #CBAE43;
}
a.button {
border: 1px solid #CBAE43;
}
And Save.
result:
We can put the codes all together, but I dont like you to be confuse. 😅
Would you mind to share your Store URL website? with password if its unpublish. And what color do you like to use also the text color?Thanks!
Hi,
Thanks for the fast reply,
here's the site and the password:
https://b56f72-2.myshopify.com/
password masha2023
The main idea would be to have the whole site on back background and the text in different color.
Please let me know what you think
This is an accepted solution.
Try this one. I just copy the color of your text.
.section-template--19917975454033__product-grid-padding, section#shopify-section-template--19917975519569__main {
background: #121212;
}
.section-template--19917975454033__product-grid-padding * {
color: #CBAE43;
}
h1.main-page-title.page-title.h0.scroll-trigger.animate--fade-in {
color: #CBAE43;
}
button.button {
border: 1px solid #CBAE43;
}
Thank you o much. It worked perfectly!
I'd have one more question,
If I add lower margin to space the text from the header a white space appears again, is it possible to remove that too?
Thank you so much for your support!
This is an accepted solution.
No, use this one instead. Same Instruction.
.collection-hero.color-accent-1.gradient, h1.main-page-title.page-title.h0.scroll-trigger.animate--fade-in {
padding-top: 8vw !important;
}
And Save.
It wil change the title of the product and contact.
And I notice your cart page also.
Try this one.
div#shopify-section-template--19917975421265__cart-items {
background: #121212;
padding-top: 8vw;
}
div#shopify-section-template--19917975421265__cart-items * {
color: #CBAE43;
}
a.button {
border: 1px solid #CBAE43;
}
And Save.
result:
We can put the codes all together, but I dont like you to be confuse. 😅
Thank you so much for all the support,
Changes applied looks much better!
If I can bother you with one more thing can any of these codes to be used for the product page? It has the same issue... 🤦♂️
Thank you so much for the kind help, you saved me a loads of hours of research ! 🙂
Hi again ,
I just saw that the cart page still has the same issue .
Can I use the same code to solve it ? if yes in which file should I insert it.?
Many thanks for your help.
We recently spoke with Zopi developers @Zopi about how dropshipping businesses can enha...
By JasonH Oct 23, 2024A big shout out to all of the merchants who participated in our AMA with 2H Media: Holi...
By Jacqui Oct 21, 2024We want to take a moment to celebrate the incredible ways you all engage with the Shopi...
By JasonH Oct 15, 2024