Making header & container background transparent or opaque.

  • Resolved mudante

    (@mudante)


    9 years, 8 months ago

    I’d like to make the header and container (body) TRANSPARENT on all pages so I can see and appreciate a special image with a gradient background which I have in mind. Anyone can provide the proper code for achieving it please?
    As an example of what I’d like to have on evolve, here is my old page in transition: https://rmpiano.com

    Thanks!

Viewing 6 replies - 1 through 6 (of 6 total)

  • Hi there!

    To make the wrapper background transparent on the evolve theme try this snippet of code:

    #wrapper {
  background: rgba(0,0,0,0);
}

.header {
  background: rgba(0, 0, 0, 0);
}

    Screenshot

    Then target the body for your image, i.e.

    body {
    background-image: url("mywebsite.com/myimage.jpg");
 }

    You can paste this code in your child theme’s style.css or in a custom css plugin such as Simple Custom CSS.

    I hope that helps!

    Luke the Daft Duke

    Thread Starter mudante

    (@mudante)

    Thanks so much for your reply Luke!
    I will try this and i let you know ASAP.
    Cheers!

    Thread Starter mudante

    (@mudante)

    Hi Luke!
    I tried it and it works! However, the menu (container) remains with a white background. I tried to do it by myself but . . . wasting a lot of time with not avail. Looking how I can make it (menu container) 100% opaque.
    Thank you again!!

    Hi there,

    Thanks for writing in, you can achieve that by adding following code under Appearance > Theme Options > Custom CSS:

    .page #container, .wrap {
  background: transparent !important;
}

    Hope this helps!

    Thanks.

    Thread Starter mudante

    (@mudante)

    Hello emranemranx!

    The menu is quite resilient, doesn’t want to give up the white background!! Take a look (amateurish work in process):
    rmpiano.com/lessons/home

    Thanks a lot!

    Thread Starter mudante

    (@mudante)

    WAIT a MINUTE!! I GOT IT! YEAH!
    What I did? Appearance-Theme Options-Styles- and click on the option: disable menu background.
    Thank you guys!

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Making header & container background transparent or opaque.’ is closed to new replies.