Locked lesson.
About this lesson
Break our Pins into many pages with links.
Exercise files
Download this lesson’s related exercise files.
Adding Pagination.docx58.9 KB Adding Pagination - Solution.docx
60 KB
Quick reference
Adding Pagination
In this video we'll add pagination to our app.
When to use
Pagination is useful to manage the layout of our pins index page. As more pins are added, we want to be able to break that index page into many pages and scroll through those pages.
Instructions
First: Add the will_paginate gem to your Gemfile and run bundle install
Next: Modify the index method of your pins_controller.rb file to add pagination:
def index
@pins = Pin.all.order("created_at DESC").paginate(:page => params[:page], :per_page => 6)
end
Be sure to put whatever number of pins you want to appear per page at the end of that code above
Next: Restart your Rails server for good measure
Next: Add the pagination HTML code to your app/views/pins/index.html.erb file
<%= will_paginate @pins %>
Next: To use Bootstrap pagination, add the will_paginate-bootstrap Gem to your Gemfile, run bundle install
Next: Add the pagination HTML code to your app/views/pins/index.html.erb file:
<%= will_paginate @pins, renderer: BootstrapPagination::Rails %>
Next: Restart your Rails server again, just for good measure
Next: Center your pagination using divs:
<div class="center">
<%= will_paginate @pins, renderer: BootstrapPagination::Rails %>
</div>
Finally: Add center CSS to your app/assets/stylesheets/bootstraply.css.scss file
.center {
text-align:center;
}
Hints & tips
- Pagination is easy with the will_paginate Gem
- We can Bootstrapify our Pagination with the will paginate bootstrap gem
- To center your pagination on the screen, wrap it in a div with class="center" then add center CSS into your app/assets/stylesheets/bootstraply.css.scss file
Lesson notes are only available for subscribers.