Black Friday Sale! Get $20 off GP Premium, $40 off our new Lifetime license, and 45% off license renewals/extensions! Learn more

[Resolved] Change Mobile Site Header Based on Page

Home Forums Support Change Mobile Site Header Based on Page

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #450617
    Marty

    I created a custom site header for desktop and iPad using the excellent instructions in this forum post:

    Change Site Header and Title – based on page

    Is it possible to change the mobile site header as well for individual pages? I need to change out the site logo on one page of a client’s site. The desktop version is black-on-white. The mobile version of the logo is white-on-black, so we need to use two different versions of the logo.

    Thank you in advance for your help.

    GeneratePress 2.0.1
    GP Premium 1.5.6
    #450652
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    I’m not too sure what you mean – currently everything looks great?

    Is there a specific page I should be looking at?

    #450917
    Marty

    Hi, Tom,

    Thank you for the prompt reply.

    The page you saw should be the correct one. I need a separate mobile NDB logo to display on that page as well when the viewport is mobile sized. Currently, the Add. logo displays and that’s not what my client wants.

    Is there some additional code I need to add to this to make that work? This snippet worked great.

    <?php
    global $post;
    $image = get_post_meta($post->ID, 'custom_header', true);
    if ( ! empty( $image ) ) : ?>
          <img src="<?php echo $image; ?>" alt="" />
    <?php else : ?>
          <img src="URL TO MY DEFAULT LOGO" alt="" />
    <?php endif; ?>

    Thanks!

    #450951
    Tom
    Lead Developer
    Lead Developer

    You can switch out the mobile header logo using a filter and conditions like this: https://docs.generatepress.com/article/generate_mobile_header_logo/

    Let me know if that helps or not 🙂

    #451003
    Marty

    Thanks, Tom. It’s not a category/archive page, though. It’s a regular old page being used as a category. How would I modify the filter for a single page? Thanks again, sir.

    #451016
    Leo
    Staff
    Customer Support

    Hi there,

    Something like this should help: https://docs.generatepress.com/article/using-hooks-conditional-tags/#static-pages

    Click See more info on A PAGE Page to see examples on targeting a specific page.

    #454503
    Marty

    Tom, Leo, thank you for your help. I added the filter to the functions.php file. I modified the code a tiny bit from the generate_mobile_header_logo documentation, changing is_category to is_page. For others with this need, here is my revised snippet:

    // Add custom page mobile logo
    add_filter( 'generate_mobile_header_logo','lh_category_mobile_header_logo' );
    function lh_category_mobile_header_logo( $logo ) {
        
        // Return our single page logo URL
        if ( is_page( 64597 ) ) {
            return 'https://www.YOUR-URL-HERE.com/wp-content/uploads/2017/9/mobile-header-0915-200x62.png';
        }
    
        // Otherwise, return our default logo
        return $logo;
    }
    // end filter

    Thanks again for your help.

    #454641
    Leo
    Staff
    Customer Support
Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.