Last updated February 3, 2012. Created by joachim on March 1, 2009.
Edited by davidneedham. Log in to edit this page.
This is a page of example code and templates for custom pagers. Please add your own!
Using these examples
Theming a custom pager can involve making several changes to your theme:
- creating a function phptemplate_preprocess_custom_pager in your theme's template.php file
- creating template files in your theme folder, eg. custom-pager.tpl.php
First and Last links
In template.php:
function phptemplate_preprocess_custom_pager(&$vars) {
// if we're at the end, the nav_array item for this (eg first) is NULL;
// no need to compare it to current index.
$vars['first'] = empty($vars['nav_array']['first']) ? '' : l('first', 'node/' . $vars['nav_array']['first']);
$vars['last'] = empty($vars['nav_array']['last']) ? '' : l('last', 'node/' . $vars['nav_array']['last']);
}Add a custom-pager.tpl.php:
<ul class="custom-pager custom-pager-<?php print $position; ?>">
<li class="first"><?php print $first; ?></li>
<li class="previous"><?php print $previous; ?></li>
<li class="key"><?php print $key; ?></li>
<li class="next"><?php print $next; ?></li>
<li class="last"><?php print $last; ?></li>
</ul>
Comments
Using image thumbs from image module
This goes in template.php:
function prevnext_nav($nid) {$result = db_query("SELECT i.image_size, f.filepath FROM {image} i INNER JOIN {files} f ON i.fid = f.fid WHERE i.nid = %d", $nid);
$images = array();
while ($file = db_fetch_object($result)) {
$images[$file->image_size] = file_create_path($file->filepath);
}
return '<img src="/'. $images['thumbnail'].'">';
}
And here's my custom-pager.tpl.php:
<ul class="custom-pager custom-pager-<?php print $position; ?>"><div id="icon-pager">
<li class="previous">
<?php
print '<div class="prev-icon" >'. l(prevnext_nav($nav_array['prev']), 'node/'. $nav_array['prev'], $options = array('html' => TRUE)) .'</div>';
print $previous; ?>
</li>
<li class="key"><?php print $key; ?></li>
<li class="next"><?php
print '<div class="next-icon" >'. l(prevnext_nav($nav_array['next']), 'node/'. $nav_array['next'], $options = array('html' => TRUE)) .'</div>';
print $next; ?></li>
</ul>
</div>
Very cool. How can you do
Very cool. How can you do this with a CCK ImageField? Any ideas?
thanks
Where to find custom-pager.tpl.php
Hi awolfey,
I'm new in Drupal and I would like to know where can I find custom-pager.tpl.php file? Tnx in advance!
shok
Too fragile
I had a custom pager with prev/next images working for several months; except that I couldn't make the prev/next strings below the image translatable, it was doing what I wanted. Then it suddenly stopped working, without having updated the 'custom_pager' or making any changes to template.php. Now there is simply an unlocalized pager with "‹ previous", "4 of 33", and "next ›", and no image previews; pasting the snippets from above had no effect (after clearing the theme registry). Yesterday it worked, today it doesn't. This stuff is fragile like an egg, and it requires a bizarre amount of programming expertise to properly debug. :-(
Kefk | CineDat | Fotonexus | Encycan | Encymus | Taxidi
I'm using this code to
I'm using this code to replace the 'previous' and 'next' links with images. The 'next' image it's working but I just can't replace the 'previous' link with the image. Any advice on this?
function mytheme_preprocess_custom_pager(&$vars) {// if we're at the end, the nav_array item for this (eg first) is NULL;
// no need to compare it to current index.
$path = drupal_get_path('theme', 'terniumgrey');
$vars['prev'] = empty($vars['nav_array']['prev']) ? '' : l("<img src=\"". base_path() . $path ."/images/bullet_back.gif\" />", 'node/' . $vars['nav_array']['prev'], array('html' => TRUE));
$vars['next'] = empty($vars['nav_array']['next']) ? '' : l("<img src=\"". base_path() . $path ."/images/bullet.gif\" />", 'node/' . $vars['nav_array']['next'], array('html' => TRUE));
}
Luis
$vars['prev'] should be
$vars['prev']should be$vars['previous']Check
<?php print $previous; ?>, you're printing the $previous variable, not $prevHope this helps.
Best regards,
Karel
I wanted my pager in a block,
I wanted my pager in a block, so I just added the following code to a block. I hope to tidy and possibly add a patch to add a block to the module.
<?php
if(arg(0) == 'node' && is_numeric(arg(1))){
$node = node_load(arg(1));
$pagers = _custom_pagers_load_all_pagers();
foreach ($pagers as $pager) {
if ($pager->position != 'block' && _custom_pagers_visibility($pager, $node)) {
$nav_array = custom_pager_build_nav($pager, $node);
if ($nav_array['current_index'] != -1) {
print( theme('custom_pager', $nav_array, $node, $pager, 'top'));
}
}
}
}
?>
Use '‹‹' and '››' instead of 'previous' and 'next'
Insert into template.php
<?php
function phptemplate_preprocess_custom_pager(&$vars) {
$nav = $vars['nav_array'];
$vars['previous'] = !empty($nav['prev']) ? l('‹‹', 'node/'. $nav['prev']) : '';
$vars['key'] = t('@count of @count_total', array('@count' => ($nav['current_index'] + 1), '@count_total' => count($nav['full_list'])));
$vars['next'] = !empty($nav['next']) ? l('››', 'node/'. $nav['next']) : '';
}
?>
Localization
Hi,
is there a way to translate the "first", "previous", "next" and "last" links in custom-pager.tpl.php or template.php? I couldn't find a way to translate the strings from comment 1418132.
Regarding the other strings from the original post: They can be run through the
t()function; I've added a description to the Image gallery handbook page.Greetings, -asb
Kefk | CineDat | Fotonexus | Encycan | Encymus | Taxidi
Can't get image to work on First
Custom-pager.tpl.php
<div class="div-custom-pager div-custom-pager-<?php print $position; ?>"><table class="custom-pager custom-pager-<?php print $position; ?>"><tr>
<td class="previous"><?php print $previous; ?></td>
<td class="first"><?php print $first; ?></td>
<td class="random"><?php print $random; ?></td>
<td class="next"><?php print $next; ?></td>
</table>
</div>
Custom-pager.module
$vars['previous'] = !empty($nav['prev']) ? l("<img src='/sites/becuzwecan.questgamers.org/files/previous.jpg'/>",'node/'. $nav['prev'], array("html"=>true)) : '';$vars['key'] = t('@count of @count_total', array('@count' => ($nav['current_index'] + 1), '@count_total' => count($nav['full_list'])));
$vars['next'] = !empty($nav['next']) ? l("<img src='/sites/becuzwecan.questgamers.org/files/nextm.jpg'/>",'node/'. $nav['next'], array("html"=>true)) : '';
$vars['first'] = !empty($nav['first']) ? l("<img src='/sites/becuzwecan.questgamers.org/files/firstut.jpg'/>",'node/'. $nav['first'], array("html"=>true)) : '';
$vars['random'] = !empty($nav['rand']) ? l("<img src='/sites/becuzwecan.questgamers.org/files/randomst.jpg'/>",'node/'. $nav['rand'], array("html"=>true)) : '';
But, when the page generates the 'First' Button code is
<td class="first"><a href="/comic/2009-09-21/numbers-game">first</a></td>Any ideas on why this might be?
figured it out
Amazing what typing out your problem can do. Figured out in a matter of seconds. My template.php for my theme had a process emptying the variable 'first'
This doesn't work .. function
This doesn't work ..
<?phpfunction phptemplate_preprocess_custom_pager(&$vars) {
// if we're at the end, the nav_array item for this (eg first) is NULL;
// no need to compare it to current index.
$vars['next'] = empty($vars['nav_array']['next']) ? '' : l('Alt next', 'node/' . $vars['nav_array']['next']);
$vars['last'] = empty($vars['nav_array']['last']) ? '' : l('Alt last', 'node/' . $vars['nav_array']['last']);
$vars['previous'] = empty($vars['nav_array']['previous']) ? '' : l('Alt previous', 'node/' . $vars['nav_array']['previous']);
}?>
With same custom-pager.tpl.php as seen in first post added to theme folder and theme cache flushed, does nothing at all.
Online Website Design ( OnlineWD™ )
Thanks...but I think I need
Thanks...but I think I need more direction than that. I could follow an example, maybe, or cut and paste a solution, but beyond that...
I think I got it.
I'm working on a custom pager for a multi-user blog, where posts from different users are linked together by a custom content type. So I've used "newer" and "older" as follows:
$newer = node_load($nav['prev']);
$newer = node_page_title($newer);
$older = node_load($nav['next']);
$older = node_page_title($older);
$vars['previous'] = !empty($nav['prev']) ?l('< ' . $newer, 'node/'. $nav['prev']) : '';
$vars['key'] = t('@count of @count_total', array('@count' => ($nav['current_index'] + 1), '@count_total' => count($nav['full_list'])));
$vars['next'] = !empty($nav['next']) ?l($older . ' >', 'node/'. $nav['next']) : '';
I'm not much of a programmer so if there's a problem here, let me know. I got the idea from looking at http://drupal.org/node/516862 .
No need to call
No need to call node_page_title(). Just say $node->title.
And it's *essential* for security that you run it through check_plain()! That's raw user input you are printing there!
l() passes it through check_plain
According to http://drupal.org/node/28984 , l() passes it through check_plain automatically. Is this sufficient?
A closer look revealed this was already solved
A closer look revealed this was already solved on http://drupal.org/node/428540 . Here's the solution from comment #8, which uses check_plain.
$nextTitle = isset($nav['next']) ? check_plain(db_result(db_query('SELECT title FROM {node} WHERE nid = %d',$nav['next']))) : '';
$prevTitle = isset($nav['prev']) ? check_plain(db_result(db_query('SELECT title FROM {node} WHERE nid = %d',$nav['prev']))) : '';
$vars['previous'] = !empty($nav['prev']) ? l('< ' . $prevTitle, 'node/'. $nav['prev']) : '';
$vars['key'] = t('@count of @count_total', array('@count' => ($nav['current_index'] + 1), '@count_total' => count($nav['full_list'])));
$vars['next'] = !empty($nav['next']) ? l($nextTitle . ' >', 'node/'. $nav['next']) : '';
I'm also trying to replace
I'm also trying to replace
"< previous"and"next >"with node titles. I've viewed the various issues on this topic, and tried pasting this code into my "template.php". However, nothing has worked, so I'm wondering if someone can help me a bit.I'd prefer to take the general approach here, where code is added to "template.php" and then a "custom-pager.tpl.php" file is made for the specific pager function...
My use case is very straightforward, so if someone could help me with this I'm sure others will find it helpful too.
Jim
custom pager in block?
Can these extensions for a custom pager, especially previewing the next/last image, be pu in a block somehow?
I'd like to have these images in a sidebar, not in the node itself...
Kefk | CineDat | Fotonexus | Encycan | Encymus | Taxidi
Get a link back to the view to appear in the pager
I would like to generate a link in the photo node where the pager displays, to go back to the view. I have a Gallery set up identical to the one in the book Using Drupal, except that the pager appears under the photo node, and I would like a link to appear somewhere in the vicinity of the pager mechanism. Any thoughts on how to do that? It seems to me it can be done, but I am not sure how to do it. Any insight would be appreciated.
REK
for theming like the full
for theming like the full pager of drupal in your "custom-pager.tpl.php" paste this code.
<div class="item-list">
<ul class="pager custom-pager-<?php print $position; ?>">
<li class="pager-previous first"><?php print $previous; ?></li>
<?php
$quantity = 5;
$pager_middle = ceil($quantity / 2);
$pager_current = $nav_array['current_index'];
$pager_first = $pager_current - $pager_middle + 1;
$pager_last = $pager_current + $quantity - $pager_middle+1;
$pager_max = sizeof($nav_array['full_list']);
$i = $pager_first;
if ($pager_last > $pager_max) {
$i = $i + ($pager_max - $pager_last);
$pager_last = $pager_max;
}
if ($i <= 0) {
$pager_last = $pager_last + (1 - $i)-1;
$i = 0;
}
if ($i != $pager_max) {
for (; $i < $pager_last && $i <= $pager_max; $i++) {
$nid = $nav_array['full_list'][$i];
if ($i < $pager_current) {
print '<li class="pager-item">'.l($i+1,'node/'. $nid) .'</li>';
}
if ($i == $pager_current) {
print '<li class="pager-current">'.l($i+1,'node/'. $nid) .'</li>';
}
if ($i > $pager_current) {
print '<li class="pager-item">'.l($i+1,'node/'. $nid) .'</li>';
}
}
}
?>
<li class="pager-next last"><?php print $next; ?></li>
</ul>
</div>
I also want to replace
I also want to replace 'previous' and 'next' with buttons as images. The code from comment number 4 isnt working for me.
function mytheme_preprocess_custom_pager(&$vars) {// if we're at the end, the nav_array item for this (eg first) is NULL;
// no need to compare it to current index.
$path = drupal_get_path('theme', 'terniumgrey');
$vars['previous'] = empty($vars['nav_array']['prev']) ? '' : l("<img src=\"". base_path() . $path ."/imagesmy/button-up.png\" />", 'node/' . $vars['nav_array']['prev'], array('html' => TRUE));
$vars['next'] = empty($vars['nav_array']['next']) ? '' : l("<img src=\"". base_path() . $path ."/imagesmy/button-up.png\" />", 'node/' . $vars['nav_array']['next'], array('html' => TRUE));
}
In my root installation I have a folder called imagesmy which has the button images in it.
Thanks
custom paging by weight?
this pagers are quite nice! it works for me, but does anybody know how to change the paging criteria? i want to sort nodes by weight and it doesn't seem to be an option for that?
Which function to target a certain pager id?
Hi,
I've set up different pagers for different content types and I'd like to adjust the labels for each of them (e.g. "first blog post", "next blog post" for blog posts, and "first event", next event" for events).
If I use
function phptemplate_preprocess_custom_pager(&$vars) {...}intemplate.php, it affects all pager IDs. Something likefunction phptemplate_preprocess_custom_pager_3(&$vars) {...}for the pager with ID 3 does not work.Does anyone know how the function has to be named to target a certain pager id?
Thx!
Kefk | CineDat | Fotonexus | Encycan | Encymus | Taxidi
Is there a way to do this for
Is there a way to do this for only one specific content type? The examples given look like they do it for any given content on a site. Thanks.
High Rock Media | Photography | Twitter | Drupal Bamboo Theme
An example Custom Pager for D7 with Display Suite
Used the code from http://drupal.org/node/995286#comment-4776236 to add the D7 version of the module.
Create a node display using Display Suite and add the fields you want to show for your pager.
Inside the template.php file add:
function hook_preprocess_custom_pager(&$vars){
$nav = $vars['nav_array'];
$next_node = array();
if (!empty($nav['next'])){
$next_node = get_node_pager_details($nav['next']);
}
$previous_node = '';
if (!empty($vars['nav_array']['prev'])){
$previous_node = get_node_pager_details($nav['prev']);
}
$vars['previous'] = '';
if(!empty($nav['prev'])){
$vars['previous'] = drupal_render($previous_node);
$vars['relation'] = 'Previous Article';
}
$vars['next'] = '';
if(!empty($nav['next'])){
$vars['next'] = drupal_render($next_node);
$vars['relation'] = 'Next Article';
}
}
function get_node_pager_details($nid){
$node_details = array();
//this will return the renderable array for the display we created for the pager (2nd argument)
$node_details = node_view(node_load($nid), 'node_pager');
return $node_details;
}
then copy custom-pager.tpl.php and paste it in your theme folder and output the pager:
e.g:
<div class="custom-pager"><div class="title"><h2><?php print check_plain($pager->title); ?></h2></div>
<?php if (!empty($previous)): ?>
<div class="custom-pager-previous">
<div class="pager-relation"><h3><?php print $relation; ?></h3></div>
<?php print $previous; ?>
</div>
<?php endif; ?>
<?php if (!empty($next)): ?>
<div class="custom-pager-next">
<div class="pager-relation"><h3><?php print $relation; ?></h3></div>
<?php print $next; ?>
</div>
<?php endif; ?>
</div>
Hope this is useful.
Pavlos
+1
+1
To clarify...
v
geoff gevalt
http://www.youngwritersproject.org
http://www.ywpschools.net