(Updated) Creating a Serial Novel in WordPress

In a previous post, I explained how I setup WordPress to run a serial novel. Since WordPress 3.8 was released, I had to modify the setup and simplified the posting process with a little extra CSS work on the back-end.

I’m still using the Kingsize theme (currently v4.1.3) running WordPress 3.8.

I am now only using two plugins:

  • ‘WP Post Navigation’ by Anas Mir.
  • ‘List category posts’ by Fernando Briano.

‘Serial Posts Plugin’ by Ade Walker was removed because it required metadata manually entered on each post. When 3.8 updated, my custom fields disappeared so I could no longer use it. I modified the other two plugins to replicate the results of ‘Serial Posts Plugin.’

27 July 2014 – Since the original post date, the WP Post Navigation author has updated the plugin and you can now simply click ‘Reverse Navigation’ in the settings to achieve the same affect as the instructions in red below. I don’t know if it was my blog post, but I thank the author for adding the functionality.

[Outdated – Ignore]

The first thing I needed to do is flip the previous and next post settings in ‘WP Post Navigation.’ In standard blog posts, the ‘Next’ post link is usually on the left and the ‘Previous’ on the right. Since this is a story, I needed the opposite, the ‘Next Chapter’ should be on the right and the ‘Previous Chapter’ on the left.  To do this, I needed to swap the variables in the wp-post-navigation.php. Here is the part of the code. I bolded the text I changed. Just swap pre and next.

function WP_Pre_Next_Navigation_Bottom($content)
 {
 if(is_single())
 {
 switch($this->options['position']){
 case "both":
 case "bottom":
 return $content.'<div class="wp-post-navigation">
 <div class="wp-post-navigation-pre'.$this->img.'">
 '.$this->next_navigation.'
 </div>
 <div class="wp-post-navigation-next'.$this->img.'">
 '.$this->pre_navigation.'
 </div>
 </div>';
 break;
 }
 }
 return $content;
 }

[/Outdated – Ignore]

In the settings for ‘WP Post Navigation,’ make sure Navigate Within Category is checked. My blog is one category. Portal is another category. The next book will be in a different category. This setting will keep the next and previous post within the same category so only the chapters from the current book or blog will display.

Previously, the Serial Posts plugin was used to display chapter on the right hand side of each chapter page. Now, I use ‘List category posts’ to do this. I had to make a couple of changes, mostly in CSS. In the options, change Number of Posts to -1. This will allow you to display all your chapters. On the table of contents post and the right column widget use:

‘catlist categorypage=”yes” order=asc’ (Use the [ ] instead of the ‘ ‘)

The ‘categorypage=”yes”‘ will keep the list as the same category as the post and the ‘order=asc’ will reverse the typical order of blog posting, displaying oldest posts (earliest chapters) first.

Although this is not required, I added CSS to make the list more visually appealing. Click Appearance -> Edit CSS (I add it here so it will not erase if the plugin is updated. For some of the changes above, I have to update the plugin code again if it updates. I should just write my own plugin but that will take time.)

.lcp_catlist li {
 list-style-type: none;
}
#content ul li {
 margin-left: -20px;
}
.lcp_catlist li.current {
 font-weight: 900;
 margin-left: 20px;
}

‘list-style-type: none’ removes the dots in front of list items, in this case, each chapter. ‘margin-left: = -20px;’ moves the table of contents slightly to the left.  ‘font-weight:900’ and ‘margin-left: 20px’ makes the current chapter on the list stand out slightly.

I hope this helps anyone else trying to setup a WordPress serial novel website.

4 Comments on (Updated) Creating a Serial Novel in WordPress

Leave a Reply

Your email address will not be published. Fields marked with * are required