Shopify themes, liquid, logos, and UX
Hello!
As in the topic: Image Banner Section has a Heading Block and Text Block. It appears that Text Block has some transparency adjusted to the text that makes it less visible. Is there any chance to remove this transparency? And is there any chance to edit the color of Heading Block and Text Block?
Thanks in advance!
yes please check theme setting may be allow or
Sorry you are facing this issue, it would be my pleasure to help you.
Welcome to the Shopify community!😊
Thanks for your good question.
Please share your site URL,
I will check out the issue and provide you a solution here.
Thank you for your answer.
Settings in the Image Banner section are allowing only to edit the placement of the text. I can edit the color of this too: Theme settings >>> Colors >>> Secondary Colors >>> Text, but this option is changing the color in many elements across the theme (and not the opacity) so it's useless for me.
I need the option to edit code and manage color and opacity in this text window:
Now, even the color section is the same for Heading, Text, and Buttons the Text and Buttons have uneditable transparency and are less visible:
Any chance to do that?
yes please share store url!
There is no point to share the store URL.
This is a problem with the default setting in Dawn 2.0 theme. If someone could help all he/she needs to do is just open this theme.
I hope someone can help me.
Please share your store URL.
hello @Maro33
Please provide website url and if your store is password protected then also provide password So I will check and provide a solution here.
Hey @Maro33,
You can modify the color using the background option. And you can change the transparency using the "Image overlay opacity" option.
► Need help with theme customization, speed optimization, fixing bugs?
Thank you for the answer.
These options are changing the background, not the text.
Disclaimer; I am not a developer, just a seasoned Shopify client with the same issue! It gives me great joy to have found the solution:
1. Go into your theme to Edit Code > Assets > Base.css
2. Find the code I've screen-shotted. Match the line numbers.
3. Where it says "color: rgba(var(--color-foreground), 0.7)" Change the value from 0.7 to 1 (as I have in the screen shot).
4. Celebrate!
Had a similar problem with Dawn - thanks to @valcrisp I found out how to remove alpha settings on body text, as below - set color-foreground to 1 from 0.7.
body,
.color-background-1,
.color-background-2,
.color-inverse,
.color-accent-1,
.color-accent-2 {
color: rgba(var(--color-foreground), 1);
background-color: rgb(var(--color-background));
}
It's odd that the Dawn theme developers haven't given users more options over text colours - not sure of the logic behind hard coding alpha settings of text - a bit daft imo.
Where did you find the body code?
Thank you @Valcrisp and @Rich_Woodward for this helpful advice! I am having the same problem with Dawn right now. I was able to correct this issue for the subtitle and the body text, but I cannot find the correlating line for buttons.
Are you ready to take your business to the next level? Look no further than the latest ...
By SarahF_Shopify Apr 15, 2024We’re keeping the ball rolling to make sure you’re always ahead of the game. So buckle ...
By JasonH Apr 8, 2024Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024