Community Forums › Forums › Archived Forums › Design Tips and Tricks › How do I add pagination (previous post, next post links) to blog
- This topic has 31 replies, 6 voices, and was last updated 8 years, 8 months ago by camscorner.
-
AuthorPosts
-
February 10, 2015 at 1:20 pm #140366[email protected]Member
Hello,
How do I add pagination to my blog posts? I would like readers to be able to click next post or previous post links on individual blog posts. I am using the daily dish pro theme.
http://Thesweetandthesalty.comMay 30, 2015 at 3:59 pm #154219sandhilldesignsMemberActually, I have this question, too. I'm using the Focus Pro theme.
May 30, 2015 at 5:49 pm #154228emasaiParticipantIt is already activated, on the actual blog post not on the blog roll. If you scroll down to the bottom of your actual post you will see a link to Previous Posts. You probably don't have enough content to show Next Post.
If you want to change this to a numeric format, go to Genesis > Theme Settings and scroll down to Content Archives, there is the option there to choose how posts are displayed, excerpt or full content, with or without featured image, size of that image and it's position and the Previous/Next or Numeric pagination option.
Need Website Customization or a Responsive CSS fix? Contact Me
Lynne emasai.comMay 30, 2015 at 6:36 pm #154231sandhilldesignsMemberSorry, no. Thought of that. I have 4 posts up and I'm not seeing it on any of the Post pages. I can take a screenshot if that helps. It's not public yet, so don't want to share the link.
It is showing the "filed under: " at the bottom of each post, though. And the date and author are under the entry title.
I have Simple Share Button Adder plugin running, if you think that might be interfering.
I guess it's not a huge deal, but it would be nice if this could work.
Thanks!!!
May 30, 2015 at 10:16 pm #154239Genesis DeveloperMemberAdd this in your functions.php file
// Add post navigation add_action( 'genesis_after_loop', 'genesis_prev_next_post_nav' );
May 31, 2015 at 7:59 am #154254sandhilldesignsMemberBingo!! Thank you very much!
July 7, 2015 at 7:20 am #158654camscornerParticipantJust what I needed as well. Thanks, Genesis Developer. 🙂
July 7, 2015 at 7:54 am #158662camscornerParticipantOkay, I spoke too soon. This worked great on my Lifestyle Pro theme but when I tried to apply it to another blog with the Whitespace Pro theme it placed the navigation links in the middle of the post on either side of the post (instead at the bottom of the post).
How do I fix it to be placed at the bottom? Thanks for any help.
July 12, 2015 at 11:11 am #159169camscornerParticipantAny help on this?
July 13, 2015 at 1:48 pm #159302sandhilldesignsMemberCan you post a url?
July 13, 2015 at 2:22 pm #159308camscornerParticipantSo sorry - boomer brain taking effect again. 😉 It's http://simplystatedhealthcare.com
July 13, 2015 at 2:55 pm #159314sandhilldesignsMemberAre you comfortable working in style.css?
Line 1300 in style.css shows the style markup for pagination-next, pagination-previous. It fixes that arrow to the page and places it 45% from the top. Play around with the numbers, or disable the position:fixed, to change it up.
If you're still stumped let me know.
July 14, 2015 at 6:42 am #159367camscornerParticipantI'm only comfortable when someone gives me the code to paste into style.css - which basically means I'm a total novice but not phobic. 😉
Ideally, I'd like it after the post ends (before Comments) but under Comments is okay, too. That's where it is placed on my other blog. http://millercathy.com
Thank you!
July 14, 2015 at 11:05 am #159398sandhilldesignsMemberOk, if you're working in the editor you'll have to use cntrl-F (or whatever triggers the search feature in your browser and operating system) to look for:
.pagination-next,
.pagination-previous {
position: fixed;
top: 45%;
}Try changing it to this (it will disable the code, but not erase it, in case you want to use it again):
.pagination-next,
.pagination-previous {
/* position: fixed;
top: 45%;
*/
}Then see what it looks like.
However, I'm noticing that this next/previous pagination is not for an individual post, but for a category page. I'm not actually seeing a next/previous arrow on a post page. Did you add the PHP code above to the function.php file?
July 14, 2015 at 3:01 pm #159413camscornerParticipantI removed the following PHP code after it wasn't working ~
// Add post navigation
add_action( 'genesis_after_loop', 'genesis_prev_next_post_nav' );After receiving your latest suggestion, I put it back in and tried different percentages with no success. I tried 10% to 100% and nothing changed. And it stays fixed as you scroll (which is not surprising as that's in the code after "position" but I don't know how to change that).
I've changed everything back to the original code. Other suggestions? I really appreciate your patience with this novice. 🙂
July 14, 2015 at 6:27 pm #159421sandhilldesignsMemberIf I could look under the hood I might be able to figure it out. I'm not sure what else to suggest. Sorry!
July 15, 2015 at 12:11 am #159448sree ramojuMembereven i am thinking about this puglin
July 15, 2015 at 10:43 am #159485camscornerParticipantI appreciate your efforts. I may try to find a plugin that can override whatever funky thing is going on. 😉
August 6, 2015 at 2:55 pm #161631camscornerParticipantI am trying one more time to get help because I have not been able to figure this out or get a plugin to work with it.
RECAP - I am using Whitespace Pro theme (http://simplystatedhealthcare.com)
1. The Homepage shows posts and has page navigation to navigate to the next page of posts by means of a left and right arrow on the page about midway on the Homepage.
2. I am trying to get navigation in the individual posts that takes the reader to the next or previous post. Even though this is standard in WordPress, it is not showing up.
3. Per this thread, I added the following to the funtions.php
// Add post navigation
add_action( 'genesis_after_loop', 'genesis_prev_next_post_nav' );4. That works as far as adding the navigation but it fixes it in the middle of the page (same navigation as homepage). I'll leave it there for awhile so you can see what I am talking about ===> http://simplystatedhealthcare.com/health-care-bad-relationship/
5. Next, I tried adding the code suggested by sandhilldesigns (shown below) and played with the percentages (replacing the 45%). Nothing changed the placement of the pagination text.
.pagination-next,
.pagination-previous {
/* position: fixed;
top: 45%;
*/
}I'm at a total loss. Any suggestions to this novice would be greatly appreciated.
August 6, 2015 at 3:45 pm #161645camscornerParticipantLook on the left - the text that says...Physical Throwdown: Smartphones vs Wearables
http://simplystatedhealthcare.com/wp-content/uploads/2015/08/Post-pagination.jpg
-
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.