Archived topic
Move post navigation
15 replies · Started by recchia on October 13, 2017
Hi,
I'm using gp with elementor.
I need to move the posts navigation from the bottom of the page, to the middle (exactly on top of the blu stripe "DETTAGLI".
How can i do this for all posts?
Thanks!
Tried cutting this code from the "inspect" of chrome:
<nav id="nav-below" class="post-navigation">
<span class="screen-reader-text">Navigazione articolo</span>
</nav>
And pasted where i want, but I'm not sure this is the right way to proceed. Also, i don't know if works for all pages or not...
Hi there,
Sorry we didn't get back to you sooner! Not sure how this slipped through.
Something like this would be pretty difficult unfortunately. You could try adding the post navigation in a shortcode:
add_shortcode( 'post_navigation', 'tu_post_navigation_shortcode' );
function tu_post_navigation_shortcode() {
ob_start();
if ( function_exists( 'generate_content_nav' ) ) {
generate_content_nav( 'nav-below' );
}
return ob_get_clean();
}
Then use [post_navigation] where you want it to show up.
Totally untested, but should work in theory :)
Thank you so much Tom!
This code works without problems but now i have 2 navigation posts. One is generated by your shortcode and the second one is the original located under the footer.
If i try to hide the one under the footer with this code:
.post-navigation {
display: none;
}
both navigation posts disappers.
I think this happen due to the same name (.post-navigation)
There is a way to hide the whole white bar under the footer without refer to ".post-navigation"?
Once again, thaks
Try this:
footer.entry-meta {
display: none;
}
Hi Leo,
Problem solved, thank you!
Great support as ever.
Regards
Glad we could help!
Oh sorry,
but I forgot to tell you that under 1069px of width the ".post-navigation" bar wraps.
How can I let both buttons on the same line?
Thanks
Not sure what you mean? I don't see the post navigation anymore?
At the moment, posts navigation is not jet on all pages.
On this page (http://80.88.87.158/plesk-site-preview/cilentospa.it/80.88.87.158/vasca/) the shortcode is active, so u can see that in mobile version, the right button goes under the left one.
Screenshot 1: https://i.imgur.com/0QCQ5xV.png
Screenshot 2: https://i.imgur.com/qt9wpsH.png
Screenshot 3 (smartphone): https://i.imgur.com/qa2lJd2.jpg
Seeing "screenshot 3" i think the problem is due to the long name of buttons, but in the first screenshot there is still room between buttons. I don't think is fault of long name buttons.
What should I do?
How can I change the name of buttons? maybe with "next" and "previous" ?
Thank you for the patience
I'm not seeing the post navigation as you are showing in the screenshots?
Did you remove them?
Give this CSS a try:
.post-navigation .nav-previous {
float: left;
}
.post-navigation .nav-next {
float: right;
}
No... now is on all pages...
This are some pages, are you seeing it correctly?
http://80.88.87.158/plesk-site-preview/cilentospa.it/80.88.87.158/vasca/
http://80.88.87.158/plesk-site-preview/cilentospa.it/80.88.87.158/secchiello-mozzarella/
http://80.88.87.158/plesk-site-preview/cilentospa.it/80.88.87.158/bicchiere-burrata/
http://80.88.87.158/plesk-site-preview/cilentospa.it/80.88.87.158/busta-microonde/
I really don't know what's happening...
Maybe I don't understand - what's the issue exactly? Now the link are on the left and right side of the page. Are they displaying on pages they shouldn't be or something?
Thanks! That code works.
Regards