Support » Theme: Zerif Lite » Remove Grid over Background

  • Resolved s-webdesign

    (@s-webdesign)


    Hello!

    I would like to remove the grey Grid/overlay over the Background/Header Image!

    Does anyone have a solution?

Viewing 13 replies - 1 through 13 (of 13 total)
  • Hi,

    Can you please explain this question?

    Regards,
    Hardeep

    Hello!

    I have this problem too!
    I’m try to explain, my picture is bright and colorful, but when i set my picture as “background image”, its look like she have low opacity, or gray filter. Sorry for my bad English 😉

    Hi,

    You can add the following CSS, using Simple Custom CSS plugin, to your WordPress site to modify the background opacity:

    .newsletter,
    .contact-us,
    .packages,
    .header {
        background: none repeat scroll 0% 0% rgba(0, 0, 0, 0) !important;
    }

    Regards,
    Hardeep

    Thank you! It’s working 😉

    Hi,

    I’m glad it worked. Please consider leaving a review for the theme in the review section. 🙂

    Regards,
    Hardeep

    Hi, this is also a great tip, but now the picture is too bright for me. Which rgba setting is responsible for brightness without effecting colors?

    Hi,

    The code that I posted is for the default settings, and it has nothing to do with your issue, which means that you’re image is already too bright. You can learn more about it at: http://css-tricks.com/rgba-browser-support/

    Regards,
    Hardeep

    Thanks Hardeep.

    I used this tool http://www.css3-generator.de/rgba.html
    to find the right setting.

    I actually only needed the fourth element, the others are all 0 if you want to put a grey mask on the picture. I found that 0.5 corresponds to what is originally on the background picture, so I tweaked it to 0.3, which feels just right for me.

    Hi,

    I’m glad it worked for you. 🙂

    Regards,
    Hardeep

    Hi Hardeep,
    I have been checking out the Support Forums to figure out ways to change the background colors and the transparency and also to increase the logo size on the website. Everywhere I see you mentioning Simple Custom CSS plugin.

    I have installed the plugin on my website which uses Zerif Lite.

    But I am unable to make the changes to the code.. I keep getting the following error:

    Plugin could not be activated because it triggered a fatal error.

    Parse error: syntax error, unexpected ‘.’ in /home/content/p3pnexwpnas08_data03/11/2684411/html/wp-content/plugins/simple-custom-css/simple-custom-css.php on line 31

    Could you please guide me on how to go about this?

    I need to make the following changes to start with:
    1. Change the background colors for all the sections on the front page (currently, About Us section has ‘black’ background; Testimonials has yellow mustard; and so on..)

    2. Modify the background image transparency to bring out the brightness of the original image (currently, its making the site look dull)

    3. Increase the size of the logo on the top left hand corner of the site.

    Thank you for your help!

    Regards,
    Niv

    Alexandra

    (@alexandrastan001)

    Please consider creating your own thread:
    https://wordpress.org/support/theme/zerif-lite#postform

    I tried this with a child theme and Simple Custom CSS plugin by pasting in:

    .newsletter,
    .contact-us,
    .packages,
    .header {
    background: none repeat scroll 0% 0% rgba(0, 0, 0, 0) !important;
    }

    But it did not work. Any help with this? Thank you.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    See Alexandra’s latest post

Viewing 13 replies - 1 through 13 (of 13 total)
  • The topic ‘Remove Grid over Background’ is closed to new replies.