Site logo

Archived topic

How i add tagline below logo in primary nav :)

8 replies · Started by Mohit on July 13, 2018

Viewing posts 1–9 of 9

Hi guys, I want to add tagline below logo in "primary nav" and align tagline center below logo.. I see there's no option to add tagline below logo. Thanks

I also want tagline to be there in mobile header below logo

Hey leo, is there any filter that can be used for this?

So you want static text below your current navigation logo? Any examples?

You could try this:

add_filter( 'generate_navigation_logo_output', 'tu_nav_logo_tagline' );
function tu_nav_logo_tagline( $output ) {
    if ( ! function_exists( 'generate_menu_plus_get_defaults' ) ) {
        return $output;
    }

    $settings = wp_parse_args(
        get_option( 'generate_menu_plus_settings', array() ),
        generate_menu_plus_get_defaults()
    );

    return sprintf(
        '<div class="site-logo sticky-logo navigation-logo">
            <img class="header-image" src="%1$s" alt="%2$s" />
            <div class="nav-tagline">
                Your tagline
            </div>
        </div>',
        esc_url( apply_filters( 'generate_navigation_logo', $settings['sticky_menu_logo'] ) ),
        esc_attr( apply_filters( 'generate_logo_title', get_bloginfo( 'name', 'display' ) ) )
    );
}

Thanks Tom, that's what I wanted.. Thanks Leo as well :)

But it's not visible on mobile.

You can do something similar with the mobile header:

add_filter( 'generate_mobile_header_logo_output', 'tu_mobile_header_logo_tagline' );
function tu_mobile_header_logo_tagline( $output ) {
    if ( ! function_exists( 'generate_menu_plus_get_defaults' ) ) {
        return $output;
    }

    $settings = wp_parse_args(
        get_option( 'generate_menu_plus_settings', array() ),
        generate_menu_plus_get_defaults()
    );

    return sprintf(
        '<div class="site-logo mobile-header-logo">
            <a href="%1$s" title="%2$s" rel="home">
                <img class="header-image" src="%3$s" alt="%4$s" />
                <span class="nav-tagline">
                    Your tagline
                </span>
            </a>
        </div>',
        esc_url( apply_filters( 'generate_logo_href' , home_url( '/' ) ) ),
        esc_attr( apply_filters( 'generate_logo_title', get_bloginfo( 'name', 'display' ) ) ),
        esc_url( apply_filters( 'generate_mobile_header_logo', $settings['mobile_header_logo'] ) ),
        esc_attr( apply_filters( 'generate_logo_title', get_bloginfo( 'name', 'display' ) ) )
    );
}

Thanks it worked!! I just noticed logo in nav menu is not clickable. how can i make it clickable? Thanks

I edited the code you provided I hope I have made no silly mistake here

add_filter( 'generate_navigation_logo_output', 'tu_nav_logo_tagline' );
function tu_nav_logo_tagline( $output ) {
    if ( ! function_exists( 'generate_menu_plus_get_defaults' ) ) {
        return $output;
    }

    $settings = wp_parse_args(
        get_option( 'generate_menu_plus_settings', array() ),
        generate_menu_plus_get_defaults()
    );

    return sprintf(
        '<div class="site-logo sticky-logo navigation-logo">
			<a style="color:#3A3A3C;" href="%1$s" title="%2$s" rel="home">
            <img class="header-image" src="%3$s" alt="%4$s" />
			<div class="nav-tagline">
                Professional, Trustworthy, Honest.
            </div>
			</a>
        </div>',
		        esc_url( apply_filters( 'generate_logo_href' , home_url( '/' ) ) ),
        esc_attr( apply_filters( 'generate_logo_title', get_bloginfo( 'name', 'display' ) ) ),
        esc_url( apply_filters( 'generate_navigation_logo', $settings['sticky_menu_logo'] ) ),
        esc_attr( apply_filters( 'generate_logo_title', get_bloginfo( 'name', 'display' ) ) )
    );
}

add_filter( 'generate_mobile_header_logo_output', 'tu_mobile_header_logo_tagline' );
function tu_mobile_header_logo_tagline( $output ) {
    if ( ! function_exists( 'generate_menu_plus_get_defaults' ) ) {
        return $output;
    }

    $settings = wp_parse_args(
        get_option( 'generate_menu_plus_settings', array() ),
        generate_menu_plus_get_defaults()
    );

    return sprintf(
        '<div class="site-logo mobile-header-logo">
            <a href="%1$s" title="%2$s" rel="home">
                <img class="header-image" src="%3$s" alt="%4$s" />
                <span class="nav-tagline">
                    Professional, Trustworthy, Honest.
                </span>
            </a>
        </div>',
        esc_url( apply_filters( 'generate_logo_href' , home_url( '/' ) ) ),
        esc_attr( apply_filters( 'generate_logo_title', get_bloginfo( 'name', 'display' ) ) ),
        esc_url( apply_filters( 'generate_mobile_header_logo', $settings['mobile_header_logo'] ) ),
        esc_attr( apply_filters( 'generate_logo_title', get_bloginfo( 'name', 'display' ) ) )
    );
}

Looks good! :)

This archived topic is closed to new replies.