Last Updated:

Changing where the navigation is placed in Twenty Seventeen

masonbee
masonbee Wordpress

I has annoyed me for a while now that the Twenty Seventeen theme places the next/previous links at the bottom of the page under the comments. This stops people being able to easily see the next and previous articles, especially if there are comments.


Twenty Seventeen - Navigation2


Changing where the navigation is placed in Twenty Seventeen

Luckily it turns out they are quite simple to move. There is a file in the Twenty Seventeen theme called single.php that directs where things are on your post page. In that file there is this block of code.


Twenty Seventeen navigation code


Which looks terribly confusing but all it really says is run the next and previous post links and format them with a post title and an arrow. It looks pretty good and you don't have to change the code at all. Just copy and paste it into a different part of the file.

(You should only do this in a child theme. If you don't know what one is go here!)

So, having created your single.php file in your child theme, open it in a text editor and paste in the code from your parent theme. Identify the navigation block ( as you are better to copy and paste from your own theme in case there are problems with the code block above ) and copy it and paste it in a different place. Put a comment in to show what you have done above where you have pasted it. Comments start with //.

I left mine at the base of the comments and then placed a copy of the code under get_template_part( 'template-parts/post/content', get_post_format() ); which means there will be another previous/next link showing at the end of my post above the comments.


Twenty Seventeen - Navigation