!!! %html %head %title Samples of pagination styling for will_paginate %link{ :rel => 'stylesheet', :type => 'text/css', :href => 'pagination.css' } %style{ :type => 'text/css' } :sass html :margin 0 :padding 0 :background #999 :font normal 76% "Lucida Grande", Verdana, Helvetica, sans-serif body :margin 2em :padding 2em :border 2px solid gray :background white :color #222 h1 :font-size 2em :font-weight normal :margin 0 0 1em 0 h2 :font-size 1.4em :margin 1em 0 .5em 0 pre :font-size 13px :font-family Monaco, "DejaVu Sans Mono", "Bitstream Vera Mono", "Courier New", monospace - pagination = '« Previous 1 3 4 5 6 7 8 9 29 30 ' - pagination_no_page_links = '« Previous ' %body %h1 Samples of pagination styling for will_paginate %p Find these styles in "examples/pagination.css" of will_paginate library. There is a Sass version of it for all you sassy people. %p Read about good rules for pagination: %a{ :href => 'http://kurafire.net/log/archive/2007/06/22/pagination-101' } Pagination 101 %p %em Warning: page links below don't lead anywhere (so don't click on them). %h2 Unstyled pagination (ewww!) %div= pagination %h2 Digg.com .digg_pagination= pagination %h2 Digg-style, no page links .digg_pagination= pagination_no_page_links %p Code that renders this: %pre= '%s' % %[<%= will_paginate @posts, :page_links => false %>].gsub('<', '<').gsub('>', '>') %h2 Digg-style, extra content .digg_pagination .page_info Displaying entries 1 - 6 of 180 in total = pagination %p Code that renders this: %pre= '%s' % %[
\n
\n <%= page_entries_info @posts %>\n
\n <%= will_paginate @posts, :container => false %>\n
].gsub('<', '<').gsub('>', '>') %h2 Apple.com store .apple_pagination= pagination %h2 Flickr.com .flickr_pagination = pagination .page_info (118 photos)