A little trick to make your paginator links look pretty… Add a ‘class’ option to your paginator links like so:
[sourcecode language=’php’]
prev(‘< Previous', array('class'=>‘pagNav’)); ?>
numbers(array(‘class’=>’pagNav’, ‘separator’ => ”)); ?>
next(‘Next >’, array(‘class’=>’pagNav’)); ?>
[/cc]
Now with a little bit of CSS you can style the links to fit with the rest of your design. Here’s a sample CSS:
[sourcecode language=’css’]
#pagHolder {
margin-bottom: 7px;
}
a.pagNav {
color: #878787;
border: 1px solid #e5f4ef;
text-decoration: none;
padding-right: 5px;
padding-left: 5px;
padding-top: 3px;
padding-bottom: 3px;
font-size: 11px;
font-family: Verdana, Arial, Helvetica, sans-serif;
margin-right: 5px;
}
.current {
background-color: #e5f4ef;
color: #000;
border: 1px solid #e5f4ef;
text-decoration: none;
padding-right: 5px;
padding-left: 5px;
padding-top: 3px;
padding-bottom: 3px;
font-size: 11px;
font-family: Verdana, Arial, Helvetica, sans-serif;
margin-right: 5px;
}
a.pagNav:hover {
background-color: #e5f4ef;
color: #000;
}
[/cc]
Note, that the currently selected page uses the class name ‘current’. (I have not found a way to change the default).
