DEV Community

Cover image for Generate PDF with gem wicked_pdf
Yaroslav Shmarov
Yaroslav Shmarov

Posted on • Originally published at blog.corsego.com on

4 2

Generate PDF with gem wicked_pdf

Mission: Turn any rails view into PDF.

BEFORE

superails.com no pdf

AFTER

superails.com turned to pdf

Video tutorial:

Ruby on Rails #17 generate, save, send PDFs with gem wicked_pdf

Source Code

Text walkthrough:

Assuming you have a table posts.

Gemfile

gem 'wicked_pdf'
gem "wkhtmltopdf-binary", group: :development
gem "wkhtmltopdf-heroku", group: :production

Enter fullscreen mode Exit fullscreen mode

config/initializers/wicked_pdf.rb

# WickedPDF Global Configuration
#
# Use this to set up shared configuration options for your entire application.
# Any of the configuration options shown here can also be applied to single
# models by passing arguments to the `render :pdf` call.
#
# To learn more, check out the README:
#
# https://github.com/mileszs/wicked_pdf/blob/master/README.md

WickedPdf.config ||= {}
WickedPdf.config.merge!({
  layout: "pdf.html.erb",
  orientation: "Landscape",
  lowquality: true,
  zoom: 1,
  dpi: 75
}) 

Enter fullscreen mode Exit fullscreen mode

app/views/layouts/pdf.html.erb

<!DOCTYPE html>
<html>
  <head>
    <meta content="text/html; charset=UTF-8" http-equiv="Content-Type"/>
    <meta charset="utf-8"/>
    <%= wicked_pdf_stylesheet_link_tag "pdf" %>
  </head>
  <body onload="number_pages">
    <div id="header">
      <!--= wicked_pdf_image_tag 'thumbnail.png', height: "30", width: "auto"
      -->
    </div>
    <div id="content">
      <%= yield %>
    </div>
  </body>
</html>

Enter fullscreen mode Exit fullscreen mode

app/controllers/posts_controller.rb

  def index
    @posts = Post.all.order(created_at: :desc)
    respond_to do |format|
      format.html
      format.pdf do
        render pdf: "Posts",
               page_size: "A4",
               template: "posts/post.pdf.erb"
      end
    end
  end

Enter fullscreen mode Exit fullscreen mode

app/views/posts/index.html.erb

     <%= link_to "PDF", posts_path(format: :pdf), class: 'btn btn-primary' %>

Enter fullscreen mode Exit fullscreen mode

app/views/posts/post.pdf.erb

Date of extract: 
<%= Date.today %>
<br>

Posts count:
<%= @posts.count %>
<br>

<table style="width:100%">
  <thead>
    <tr>
      <th>id
      <th>title</th>
      <th>content</th>
    </tr>
  </thead>
  <tbody>
    <% @posts.each do |post| %>
      <%= content_tag :tr, id: dom_id(post), class: dom_class(post) do %>
        <td><%= post.id %></td>
        <td><%= post.title %></td>
        <td><%= post.content %></td>
      <% end %>
    <% end %>
  </tbody>
</table> 

Enter fullscreen mode Exit fullscreen mode

app/assets/stylesheets/pdf.scss

table, th, td {
  border: 1px solid black;
  border-collapse: collapse;
} 

Enter fullscreen mode Exit fullscreen mode

That’s it!

Speedy emails, satisfied customers

Postmark Image

Are delayed transactional emails costing you user satisfaction? Postmark delivers your emails almost instantly, keeping your customers happy and connected.

Sign up

Top comments (0)

A Workflow Copilot. Tailored to You.

Pieces.app image

Our desktop app, with its intelligent copilot, streamlines coding by generating snippets, extracting code from screenshots, and accelerating problem-solving.

Read the docs