[Support request] Single page custom header – Logo on mobile

[Jonathan]

Hi !
Please have a look at the temp URL provided.

Created a custom page header for a homepage. Assigned the custom page header to the page & put a new logo in there so it overwrite the site-wide logo defined in the customizer. (To basically achieve a transparent header homepage)

However, if you look at the page on mobile, the custom logo for the homepage gets overwritten by the mobile logo. Is there a way we can keep the custom logo for the homepage also on the mobile view ? (which would basically be the same white logo as the full desktop version).

Also, how can this CSS be applied only to the homepage ?
.main-navigation .main-nav ul li a, .menu-toggle {
color: #ffffff;

THanks !

[Jonathan]

Sorry here’s the new URL :
http://40f30504.ngrok.io/

[Leo]

Hi there,

The link isn’t working for me. Can you double check?

To target home page only, try:
.home .main-navigation .main-nav ul li a, .menu-toggle

[Jonathan]

new url : best.igrhost.com

[Leo]

Hmm try this filter:

add_filter( 'generate_mobile_header_logo', 'lh_home_page_logo' );
function lh_home_page_logo() {
    if ( is_front_page() ) {
        return 'URL TO HOME PAGE LOGO';
    }

    return 'URL TO SITE-WIDE LOGO';
}

Adding PHP: https://docs.generatepress.com/article/adding-php/

[Author]

Posts