Gray filter in intro photos
-
My static front page is set to a page that has a brief introduction of my organization, and I’d also like to have a photo and a video in that panel (this is in the white box – not panel one.) However, there seems to be a gray overlay/filter on this box – I got rid of the gray overlay on my header, but can’t figure out how to get rid of it in this box to make my image/video more clear. Any help would be appreciated- thanks!
The blog I need help with is: (visible only to logged in users)
-
Hi, add this to your custom CSS, which removes the linear gradient overlay on all the panels on the main page.
.footer-image::before, .panel-image::before { background: none; } -
How did you get rid of the gray overlay on you header image? I can’t seem to figure it out?
-
Hi @rjs090100, I see you have used the following custom CSS to remove the overlay on the header image.
body:not(.no-header-image) .custom-header-image::before,.lodestar-front-page .custom-header-image::before { background:rgba(0,0,0,0.0); bottom:0; content:""; left:0; position:absolute; right:0; top:0 } -
Yes, I did. Thanks. Also, how do you remove the overlay on the static pages? My logo colors do not look correct.
-
Can you point me to a page that has the overlay on it? I’ve checked several of your static pages, and the code you currently have is removing the overlay.
-
So if you look at rs-creative.com, the logo that’s on the main image is a royal blue and a dark bluish gray. But as you scroll down to the first white panel, it has the RS logo on it as well as quote. That RS logo is not the same color as the logo on the header image but it should be. There’s something causing it to be washed out. The colors are not as dark.
-
Ah, thanks, I was looking at the wrong site. In Lodestar, there is an lessened opacity set on the entry content section. We can reverse that with the following.
.lodestar-intro .entry-content { opacity: 1; } -
-
I went back in and looked at all the CSS associated with the other panels on the main page and do not see where they had applied any opacity to any of the elements with the exception of the panel content entry titles, which they have set to .6. If you wish to change those to fully opaque, add the following.
.entry-content h1, .entry-content h2, .panel-content .entry-title, .entry-meta { opacity: 1; } -
-
I have also tried to stare at the images and check the page overlay. I am still trying to figure out the difference
-
-
-
Hi! I am struggling with the same problem at https://eboufinetailoring.wordpress.com/ . I did use the suggested custom CSS to set the opacity to 1, but that didn’t seem to make a difference. Any suggestions? TIA.
-
Thank you for your response, @thesacredpath ! Indeed I have. Apparently I needed to tackle both the opacity and the overlay on the header image. As soon as I addressed both, everything looks like I want. Thanks again!
-
-
Hi @thesacredpath – I added that custom CSS to my site, but I still have the gray overlay on the photos in the first box. Would I need different code since it’s not technically the first panel? I think that’s where I’m having trouble. Thanks!
-
Hi, I’m a bit lost. Are we talking about here: ? Are you talking about the image at the very top behind PLEN Preparing Women to Lead? This is the link to the photo used there, which is exactly the same as I’m seeing on your site: https://plennetwork.files.wordpress.com/2017/05/cropped-copy-of-side-capitol.png
If I’m missing something, can you tell me exactly which image it is? I also compared your other images to what I see on your site and again, I’m seeing no difference.
- The topic ‘Gray filter in intro photos’ is closed to new replies.
WordPress.com Forums 
