[Resolved] Make site title sticky with sticky navigation

Home Forums Support [Resolved] Make site title sticky with sticky navigation

Home Forums Support Make site title sticky with sticky navigation

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
  • #2594663


    I’m using a sticky navigation, but the site title disappears as soon as it switches to sticky navigation. Can I make it part of the sticky navigation?


    Customer Support

    Hi there,

    Any chance you can link us to the page in question?

    You can use the private information field:

    Let me know 🙂


    thanks for your reply. Sorry, I had lost track of the topic – but still need help on the issue.

    What I want is .main-title to be part of the sticky navigation, so it stays visible with the navigation when scrolling down.
    I am adding a link to the page mockup in the private info as suggested.

    Thank you!

    Customer Support

    Hi Ben,

    Try adding this Snippet:

    add_filter( 'generate_sticky_navigation_logo_output', function( $output ) {
        $title = '<div class="sticky-navigation-title">Your Title Here</div>';
        return $output . $title;
    } );

    Insert your title in the code.

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


    Thanks for the quick answer.
    I’ve tried and see no change.

    I installed the Code Snippets plugin, added the snippet, told it to run everywhere, see here: Code Snippet

    [Edit] I’ve tried to add an imgur-Link with a screenshot of my code snippet, seems not to work. Anyway, I’ve done as explained.

    Customer Support

    Hi there,

    Fernandos code will only work if the sticky nav has a logo. Instead you can:

    1. Add this PHP:

    add_action('generate_inside_navigation', function(){
    	<div class="sticky-brand site-branding">
    	<p class="main-title" itemprop="headline">
    		<a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a>

    It will return the site title you have in your Customizer.

    2. Add this CSS:

    .sticky-brand .main-title a {
    	font-size: inherit;
    	font-weight: inherit;
    .sticky-brand {
    	margin-right: auto;
    .main-navigation:not(.is_stuck) .sticky-brand  {
    	display: none;

    Exactly what I wanted, works perfectly!

    Thank you.

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