Open gouravmodi opened 9 years ago
How are you including bootstrap into your layout?
The recommended way to include stylesheets is to first add them to the asset precompile list:
config/initializers/assets.rb
Rails.application.config.assets.precompile += ['bootstrap.css']
Then use <%= wicked_pdf_stylesheet_link_tag('bootstrap') %>
to load it in your PDF view.
If you are using a regular CDN reference, some versions of wkhtmltopdf
don't deal with HTTPS very well, so you might need to change to HTTP, or upgrade wkhtmltopdf
.
I've heard good things about this gem:
Gemfile
gem 'wkhtmltopdf-binary-edge'
Let me know how it goes!
@gouravmodi I am facing the same issue. if you already have solution, can you share?
@unixmonkey I am using twitter-bootstrap. i did what you told to do, i just changed "bootstrap" with "application" because when using bootstrap no css is rendered.
Just add these two lines in stylesheets/application.scss @import "bootstrap-sprockets"; @import "bootstrap"; make sure the extension of the stylesheet file should be scss and add this gem to your gem file gem 'bootstrap-sass' It should work fine.
I had this same issue applying Semantic UI from a CDN, and it turns out it was because of the HTTPS.
I changed the links to http
, and now it's working great. Thanks @unixmonkey!
I'm using wkhtmltopdf-binary version 0.9.9.3.
EDIT
Then I updated to edge (per @unixmonkey's suggestion) and put the s
back into https
, and again, it's working great!
beechnut, Great. thx.
hi i am using bootstrap css in my page .while converting html to pdf .that time bootstrap css not accepteing pls help guys
Is Bootstrap being precompiled as shown in the 2nd comment on this issue? Are you loading from a CDN? What versions of wkhtmltopdf are you using (or what version of the gem, if you are using one)? Does normal PDF creation without Bootstrap work?
I am using the
and this is what my layout look like while using CDN
Try 1
<!DOCTYPE html>
<html>
<head>
<title>PDF</title>
<%= stylesheet_link_tag "https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" %>
</head>
<body>
<div class='container'>
<%= render partial: 'employers/profiles/profile',%>
</div>
</body>
</html>
But I see no bootstrap effect, the pdf gets generated with the data. I am using bootstrao grid and i see no effect on where i am usingcol-md-8
or row
or anything else
Try 2 I also tried using the bootstrap-sass gem and followed this approach https://github.com/twbs/bootstrap-sass#configuration, this also did not work. I can see the slight change in the font but no grid class is working. This is what my layout looks in in second try while using the bootstrap gem
<!DOCTYPE html>
<html>
<head>
<title>PDF</title>
<%= wicked_pdf_stylesheet_link_tag "pdf" %>
</head>
<body>
<div class='container-fluid'>
<div class="row">
<div class="col-md-6">COL 1</div>
<div class="col-md-6">COL 2</div>
</div>
<%= render partial: 'employers/profiles/profile', %>
</div>
</body>
</html>
Inside application.rb
I have
config.assets.precompile += ['pdf.scss']
What am i missing here?
@shairyar Does using xs
in place of md
, like col-xs-8
work?
This issue shows there may be a known issue.
@unixmonkey i actually got it to work by adding viewport_size: '1280x1024'
format.pdf do
render pdf: "profile",
viewport_size: '1280x1024',
template: 'layouts/pdf.html.erb',
locals: { :user => @user }
end
Now everything seems to be working fine but then i had to include bootstrap via try 2 mentioned in my comment above
@shairyar Great find! I always forget about that option. XVFB can sometimes be configured to run at a very low resolution.
Adding my two cents after finally getting it to work for me. Creating a separate layout did the trick.
# controller
def show
respond_to do |format|
format.html
format.pdf do
render(
pdf: "filename",
layout: "pdf",
)
end
end
end
# view/layout/pdf.pdf.erb
<%= stylesheet_link_tag #{bootstrap_cdn_url}, media: "all" %>
Hi, I am having the same issue. I am using wicked_pdf in a rails project to generate pdf and I have a bootstrap grid view in the pdf template.
The bootstrap grid view renders in the pdf correctly when I run the app in development but when deployed to production no grid view in the pdf. I am using CDN link in as below
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<%= stylesheet_link_tag "http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" %>
<%= stylesheet_link_tag "http://fonts.googleapis.com/css?family=Fira+Sans" %>
<title> My Site </title>
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
in show.pdf.erb pdf template
I have also tried download thebootstrap.css
file ans save it in app/assets
and included it in config/initializers/assets.rb
precompile list as
Rails.application.config.assets.precompile += [ 'bootstrap.css']
But no luck, and am still desperatrly looking for a solution.
Any suggestion is appreciated.
@henockgm you mean a grid using the new CSS Grid feature or a grid using bootstrap classes?
I am having an issue with bootstrap and pdf. My problem is in another issue #934, because at the beginning i didn't know it was related to Bootstrap.
I use Bootstrap in my Rails project. Included gem 'bootstrap'
in my Gemfile and import it in my application.scss @import 'bootstrap';
and it works for my pages.
When i started using Wicked_pdf, i create a new scss file for pdfs styles.scss, what i renamed to pdf.scss and imported Bootstrap like in application.scss @import 'bootstrap';
. It was working fine, but after i upgrade my application to Rails 6, it stopped working, returning this error:
Failed to execute: ["/home/junior/.rbenv/versions/2.7.1/bin/wkhtmltopdf", "--encoding", "UTF-8", "--enable-local-file-access", "--page-size", "A4", "--margin-top", "30", "--margin-bottom", "10", "--margin-left", "10", "--margin-right", "10", "--header-html", "file:////tmp/wicked_header_pdf20200804-53024-66y14f.html", "--footer-html", "file:////tmp/wicked_footer_pdf20200804-53024-caf2jz.html", "file:////tmp/wicked_pdf20200804-53024-rf7hwf.html", "/tmp/wicked_pdf_generated_file20200804-53024-13qonn3.pdf"] Error: PDF could not be generated! Command Error: Loading pages (1/6) [> ] 0% [======> ] 10% [==============================> ] 50%
As you can see, there is no mention about Bootstrap in that error. But after some time and i don't know why, i removed @import 'bootstrap';
from my pdf.scss and the pdf was generated.
So, if someone is using Bootstrap with Wicked_pdf and Rails 6, could let me know how do you implement it?
Bootstrap is being applied to my PDFs, but it is not fixed, is more like a walk around the problem. Now i have Bootstrap duplicated in my project.
I have Bootstrap from gem gem 'bootstrap'
, which is used for *.html.erb
pages. But after this way stopped working with Wicked_pdf, i needed to download Bootstrap 4 compiled files and add bootstrap.min.css to my stylesheets directory. Then i imported it @import 'bootstrap.min';
in my pdf.scss.
With this i was able to use bootstrap grid system at least, what for me is great, because Wkhtmltopdf does not support default css grid system.
Bootstrap has always been a pain with wkhtmltopdf as far as I know, first there's the relative @import '/path/to/whatever'
imports, which need to be either transformed into full paths including hostname, or preprocessed with SASS, which turns those CSS imports into inline CSS in the output, and there's some flexbox-related issues, too from what I remember, since wkhtmltopdf
uses what is equivalent to a very old version of Chrome. Which also means too-modern JS and CSS don't work well with it.
It can be made to work with some polyfills if you pretend it's like Internet explorer or something like that.
In the past, I've found it easier to hand-pick the CSS rules I need (from any CSS framework) to get the desired effect on my PDF containing pages, but perhaps in your app, you want to convert any arbitrary page, or something that could have more varied content that needs styled.
First of all, thanks for your work and attention, this project is very helpful.
For now i am using just row, col and w-x from bootstrap for my pdf. I use pages exclusive for PDF, but in the early past Bootstrap from gem was working, so i used it rules to style my reports. I may copy only the parts i need from the framework, to avoid complete duplication, specially because part of it doesn't work with Wkhtmltopdf.
Thanks again.
Bootstrap works fine when debug=1 is passed as params but does'nt work when pdf is rendered. Is there any solution to this?