You can use CSS in a child theme or a CSS plugin (like Jetpack) to do this. I recommend using Firebug for CSS work–makes it much easier.
Look through style.css for any elements that have the opacity
property applied, copy them into your child theme’s style.css, and set all values to opacity: 1;
An example:
#masthead {
opacity: 1;
}
Hello thanks for your response. The opacity where all set to 1; already when I downloaded the theme,I actually play around with the opacity in the header area and change it to 9 from 1; and it almost remove all the transperancy but changing it to 9 from 1 did not work in the menu and all other areas. So what do i did if the opacity is already set at 1; that’s the way it as already coded when i downloaded thank you.
An opacity of 1
means it’s fully opaque, no transparency whatsoever. So if all the values were already set to 1
, you shouldn’t see any transparency/opacity effects. The value of opacity
can only be between 0 and 1 (not higher, like 9).
It’s also possible the colors aren’t very dark at full opacity. You can set a new color for the text/links using the color property in various areas (color: #333;
for example). We can’t really help with basic CSS in this forum, but there are a number of resources linked above.
I’m trying to find out how to do this too, i’ve changed it to 1 in the style css but its still transparent. I just want it to be opaque and not transition. Any ideas?
Many Thanks
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
@caramelr, did you create a Child Theme?
Yes I did. Thanks for your reply, i just managed to sort it- there was a . before the 1 so it read as .1
I removed the . and now its fully opaque π
Thanks
How do I create a Child Theme so I may edit the opacity as well?
By the way, I use chrome, not Firefox, so I believe Firebug won’t work, correct?
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Hi jblanc, may you discuss that on your own thread?
Hello, I have spun installed at weddingsbykirk.com and after reading every thread i can find about the transparency issue, nothing seems to work. I have above average knowledge of html and have set all opacity to 1. I’ve also tried changing my text color with no luck. If anyone can help, i would be very appreciative.
Thanks
#masthead {
clear: both;
display: block;
min-height: 30px;
opacity: 1;
padding: 30px 0;
position: relative;
transition: opacity 1s ease-in-out;
-webkit-transition: opacity 1s ease-in-out;
-moz-transition: opacity 1s ease-in-out;
-o-transition: opacity 1s ease-in-out;
width: 100%;
}
#masthead:hover {
opacity: 1;
transition: opacity 1s ease-in-out;
-webkit-transition: opacity 1s ease-in-out;
-moz-transition: opacity 1s ease-in-out;
-o-transition: opacity 1s ease-in-out;
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Can you discuss that on your own thread?
Hi Caroline,
Thank you for Spun.
Regarding transparency and color in the masthead (on the right that lists pages), can you advise where to change/add a color property in style.css?
Thanks.
Jill
Okay so I basically wrote this
#masthead {
opacity: 1;
}
In my child theme and only worked on the header. I’m gonna need it for the bubbles with the +/- sign for the menus or widgets or comments. I’m thinking I should change the “#masthead” part but I have no idea to what exactly.
Any clues?