PDF conversions with css.

September 19, 2005 9:21 PM

PDF from html with extensive css. How do I resolve my formatting issues?

I'm doing conversion of an extensively css2 controlled web page into pdf. It has to be from a web page because of the extent of the dynamic content. Specifically, I'm having multiple issues.

First, I'm trying to get transparency to work in the images I put into the pdf, when it appears fine in the browser. I haven't found any evidence of support for .gif or .png in any of my searches. I really don't like the idea of having to get my php code to dynamically combine the layers and turn it to a single .jpg file.

Second, I can't get any web page background images to display once converted. As far as I can tell, it doesen't matter if the background is hard-coded to the element or exists in my .css file. I need the background to make it more professional, as this is being developed for military reasons.

Third, occasionally the .pdf will only produce the first page, and it is directly linked to the amount of css control in use, although I can't seem to find the individual factors causing this. Can you help me track it down?

posted by mystyk to computers & internet (8 comments total)

how about converting to postscript first? Use a generic PS printer to get a .ps file which you can dump into Ghostview to get a PDF.
posted by cosmicbandito at 10:12 PM on September 19, 2005

PNG isn't supported, unless they changed that in version 7 I am not familiar with.

The only way I can get PNGs to show up, and CSS defined styles, is by printing the webpage from the browser through PDFwriter or the Distiller. That still doesn't give you much room for control though. PNGs converted by the Distiller can look crap, as they're meant to be seen on a screen, and not on paper.
posted by ijsbrand at 11:57 PM on September 19, 2005

I'm not sure what your conversion workflow is, and I freely admit that this sounds very silly, but have you considered creating a print stylesheet from which you would produce the PDFs? You could reduce your complexity-related formating errors, and as a bonus maybe produce a layout more sensible for print than what you've got already.

Also, (and again, I'm not sure how you're doing this,) if you're using Firefox or Mozilla's printing functionality at any point in this process, you should know that the Gecko engine is notorious for its confused printing of complex webpages. If you are using a Gecko-based browser, you might want to consider doing this particular task in Opera, Safari, or (sigh) IE.
posted by Ptrin at 6:28 AM on September 20, 2005

On my second re-reading of the question, I began to understand that the question is really about PNGs and background images in the PDF (not the HTML).

Uh, as for background images, they are commonly omitted by browsers when printing, unless you explicitly ask to print them.

More generally, I think that we might need more detail as to your workflow here. Like for instance, what browser are your printing from? What settings? What PDF driver are you printing to to do the conversion? What settings on that end?

too many unknowns. W/o more detail, you will just get dumb guesses (like my guess about background images)
posted by misterbrandt at 7:22 AM on September 20, 2005

Uh, as for background images, they are commonly omitted by browsers when printing, unless you explicitly ask to print them.

(Slight Aside) And how is that done?

In my print style sheets I have to substitute the background of say a particular div id="whatever" with an img tag within the div. For a logo for example. I haven't seen how you can get background images that are specified in the style definition to print.
posted by juiceCake at 7:28 AM on September 20, 2005

juiceCake: printing background images (g). It's browser-specific, somewhere in print options. You can never FORCE the user-agent to do anything, and background images are one thing that they decided at some point to default to off (for legibility and ink reasons).

mystyk, what about (since you are already mucking around in PHP) generating the PDF on the server-side? rather than relying on the vagaries of client-side printing (if that is what you are indeed doing)
posted by misterbrandt at 8:14 AM on September 20, 2005

Ok, I'll clarify all this a bit. I'm the Company (and for all intents and purposes the Battalion) Publications Officer. My job is to archive all unclassified (and some classified) documents produced into a .pdf form for eventual submittal to Brigade HQ. Every single one has to be in pdf, even if it makes no sense (like .ppt files. Army. Go figure). When I get a doc, ppt, xls, etc. it's pretty easy, but some of the material is web-published (like newsletters) and has to be converted directly. I helped write the php, but trying to produce pdf from extensively css controlled sites works miserably when you use the pdf plugins for php. I need them to look proper, and messing with the print options on my side is really the only way I can be sure about, and tweak, the display.

I'll use that specific newsletter example for further illustration, as it's the only web conversion I'm doing that has all three issues.

The site uses a background, and it's placed in the div fixed & centered. My print options have backgrounds supported, but only bgcolor shows up in the pdf, not bgimage.

It has a picture on the top, which is actually a gif (but I have a png version too) placed atop a jpg. It converts the clear to white when in the pdf.

Something about the css makes it only print the first page, and I think it might be related to the fixed status of the background, but I'm shooting in the dark on this one. When I hand-coded the format using tables in order to test, the first two problems remained but the printing only one page issue vanished. It's a bit impractical for me to re-code by hand 150+ documents (plus future ones too) in the next month or two.
posted by mystyk at 9:35 AM on September 20, 2005

Why are you not just opening the page in Acrobat Pro, later versions of which use the Opera rendering engine?
posted by joeclark at 11:17 AM on September 20, 2005