Support for Drupal 7 is ending on 5 January 2025—it’s time to migrate to Drupal 10! Learn about the many benefits of Drupal 10 and find migration tools in our resource center.
I've seen a lot of references to referencing CSS files, and using CSS inline to style content in the view, but I can't see where I do this in the UI.
Most of the issues i've read are for version 6.x - has the same been implemented in 7.x ?
Thanks so much for the module - I have a complicated Use case, and yet it has done everything I need - apart from the styling!
Thanks for any advice given.
Comments
Comment #1
gillarf CreditAttribution: gillarf commentedI'll answer my own question - use the dev version...
Comment #2
gillarf CreditAttribution: gillarf commentedReopening this - i have found how to link to the CSS file, but no styles get applied.
I am assuming the HTML rendered on a page display for the the view is the same that is rendered on the PDF, is that right?
Are there any tricks I am missing?
Comment #3
gillarf CreditAttribution: gillarf commentedI'll answer this question as well if anyone else has the same problem
Do not use a forward slash when you reference your CSS file. So reference your css with 'sites/all/themes..' etc.
And yes, inspect the HTML output with a page display, the same elements can be referenced with CSS in the PDF as far as I can tell.
Not all CSS works though.
...how come as soon as I post a question I find the answer.
Comment #4
nandwabee CreditAttribution: nandwabee commentedNeeding your help on this one.
Could you provide a slightly detailed procedure of how you got this to work.Am stuck.
Thank you.
Comment #5
gillarf CreditAttribution: gillarf commentedFunny enough i've returned to my view again today.
1. Make sure you have the dev version of views pdf
2. Create your view with a page display.
3. Create new pdf.css file in your theme and add it in your info file. Use your CSS to get the view content in your page siaply roughly the way you want (using theme CSS file for example). NB you can only really style simple CSS like colors, padding, margin, borders, etc. The reason for doing this is that you can inspect the CSS with firebug (you can't on the PDF)
4. Create your PDF display in views. For position of fields use the views UI (under PDF fields).
5. Add the path to your CSS file in your view under PDF Settings - do not have a slash at the beginning.
6. Don't forget to remove the pdf.css file from your theme info file.
That's it - should work. If you miss out some settings under PDF fields, the field will NOT appear.
I would suggest doing a really simple view at first to get a feel for it.
Comment #6
nandwabee CreditAttribution: nandwabee commented@gillarf Thanks a bunch. It's working pretty well.
Comment #7
nandwabee CreditAttribution: nandwabee commentedOops! Celebrated before hand.Its possible to attach a css file but now i get this error TCPDF ERROR: Some data has already been output, can't send PDF file
Comment #8
gillarf CreditAttribution: gillarf commentedA common problem - read here:
http://drupal.org/node/1485892#comment-5865266
Comment #9
nandwabee CreditAttribution: nandwabee commentedInterestingly I had applied the same patch to rc1 and it worked and It's what I've been using until I hit the rocks lately.Now am unable to apply the patch.All I get are errors.Lemme keep trying though.
Comment #10
gillarf CreditAttribution: gillarf commentedThe patch only adds a single line so you can check easily.
In views_pdf_plugin_display.inc, at around line 106, make sure this line:
ob_clean();
Appears before this:
if ($destination == 'I') {
echo $this->view->pdf->Output($path_to_store_pdf, $destination);
exit();
You might need to clear all caches.
Comment #11
nandwabee CreditAttribution: nandwabee commentedThak you so much.Its worked. Now to wrestle with TCPDF :)
Comment #12
gillarf CreditAttribution: gillarf commentedNo worries - all the best.
Comment #13
s.Daniel CreditAttribution: s.Daniel commentedReopening since documentation needs this information as soon as this feature hits the next release.
Comment #14
hockey2112 CreditAttribution: hockey2112 commentedThis is giving me a lot of trouble. I added a CSS file with a few very basic CSS selectors, but the PDF seems to be completely ignoring it.
I tried with both the "sites/" path and the full url.
I also grouped a few fields via rewriting another field (as outlined here: http://www.arsnova.cc/web-development-articles/2012-07-27/grouping-field...) and added a DIV with a class to that rewritten field... but the CSS is still not taking effect on the PDF.
Any ideas of other things I can try? I have my PDF Page view set to "PDF Unformatted" and "PDF Fields"... does that cause it to ignore the CSS file?
Comment #15
gillarf CreditAttribution: gillarf commentedwhat styles are you trying to apply?
It will only accept certain, fairly basic styles - size, color etc.
Positioning you should do with the settings in the view (i think PDF field settings)
Comment #16
hockey2112 CreditAttribution: hockey2112 commentedHere is a sampling of the items from the CSS file:
(specs is the class I applied to a div in the rewrite of a field)
Comment #17
gillarf CreditAttribution: gillarf commentedHave you tried testing a really simple CSS rule? e.g.
h1 {
color: red;
}
if that works, its your CSS.
Because you can't interrogate the markup in your PDF with firebug, you could create a normal page display in the view, and apply the style to that, to make sure your CSS is right.
It definitely works - are you using the dev version of the module?
Comment #18
goofr CreditAttribution: goofr commentedhockey2112,
Did you find any solution yet?
Css styles are getting applied on p and img tags, but all the rest (what you define in the Views UI) is ignored.
If I try to change the output in PHP Code Before Output: $content = "
". $content . "
"; fe, still no result.
Any ideas?
Thank you
Frank
Comment #19
hockey2112 CreditAttribution: hockey2112 commentedFrank,
I had given up on this module, opting for the Print module instead, but even that module has difficulty taking my CSS into account. So, unfortunately, I do not have any solutions for Views PDF. I am, however, re-investigating it to see if I can help to figure out how to theme the PDF.
One strange thing I have come across in my generated PDFs is that some of the text is duplicated on top of itself... in other words, there are 4 or 5 copies of each piece of the text in question, stacked one on top of the other. I wonder what is causing that...
Have you made any more headway?
Comment #20
jaysonjaynes CreditAttribution: jaysonjaynes commentedI'm having some issues with implementing CSS as well. I'm using the dev version, and have applied this fatal error patch.
I've gone through and did what you suggested, step-by-step, and it looks like the CSS is loading, it's just very, very limited from what I can tell. I can only do font color on an element, like
or
, no classes or ids. I can't seem to get padding or margin. I'm attempting to use all sorts of measurements, from ems to percentage, to millimeters, to inches.
When I try to position them with the interface, the all are stacked on top of one another. Am I doing something wrong? Seems like you should be able to do a few more things, like padding or margin, but I can't get it to work.
Any advice would be so helpful! Thanks.
Comment #21
gillarf CreditAttribution: gillarf commentedYou probably need to set the position of the field in the pdf fields settings. e.g. If you want to follow on from the last item, choose that option.
Without doing that, I think the fields will just stack on top of one another.
I didn't have much luck with padding or margins either. However I did find that padding (or margin) was being added automatically to the markup surrounding the fields, so you might want to edit the field settings, and experiment with the markup around the field, the field label, and the whole field-label item (sorry I forget the terminology, but its in the individual field settings, possibly in style settings.
If you really need to, you can rewrite the output of the field exactly as you want to.
Comment #22
killua99 CreditAttribution: killua99 commentedDear fellow Drupal enthusiasts,
I have set this issue to "Postponed (Maintainer needs more information)".
If not already done please add an issue summary and steps how to reproduce the problem.
And please read again, "Making an issue report".
Help about how to do this can be found on IRC and in the user groups.
After there is new information, please re-open the issue by changing the status to active.
--
This issue was edited with the help of Issue Helper
Comment #23
nhck CreditAttribution: nhck commentedI basically had code like this:
and a css like this:
This produced a nice html which in html looks like this:
In the pdf there is a grey border floating around and it looks like this:
There is no respect of margin alignment what so ever. Maybe it would be useful to be able to switch to dompdf?
Comment #24
killua99 CreditAttribution: killua99 commentedI'm reading all the issue list.
Sorry but, this CSS issue. Have you try with a file or anything?
Comment #25
nhck CreditAttribution: nhck commentedWith a file? I am sorry - I don't understand the question.
This was merely an issue of trying to show a separation of two rows. I ended up not solving it :-)
Comment #26
Uspower CreditAttribution: Uspower commentedHi all,
My problem with that module is the view where appears to put path css file i put the absolute path and don´t work, any ideias??
I have path like this sites/all/themes/MYWEBSITE/css/pdf.css
I already write in info file the place where css File stays and test the css works fine, but for pdf when generated don´t work.
I don´t find the answer.
Comment #27
misthero CreditAttribution: misthero commentedthis is what worked for me:
edited views_pdf_template.php around line 515
I was using unformatted output, style settings for fields are not applied, so I had to rewrite each field output checking "rewrite this field output"
and than in the rewrite text area:
<h1 class="pdfTitle">[title]</h1>
in my css I have :
this works for me...
Comment #28
Uspower CreditAttribution: Uspower commentedDone, i can affect css with rewrite output, thank you.
One question. This pdf viewer assumes floats and displays at css????
Comment #29
Fernly CreditAttribution: Fernly commentedIs there a way to style the table in the table output? Like borders, cell paddings, style odd and even rows and so on? Perhaps I'm just missing it..
Thanks in advance!
Comment #30
vegansupreme CreditAttribution: vegansupreme commentedPDF Table does not output a HTML table. Therefore you have to get creative if you want to style it.
I've submitted a patch here that might help:
#1355440: Display borders on PDF table
Comment #31
killua99 CreditAttribution: killua99 commentedSo what about this issue. The main issue is solved?
Comment #32
gillarf CreditAttribution: gillarf commentedIt's been working fine for me for a long time now. Reopen if the issue still exists for someone.
Comment #33
rbrownellI am having the problem that nhck #23 is having. The system that generates the PDF appears to not work with basic CSS formatting functions such as margin and border. To over come (somewhat) these problems I've had to include abnormal css workarounds like line-height:0;... The library that generates the PDFs doesn't seem to understand basic CSS... Perhaps use of a new library is in order?
Comment #34
Collins405 CreditAttribution: Collins405 commented@rbrownell I agree, use and availability of more common CSS attributes could make this module amazing.
Comment #35
vegansupreme CreditAttribution: vegansupreme commentedYou can apply only limited CSS. I found a great explanation on stack overflow:
http://stackoverflow.com/questions/3404095/tcpdf-not-render-all-css-prop...
CSS files do in fact work, as described in previous comments. However, many styles are just not supported in TCPDF.
Table borders seems to be a highly requested feature. I've figured out a workaround. You need to go old school HTML. TCPDF doesn't understand the CSS border property, but it does understand the HTML Table border property. So you can create a custom template file for a view that includes
<TABLE BORDER="1">
and all the necessary HTML for your table. Note, this should be a regular page view, not a PDF view. Then create a PDF view and include the view you just created. You can use Views PDF's Include view or, the better supported Views Field View module and its 'Global: View' field.If you want more information about using theme files with views you can post here—I only just learned myself—just keep this issue closed.
There are other PDF libraries that may be able to handle more advanced CSS, but I'm not able to rewrite this module to include them. That's just way more than I can handle on my own. It would be a great if Views PDF could support multiple libraries, or even all PDF libraries. If someone else wants to take on that issue and add support for other libraries, you're welcome to do so, and you'll have my full support.
Comment #36
shevgenyPadding and margin do not work. Color, background, font size are redefined via CSS, but padding and margin are not.