With the availability of low cost WordPress hosting, numerous WordPress blogs have sprung up in the recent years. Most bloggers know that splitting posts into pages is one way of increasing pageviews, decreasing bounce rate, and increasing CTR. In this post, I will describe how to add post pagination in Genesis Theme Framework with WP-PageNavi plugin and style it with WP-PageNavi Style plugin. StudioPress‘s Genesis Theme Framework offer some of the professionally designed WordPress themes and templates. Genesis Theme Framework is one of the most feature-full theme platforms available to run WordPress. Impressed with its features and customizability, we moved LinuXplained to Genesis Lifestyle theme in June 2012. Since moving to Genesis, our traffic has continually increased. Of course, we made other improvements as well but premium paid themes do have several benefits that will help your site in the long run. While most Genesis theme customizations are fairly easy, some require a bit of work. One such task is adding post pagination even while using WP-PageNavi plugin. If you prefer to add post pagination without using a plugin, check this post.
You may also like read:
Step 1: Adding Post Pagination
Genesis Theme Framework supports post page numbers by default. You can split pages by adding <!--nextpage--> where you want the split to occur. However, the post pagination is displayed at the bottom of the post on the left side. Furthermore the default style may not suit your needs. WP-PageNavi and WP-PageNavi Style plugins address these issues. However, the problem is making WP-PageNavi plugin work in Genesis Theme Framework requires a little bit of code editing.
First, install and activate WP-PageNavi and WP-PageNavi Style plugins. Next review the default settings for WP-PageNavi:
WP-PageNavi Default Settings
You will find that post page numbers are not being displayed in multi-page posts. In order to make post pagination appear, you will have to edit post.php under /wp-themes/genesis/lib/structure/. I recommend creating a backup before you edit the file. Open post.php and find the following line within the function genesis_do_post_content:
Repace it with the following line:
wp_pagenavi( array( 'type' => 'multipart' ) );
You should now see page numbers displayed at the end of the post on the left side. You can move the above line within the genesis_do_post_content function to change the location of the post page numbers. An example is shown in my other post, which also shows how to insert custom affiliate banner or content between post content and post pagination. Note that this example uses the default post pagination feature and not WP-PageNavi. Just replace the wp_link_pages function with wp_pagenavi function as explained above.
WP-PageNavi Default Style
Step 2: Style Your Post Page Numbers
Unlike using the default post pagination feature where you will have to style the page numbers manually, styling WP-PageNavi page numbers is extremely simple using the WP-PageNavi Style plugin. This plugin offers several preset styles that may actually work for you. If not, it also offers you the flexibility to play with the styling to fit your needs.
WP-PageNavi Style Settings
If you are satisfied you are good to go. But if you are like me and prefer not to use a plugin just for styling the page numbers then there is one more step you could do. Once you have selected a style for your post page numbers, go to /wp-content/plugins/wp-pagenavi-style/css/ folder and open the .css for the style you selected. Copy the entire contents of the file to your clipboard. Then open the /wp-content/plugins/wp-pagenavi/pagenavi-css.css file, delete all existing lines, copy the contents of the clipboard to the file, save, and exit. You may now uninstall WP-PageNavi Style plugin and keep just the WP-PageNavi plugin. What this does is it basically makes the style you selected the default style of the WP-PageNavi plugin.
Recommended Reading:
You may also choose to implement post page numbers without a plugin instead. Hope this helps! Go ahead and add post pagination to your site to increase pageviews.
| Free E-Book: Build Your Own WordPress Site Guide | |
|
Last Updated: February 13, 2013 |
|
About Anand Subramanian
Given that it’s a really bad idea to edit the core framework files, do you know of a way to accomplish the same thing using hooks?
Sure. You can accomplish something similar by including the PHP code (at the end of the post) in after_post_content hook. Having Genesis Simple Hooks plugin will make it easy. Make sure you check “Execute PHP on this hook?” option. Again, the placement will be a little bit different.
I did it the way I did to have more control over and customize the placement.
First off, thank you so much for the very informative article. However, when I tried doing this both in entering the code directly as well as through genesis simple hooks nothing seemed to happen. I’m using the Enterprise child theme on top of genesis. Any recommendations? Thanks!