[Resolved] Moving the post navigation above the entry header

Home Forums Support Moving the post navigation above the entry header

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #361744
    Sylvain

    Hi,

    I would like to know how to edit the post navigation in order to move it above the entry header.

    Thanks for the great theme and the support!

    Sylvain

    GeneratePress 1.3.48
    #361835
    Leo
    Staff
    Customer Support

    Hi there,

    Sorry I’m not quite getting this. So currently you have the navigation set at one location but you would like it to be a different location for single post only?

    Let me know.

    #362146
    Sylvain

    Exactly, for a single post I want to move the the navigation above the header. Precisely, to move <nav role=”navigation” id=”nav-below” class=”post-navigation”> above <header class=”entry-header”>. Here is my code structure:

    <div id="page" class="hfeed site grid-container container grid-parent">
      <div id="content" class="site-content">
        <div id="primary" class="content-area grid-parent mobile-grid-100 push-25 grid-75 tablet-push-25 tablet-grid-75">
          <main id="main" class="site-main">
            <article id="post-103" class="post-103 post type-post status-publish format-standard has-post-thumbnail hentry category-uncategorized" itemtype="http://schema.org/CreativeWork" itemscope="itemscope">
              <div class="inside-article">
                <header class="entry-header">
                  <h1 class="entry-title" itemprop="headline">Une autre petite image</h1>
                  <div class="entry-meta"> </div>
                  <!-- .entry-meta --> 
                </header>
                <!-- .entry-header -->
                <div class="page-header-image-single page-header-below-title grid-container grid-parent generate-page-header"> <img width="1200" height="800" src="http://sylvainvachon.com/wp-content/uploads/sites/3/2017/07/0022.jpg" class="attachment-full size-full" alt="" itemprop="image" srcset="http://sylvainvachon.com/wp-content/uploads/sites/3/2017/07/0022.jpg 1200w, http://sylvainvachon.com/wp-content/uploads/sites/3/2017/07/0022-300x200.jpg 300w, http://sylvainvachon.com/wp-content/uploads/sites/3/2017/07/0022-768x512.jpg 768w, http://sylvainvachon.com/wp-content/uploads/sites/3/2017/07/0022-1024x683.jpg 1024w, http://sylvainvachon.com/wp-content/uploads/sites/3/2017/07/0022-350x233.jpg 350w" sizes="(max-width: 1200px) 100vw, 1200px"> </div>
                <div class="entry-content" itemprop="text"> </div>
                <!-- .entry-content -->
                <footer class="entry-meta">
                  <nav role="navigation" id="nav-below" class="post-navigation">
                    <h6 class="screen-reader-text">Post navigation</h6>
                    <div class="nav-previous"><span class="prev" title="Previous">Previous <a href="http://sylvainvachon.com/2017/07/15/cest-le-debut-de-mon-blog-dillustration/" rel="prev">C'est le début de mon blog d'illustration</a></span></div>
                    <div class="nav-next"><span class="next" title="Next">Next <a href="http://sylvainvachon.com/2017/07/15/que-va-ton-devenir/" rel="next">Que va ton devenir?</a></span></div>
                  </nav>
                  <!-- #nav-below --> 
                </footer>
                <!-- .entry-meta --> 
              </div>
              <!-- .inside-article --> 
            </article>
            <!-- #post-## -->
            <div class="comments-area">
              <div id="comments">
                <div id="respond" class="comment-respond">
                  <h3 id="reply-title" class="comment-reply-title">Leave a Comment <small><a rel="nofollow" id="cancel-comment-reply-link" href="/2017/07/15/une-autre-petite-image/#respond" style="display:none;">Cancel reply</a></small></h3>
                </div>
                <!-- #respond --> 
              </div>
              <!-- #comments --> 
            </div>
          </main>
          <!-- #main --> 
        </div>
        <!-- #primary --> 
        <!-- #secondary --> 
      </div>
      <!-- #content --> 
    </div>
    

    Thanks!

    #362191
    Leo
    Staff
    Customer Support

    This filter should help: https://docs.generatepress.com/article/navigation-location/#generate_navigation_location

    The conditional tag you need is is_single()

    Let me know.

    #362477
    Sylvain

    This filter doesn’t help because it moves the primary navigation and in my case I want to move the previous and next post navigation.

    Do you have any clues?

    Thanks!

    #362798
    Tom
    Lead Developer
    Lead Developer

    Hmm, you could try this.

    1. Hide it with CSS:

    footer.entry-meta .post-navigation {
        display: none;
    }

    2. Add your own:

    add_action( 'generate_before_content', 'tu_move_post_navigation' );
    function tu_move_post_navigation() {
        if ( function_exists( 'generate_content_nav' ) && is_single() ) {
            generate_content_nav( 'nav-below' );
        }
    }

    Let me know if this helps or not 🙂

    #363225
    Sylvain

    This is working perfectly.

    Thanks alot for the highly customizable theme!

    #363280
    Tom
    Lead Developer
    Lead Developer
Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.