Wordpress Plugin : Multipage Toolkit
Yes, I have finally done it. I have added writing a wordpress plugin to my repertoire of skills. This is the first time I have ever released code for other people to use , so please be gentle.
This plugin has been written to overcome something that is a personal bugbear about Wordpress for me and that is its multiple page posts. The built-in function that provides pagination for posts is very limited and just does not give you the flexibility to find the perfect navigation system for your blog.
Wordpress as standard has the ability to paginate your posts, i.e. split very long posts over separate pages. You do this by using the <!–nextpage–> tag to create page breaks, the real shortfall of the built-in function is there is no way of adding titles or headings to these pages - something like index or content list, so readers can jump straight to specific areas - this is commonly seen on hardware review sites.
I wrote this plugin to try and improve this area and open up even more possibilities with Wordpress.
My plugin provides 3 functions.
- Add titles or headings to each page (using <!–pagetitle:–>)
- Display number of pages on index pages (TA_display_pages)
- Quick jump and title navigation options (TA_content_jump)
Very easy to use and very simple to integrate in to any theme.
Installation
- Download file (here)
- Unzip and place directory in to your “plugins” folder (/wp-content/plugins/)
- Activate plug-in through the admin panel
Change Log
Version 2.6 (5th Sept 2008)
Added auto insertion for Pages as well as Posts
Fixed issues with saving settings
Fixed html and code entry in to text boxes
Version 2.5 (10th July 2008)
SVN broke upload - uploading again
Version 2.4
Changed CSS style naming for the all page links
Version 2.3 (internal release)
Added option to have custom page seperators (including javascript for adverts) on single (ALL) page display
Added function call to use options page settings from inside the theme files
Fixed badly coded string matching (Thanks to Andrei for the fix)
Fixed spelling error in button registration process (Thanks to Jonathan for spotting this)
Fixed maintain trailing slash consistency across site
Version 2.2 (internal release)
Added ALL link Display Text Option
Added new CSS class for ALL link styling (contentjumpall , contentlistall)
Fixed bug where pagetitle followed by nextpage caused errors
Fixed tinymce js cache issues (hopefully..)
Fixed navigation for preview draft posts
Version 2.1 (30th May 2008)
Major Update
New Display ALL pages link, view multipage posts on single page
Added Auto Insert Options page, no more code necessary
Visual Editor Integration, buttons to add page breaks and page titles
Version 1.2 (20th March 2008)
Added a check for trailing slashs and permalink structure for paging
Cleaned up readme.txt for better formatting
Checked compatibility with Wordpress 2.5
Version 1.1 - Add new quickjump method - list menu / content table
Version 1.0 - Initial version
Donations
Please consider donating if you have found this plugin useful, it helps pay for my hosting!!
How to use
Function TA_display_pages
This function allows you to simply display page information for your posts on the post listing pages (such as index, categories and tag pages). It can also be used to display the page number of the current page.
Insert the following code into your theme files in the location you want the page information to appear:
<?php if(function_exists(’TA_display_pages’)) { TA_display_pages(); } ?>
In my case I added the code in to my index.php , category.php and tag.php files. Next to the post title code. Here is the code as used in my index.php file:
<h2><a href=”<?php the_permalink() ?>” rel=”bookmark” title=”Permanent Link to <?php the_title(); ?>”><?php the_title(); ?></a><?php if(function_exists(’TA_display_pages’)) { TA_display_pages(’ <small>(’,’ pages)</small>’,”,’total’); } ?></h2>
Options
TA_display_pages($firsttext, $lasttext, $midtext, $display_type)
-
$firsttext = ‘ Page ‘
-
$lasttext = ‘ ‘
-
$midtext = ‘ of ‘ (only used when display_type is all)
-
$display_type = ‘all’ (total , current, all)
Examples
Default settings Page 1 of 3TA_display_pages(’(',’ pages)’,”,’total’) (3 pages)
TA_display_pages(’(you are on page ‘,’ now)’,”,’current’) (you are on page 1 now)
Go on to the next page to read about the other functions.
Create Page Title / Headings
To create page titles using this plugin is very easy. Since version 2.1 The Visual Editor has button for insertion of nextpage and pagetitle.
When you are editing or writing a post, switch to CODE view and type in the following tag to create page breaks:
<!–nextpage–>
Anywhere inside each page add (including the starting page) the following tag:
<!–pagetitle:PAGE TITLE HERE–>
Replacing PAGE TITLE HERE with your actual page title. Make sure each page has only one pagetitle tag, the plugin is not page aware - so it counts each tag in order of occurrence, so first tag becomes title for first page, second tag becomes title for second page, so on…..
Function TA_content_jump
Since version 2.1, the options page can auto-insert navigation in to the posts.
You can also call the settings from the options page directly inside your theme using the following code.
1st Instance Options - <?php TA_content_jump(1); ?>
2nd Instance Options - <?php TA_content_jump(2); ?>
Otherwise you can use the code below to set the options in your function call.
Insert the following code in to your single post theme files, usually single.php:
<?php TA_content_jump(); ?>
The code is best inserted before or after the page content is displayed, so the navigation appears at the top or bottom of the page. Here is the code as used in my single.php file
<div align=”center”><?php TA_content_jump(’Page :’,”, 2, 2, 0, False, ‘«’, ‘»’); ?></div><div align=”center”><?php TA_content_jump(); ?></div>
The above produces the navigation links you see at the bottom of this page.
Options
There are several options with this function. Here is an outline:
-
Quickjump method - Drop Down List or Direct Page Links or Ordered List
-
Quickjump using page titles or page numbers
-
Standard navigation using previous or next links
-
Title navigation using page titles as the previous or next link
TA_content_jump($before, $after, $title_number, $quick_type, $nav_type, $nav_number, $previouspagelink, $nextpagelink, $firstpagetext, $lastpagetext, $display_all, $display_all_text)
Defaults
$before = ‘<p>’
$after = ‘</p>’
$title_number = 2 (used when quick_type set to 2, adds page number to page title 0 = no number, 1 = Page Title (1/3), 2 = 1. Page Title)
$quick_type = 1 (quick jump navigation type 0 = do not display ,1 = Drop Down List ,2 = page number links, 3 = Ordered List)
$nav_type = 2 (navigation type 0 = do not display, 1 = use page titles as next or previous, 2 = use $previouspagelink/$nextpagelink as next or previous links)
$nav_number = TRUE (only used when nav_type = 1, if TRUE page titles preceded by page number)
$previouspagelink = ‘«’
$nextpagelink = ‘»’
$firstpagetext = ‘On First Page’ (text to display when on first or last page when using nav_type 1)
$lastpagetext = ‘On Last Page’
$display_all = TRUE (Display ALL page link on navigation)
$display_all_text = ‘View All’ (All page link name
**NOTE** nav_type is switched to 2 when post has no page titles !!!
Example
<?php TA_content_jump(’Page :’,”, 2, 2, 0, False, ”, ”); ?>Page : 1 2 3
On the next page I go over the various styling options available…
Styling Options
The plugin uses the following CSS styles, copy and paste this code in to you theme’s style.css file:
span.contentjumplink { font-size: 2em;
color: #aaa;
vertical-align:middle;
font-weight: bold;
padding: 0 3px 0px 3px}
a.contentjumplink { font-size: 2em;
color: #25A;
vertical-align:middle;
font-weight: bold;
padding: 0 3px 0px 3px} span.contentjumptitle { vertical-align: middle ;
color: #aaa;
font-weight: bold;
border:1px #ddd solid ;
border-top-color: #a7a7a7;
padding: 3px 3px 3px 3px }
ol.contentlist { background-color:#f5f5f5; width: 20%; text-align:left; line-height: 3px; padding: 0px; }
ol.contentlist li { padding: 0px; }
span.contentlist { color: #aaa; font-weight: bold; }
a.contentlist { padding: 0px; }
a.contentjumptitle { vertical-align: middle;
border:1px #ddd solid ;
border-top-color: #a7a7a7;
padding: 3px 3px 3px 3px} select.contentjumpddl { vertical-align: middle;
margin: 0px 0px 0px 0px ;
color: #25A;
font-weight:bold;
font-family:Verdana, Arial, Helvetica, sans-serif;
width: 160px }
a.contentjumpnumber:hover { border-top-color: #25a; }
contentjumpall { padding: 3px 5px 3px 5px;}
These CSS styles are only provided if you want more control over how your navigation links appear, the values above are the ones I use to create the look of my links at the bottom of my posts.
I hope you enjoy my plugin and you find it useful. Any problems or questions please contact me or leave a comment…
- Related Posts
