[Resolved] Change Logo and URL on specific pages

Home Forums Support Change Logo and URL on specific pages

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • #742249
    melanie

    I am doing a large site. It has the main section (main logo and url) and 9 sections each with its own community logo and url. The client would like each community to have its own logo and url in place of the main logo/url. The main navigation stays the same across the site.
    Although I can build custom headers with Beaver Themer it will be a pain dealing with transparent headers, changing logos on scroll, and mobile headers/menus and all the css. I want to use GP menu for the main menu and NOT BB menu or UABB menu modules as they are not as accessible as the GP menu.
    Before I go down that road I wanted to ask you if generate_logo_href is a better solution?
    I am looking for the simplest solution which will automatically apply the correct logo / url to all child pages and the community home page.
    If it is can you give some sample code?
    It seems it would be much simpler to do this via a custom function or template than 10 custom headers.

    GeneratePress 2.2.1
    GP Premium 1.7.5
    #742294
    melanie

    Update:
    I was able to figure it out partways on http://wesleywoods.staging.wpengine.com/branan-towers/
    Here is the code

    //Branan Towers Header Logo
    add_filter( 'generate_mobile_header_logo','bt_category_mobile_header_logo' );
    function bt_category_mobile_header_logo( $logo ) {
        
        // Return our category logo URL
        if ( is_page( 'branan-towers' ) ) {
            return 'http://wesleywoods.staging.wpengine.com/wp-content/uploads/2018/08/Wesley-Woods-Branan-Towers-logo.png';
        }
    
        // Otherwise, return our default logo
        return $logo;
    }
    add_filter( 'generate_logo_href','generate_add_custom_logo_href' );
    function generate_add_custom_logo_href()
    {
    if  (  is_page( 'branan-towers' )) {
            return 'https://wesleywoods.staging.wpengine.com/branan-towers/';
        }
        
        return 'https://wesleywoods.staging.wpengine.com';
    }
    
    add_filter( 'generate_navigation_logo_output','mga_change_navigation_logo_output' );
    function mga_change_navigation_logo_output( $output ) 
    {
    	if  (  is_page( 'branan-towers' ))  {
    	return sprintf(
    		'<div class="site-logo sticky-logo navigation-logo">
    		<a href="https://wesleywoods.staging.wpengine.com/branan-towers/"><img class="header-image" src="http://wesleywoods.staging.wpengine.com/wp-content/uploads/2018/08/Wesley-Woods-Branan-Towers-logo.png" width="275" height="88"alt="Branan Towers" /></a>
    		</div>',
    		
    		esc_attr( apply_filters( 'generate_logo_title', get_bloginfo( 'name', 'display' ) ) )
    	);}
    }
    

    I’d like to make the urls on the links relative. What is the proper way to call in the site url in these functions?
    Also, the only thing I am missing the url change on mobile menu. Any help would be great.

    #742942
    Tom
    Lead Developer
    Lead Developer

    That’s definitely the right way to do it 🙂

    What do you mean by relative exactly? If I’m on the branan-towers page, where should the logo link to?

    #742981
    melanie

    Thanks for the reply. This is so awesome!
    1) I don’t like hardcoding the website url. (https://wesleywoods.wpengine.com) into functions.php. So perhaps calling the site url in place of https://wesleywoods.wpengine.com.? Not sure how to do that.

    2) My last issue is adding the page ancestors (or child) to the above code. All the child pages of each section will have the blue version of the logo (not the white logo for the transparent header) for desktop and mobile so I would need code similar to the above for that would handle all child pages (and sub pages of child pages) and call the correct logo.

    For example https://wesleywoods.wpengine.com/branan-towers -it has white logo with the transparent header but on scroll and mobile it has the regular logo.

    All child pages (and sub pages) of Branan need blue logo (no transparent header) for regular, scroll, and mobile.
    ex: http://wesleywoods.staging.wpengine.com/branan-towers/about/ will need the logo changed to Branan Towers logo, url changed.

    Any sample code would be great.

    #743314
    Tom
    Lead Developer
    Lead Developer

    1. You can use the site_url() function. For example:

    add_filter( 'generate_logo_href', function( $url ) {
        $site_url = site_url();
    
        if  (  is_page( 'branan-towers' )) {
            return $site_url . '/branan-towers/';
        }
        
        return $url; // Return the default.
    }

    It doesn’t look like there’s a function like is_page() for child pages, but you can try this:

    global $post;
    
    if ( 123 == $post->post_parent ) {
    
    }
    #744073
    melanie

    Post_parent won’t work because it only handles child pages not subpages of child pages. As a feature request I would love love the Page Parent and Page Ancestor added to the location. (Beaver Themer has this but I needed to use GP menu thus no Beaver Themer for the custom headers) I believe it is the get_ancestor function. I’ll try it out until I can get it. Right now I have to add each new page into the array in the functions file until I figure it out. https://codex.wordpress.org/Function_Reference/get_ancestors.

    The mobile menu is working, the nav menu is working on the custom logos but I couldn’t get the following to work so I had to manually choose the pages in Elements for the time being. You can see below an example of the page array and the need for the get_ancestors filter.

    add_filter( ‘generate_logo’,’wwsite_main_logo’ );
    function wwsite_main_logo( $logo ) {

    // Return WWN Community logo URL
    if ( is_page( array(44767,44780,45069,44793,44281,44278,44182,44789,44761,44275,44277,44778,44276,44762,44747,45032,45006,45014,45021,44028,44279) ) ) {
    return ‘https://wesleywoods.wpengine.com/wp-content/uploads/2018/10/Wesley-Woods-Newnan-logo-blue.png&#8217;;
    }

    // Otherwise, return the default logo
    return $logo;
    }

    #744319
    Tom
    Lead Developer
    Lead Developer

    Hmm, maybe try this:

    $ancestors = get_ancestors( get_the_ID(), 'page', 'post_type' );
    
    if ( is_array( $ancestors ) && in_array( 123, $ancestors ) ) {
        // If ID 123 is an ancestor
    }

    Let me know 🙂

    #747098
    melanie

    Awesome! I am almost there. You have been a great help. The custom functions I wrote for mobile and nav logo are both working but I can’t seem to get this custom function to apply to desktop. Do you see an error? Here is my code:

    //Change Main Logo on Branan Towers Sub Pages where 44304 is the page ID of the parent
    add_filter( 'generate_logo','wwsite_main_logo' );
    function wwsite_main_logo( $logo ) {
        $ancestors = get_ancestors( get_the_ID(), 'page', 'post_type' );
    // Return Branan Towers logo 
     if ( is_array( $ancestors ) && in_array( 44304, $ancestors ) ) {
            return 'http://wesleywoods.staging.wpengine.com/wp-content/uploads/2018/11/Wesley-Woods-Lanier-Gardens-Retina-blue.png';
        }
    
    // Otherwise, return the default logo
        return $logo;
    }
    

    Here is a sample of what is working:

    //Customize Mobile Logos for Branan Towers
    add_filter( 'generate_mobile_header_logo','ww_category_mobile_header_logo' );
    function ww_category_mobile_header_logo( $logo ) {
    $ancestors = get_ancestors( get_the_ID(), 'page', 'post_type' );
        
    // Return our branan logo URL
         if ( is_page( 'branan-towers' ) ) {
            return 'https://wesleywoods.staging.wpengine.com/wp-content/uploads/2018/08/Wesley-Woods-Branan-Towers-logo.png';
        }
        if ( is_array( $ancestors ) && in_array( 44304, $ancestors ) ) {
            return 'https://wesleywoods.staging.wpengine.com/wp-content/uploads/2018/08/Wesley-Woods-Branan-Towers-logo.png';
        }
    // Otherwise, return our default logo
        return $logo;
    }
    
    //Change Site Logo URL on Branan Community Pages
    add_filter( 'generate_logo_href','generate_add_custom_logo_href' );
    function generate_add_custom_logo_href() {
     //get ancestors
    $ancestors = get_ancestors( get_the_ID(), 'page', 'post_type' );
    
    if  (  is_page( 'branan-towers' )) {
            return 'https://wesleywoods.staging.wpengine.com/branan-towers/';
        }
        if ( is_array( $ancestors ) && in_array( 44304, $ancestors ) ) {
            return 'https://wesleywoods.staging.wpengine.com/branan-towers/';
        }
    return 'https://wesleywoods.staging.wpengine.com';
    }
    
    //Custom Navigation Logo Branan Towers
    add_filter( 'generate_navigation_logo_output','ww_change_navigation_logo_output' );
    function ww_change_navigation_logo_output( $output ) {
    $ancestors = get_ancestors( get_the_ID(), 'page', 'post_type' );
    	if  (  is_page( 'branan-towers' ))  {
    	return sprintf(
    		'<div class="site-logo sticky-logo navigation-logo">
    		<a href="https://wesleywoods.staging.wpengine.com/branan-towers/"><img class="header-image" src="http://wesleywoods.staging.wpengine.com/wp-content/uploads/2018/08/Wesley-Woods-Branan-Towers-logo.png" width="275" height="88"alt="Branan Towers" /></a>
    		</div>',
    		
    		esc_attr( apply_filters( 'generate_logo_title', get_bloginfo( 'name', 'display' ) ) )
    	);}
    //if page is an ancestor of branan towers change to BT logo and url
    if ( is_array( $ancestors ) && in_array( 44304, $ancestors ) )  {
    	return sprintf(
    		'<div class="site-logo sticky-logo navigation-logo">
    		<a href="https://wesleywoods.staging.wpengine.com/branan-towers/"><img class="header-image" src="http://wesleywoods.staging.wpengine.com/wp-content/uploads/2018/08/Wesley-Woods-Branan-Towers-logo.png" width="275" height="88"alt="Branan Towers" /></a>
    		</div>',
    		
    		esc_attr( apply_filters( 'generate_logo_title', get_bloginfo( 'name', 'display' ) ) )
    	);}
    }
    #747272
    Tom
    Lead Developer
    Lead Developer

    You’re using a retina logo, so you have to do this as well:

    add_filter( 'generate_retina_logo', function( $logo ) {
        if ( $something ) {
            return 'URL TO RETINA LOGO';
        }
    
        return $logo;
    } );
    #748134
    melanie

    That Did it! Combined with the site url posted above it all works like a charm!

    I am totally impressed by the level of support you provide.

    Melanie

    #748273
    Tom
    Lead Developer
    Lead Developer

    Thank you! Glad I could help 🙂

Viewing 11 posts - 1 through 11 (of 11 total)
  • You must be logged in to reply to this topic.