Wimble Header - Question | JoomShaper
SP Page Builder 6 is Here! Learn More →
Back to the questions

Wimble Header

M

Mark

Template 1 month ago

How do I have the same header on every page of my website? I want the header on my homepage, to be on every page. As the header on every other page has a solid white background, hiding the menu text. url in hidden.

0
4 Answers
Order by
Oldest Newest Votes
Paul Frankowski
Paul Frankowski
Accepted Answer
Senior Staff 1 month ago #204457

On home page (in orginal) there is bg image under menu with gradient black. On other pages, you don't have bg image. I guess, you are not the CSS guy, so you can modify my CSS by using that (first delete older/previus CSS code)

body.default-home #sp-header.transparent-header {
  background-image: linear-gradient(180deg, #000000 0%, rgba(0, 0, 0, 0) 100%);}
#sp-header.transparent-header {
  background: linear-gradient(180deg, #25522C 0%, rgba(0, 0, 0, 0) 100%);}

And if you want to make solid bg color during mouse hover over it, you can add also that line below:

#sp-header.transparent-header:hover {
  background: linear-gradient(180deg, rgba(37,82,44,0.85) 100%, rgba(0, 0, 0, 0) 100%);}

BTW

0.85 - is transparency level (you can try from 0.5 to 0.99).

0
M
Mark
Accepted Answer
1 month ago #204459

Thank you very much!! :)

0
Paul Frankowski
Paul Frankowski
Accepted Answer
Senior Staff 1 month ago #204454

Hi Mark,

For example , you can use that Custom CSS (In Template Options > Custom Code > Custom CSS)

#sp-header.transparent-header {
  background: #2D5832D1;}

and then header will be dark green, and all main menu items will be visible.

0
M
Mark
Accepted Answer
1 month ago #204456

Thank you. That worked. How can I make it like the original header where it is slightly transparent, and goes to totally tranparent? For example: 70% to 10%

0