Naked Header with Revolution Slider -Light Logo Not Showing on FireFox or IE

[n2business]

Ed, thank you for providing that build!!!! It fixed almost all of my issues.

Here is the feedback:
1) The light logo now correctly appears in Chrome, IE, FireFox and Safari, as well as on the iPad. (thank you!!!)

2) However, on an iPhone and Samsung Galaxy 3 (small mobile), The logo now incorrectly shows the light logo instead of the dark version on the landing page.

3) I was able to remove the custom CSS code previously provided by Rui and the header areas still correctly appears above the slider content on the iPhone and Galaxy (the only issue being that the light logo appears instead of the dark on the small mobile). (thank you!)

The attached images shows the light logo appearing on the iPhone and Samsung 3, instead of the light logo.

You have been a tremendous help and we greatly appreciate you!

Attachments:

You must be logged in to view attached files.

[Rui Guerreiro – SUPPORT]

Hi,

Add the code below to your custom css.

@media only screen and (max-width: 991px){
#logo img.dark-logo {
display: block!important;
}
.naked-header.naked-light #logo.has-light-logo img.light-logo {
display: none!important;
}
}

-Rui

[n2business]

Thanks, Rui.

(1) That resulted in iPhone logo correctly showing the dark logo above the rev slider.

(2) Now the iPad logo is incorrectly showing the dark logo over the rev slider (using a naked header)

Attachments:

You must be logged in to view attached files.

[Rui Guerreiro – SUPPORT]

In the css I provide change in the first line the value 991px to 767px

Hope it works.

-Rui

[n2business]

Rui, Thank you…that seems to have fixed the logo issue. While I have you, let me ask two questions:

(1) Will this fix be in the next update, so I could then remove the custom CSS code? I like to keep these to as few as possible, to avoid issues.

(2) While I have your ear, I am also running into an issue where the logo is appearing in different locations on different pages of my website. On some pages, it looks as if the “full width header” is being used, when that option is turned off in theme options. I don’t want those pages to have the logo and menu go the width of the page. I want them to be the same as the other pages. I’ve attached screen shots of how it appears on some pages and how it should appear.

Can you help with this?

Thank you!!

Attachments:

You must be logged in to view attached files.

[n2business]

Sorry, it seems to have been a plugin conflict. I deactivated the minify and cache plugins and the alignment seems to have righted itself.

Thank you for all of the help!!

[Rui Guerreiro – SUPPORT]

Sure no problem.
-Rui

[n2business]

I apologize, but I thought these were resolved. It seems that something else has popped up regarding the duplication of the logo on mobile (iPhone). The logo does not appear in duplicate on my home page (with rev slider). But every other page on my site does show a duplicate logo.

Below is the code that fixed the light/dark logo issue, but after adding that, is when the duplicate logo started appearing on the iPhone for pages other than my home page. (Note: the issue is not occurring on iPad size)

@media only screen and (max-width: 767px){
#logo img.dark-logo {
display: block!important;
}
.naked-header.naked-light #logo.has-light-logo img.light-logo {
display: none!important;
}
}

Attachments:

You must be logged in to view attached files.

[Rui Guerreiro – SUPPORT]

Guess something is wrong in my css can you provide me admin access?
Thanks

-Rui

[n2business]

This reply has been marked as private.

[Rui Guerreiro – SUPPORT]

Hi,

Can you clear the cache and check again?

-Rui

[n2business]

Hey, Rui
Removing the main logo didn’t work for my site set-up – I had been following the other thread where this worked for another user today.

For me, it resulted in the light logo appearing on home page, which has naked header and dark rev slider, but it also put the wordpress site name from settings above the logo (see attached screenshot). As well, when I look at other pages, it only has the wordpress site name and no logo. So, that didn’t work.

I did add the logo back. Still seeing the duplicate logo on iphone, as per previous screenshots.

Thanks for continuing to look into this.

Attachments:

You must be logged in to view attached files.

[n2business]

This may be a caching issue, but even with adding the main logo back in, I still just see the WP settings site name many pages. I did clear my browser cache twice and still see it.

[Swift Ideas – Ed]

Hi @n2business

Apologies – you shouldn’t have to hide any logo with css – it should all be handled by the theme.

If you keep the standard logo, and remove the css from above, what is the issue? If you can let me know I’ll be sure to sort that asap for you.

– Ed

[n2business]

Hi, Ed.
I’ve removed the custom CSS and seem to back to a sort of baseline.

ISSUE: The issue is that on an iPhone and Samsung Galaxy 3 (small mobile), The logo incorrectly shows the light logo instead of the dark logo on the landing page.

POSSIBLE CONTRIBUTING FACTOR: The home page uses a naked header, with a dark revolution slide using the meta option. On a desktop, the correct logo toggling occurs – light logo on dark background. However, on a mobile, when the logo slides above the revolution slider (which is fine), it seems that it still triggers the light logo, instead of the regular logo.

This doesn’t occur on the other pages using iPhone. Note that none of the other pages use a naked header or revolution slider.

Thanks!

Attachments:

You must be logged in to view attached files.