- This topic has 5 replies, 2 voices, and was last updated 1 week, 6 days ago by Leo.
May 20, 2020 at 12:13 pm #1294341Ian
I may have missed something but I have a transparent header running using Elements just for the home page. For desktop, everything looks good. Once it switches into mobile, I want to add background colour of the Menu. Is this possible without custom CSS?May 20, 2020 at 1:30 pm #1294409LeoStaffCustomer Support
Can you make sure the menu background color in the customizer is not set to transparent?
Let me know if this helps 🙂May 20, 2020 at 2:33 pm #1294495Ian
I see what your are getting at. So after choosing a background color inside Primary Navigation in the customizer, this fixed the homepage mobile menu background. To make the rest of the site consistent, I had to choose WHITE as the background colour of the Primary Navigation.
One last issue now. Since this Primary Navigation of the background of the white, I selected an all black logo. This works for the rest of the site as there is no transparent background. I also selected black logo for mobile as the rest of the site has a white Header background. However, on the transparent homepage, I could only choose 1 logo inside Elements. I chose White as it works well with the transparent homepage in desktop. But on the homepage when it’s in mobile, the logo switches to the black (from the mobile logo above).
How can I make the mobile logo to be white on the homepage?May 20, 2020 at 7:25 pm #1294652LeoStaffCustomer SupportMay 20, 2020 at 8:15 pm #1294677Ian
Hey Leo, guess what. That was a very smart idea. But I had to create a second Element and target it to the rest of the site and exclude the Homepage.
So in short, let me document this just in case it helps others. I am sure I will have refer to it in the future.
Customizer > Site Identity > Logo = Black logo with transparent background
Customizer > Layout > Header > Mobile Header On > Logo = White logo with transparent background
Element #1 > Header > Site Header > Merge with Content = Yes
– Site Logo = White with transparent background
– Display Rules = Front Page
Element #3 > Header > Site Header > Merge with Content = No
– Mobile Header Logo = Black logo with transparent background
– Display Rules = Entire Site; Exclude = Front Page
Customizer > Colors > Header > Background = White
Customizer > Colors > Primary Header > Background = White
I think that covers everything on me setup. Hope that helps.
And as always, you are a magician Leo. Thank you!
Now to sort out the logo size. Looks odd on my smallish smartphone versus testing in Chrome Mobile tools.
IanMay 20, 2020 at 8:28 pm #1294689
- You must be logged in to reply to this topic.