Include a print CSS file?

This is indeed on my to-do list. We have a few revisions to go before 1.1, but that’s my target for implementing this.

Would you want a per-page css or a general css for the entire site? The latter might be possible with just some minor tweaking. You would have to craft your css manually, of course, as implementing an entire editor in this plugin would be well beyond the scope of its intention. However, it should be fairly straightforward to upload your css to a given directory, specify that path/file in the admin settings to be applied to all pages, and then apply that upon processing the $html intermediary.

Individual stylesheets would add a whole other layer of complexity, and would best be stored in the db, linked to each post/page.

Cheers

Lewis

Can you give me an example of some css you might want to apply to all of your generated documents, in addition to any settings available in the admin area of the plugin? That might make testing a bit easier.

Thanks

Lewis

I am trying to produce basic product documentation, e.g., installation instructions. Ideally, I would like to specify a print CSS specifically for pages that use the plugin (via shortcode). I already have a child theme and a print CSS for the standard pages. I want to do fairly extensive CSS3 formatting, and would prefer it in a seperate CSS file, rather than through an admin interface. I don’t have a CSS I can send yet, but hope to have something soon. If you have an e-mail address or place I can include an attachment that would be helpful.

Hi, Ellyn…

In case you thought I’d let this slip altogether, I just pushed to trunk a new test version with the option to specify custom css in the admin area. The css is saved to the database. You may create css in the edit box, save it, and until you select the checkbox to use it, it will do nothing (good for testing and development).

Files to update against any previous version:

wp-post-to-pdf-enhanced.php
wpptopdfenh_header.php
wpptopdfenh_options.php
wpptopdfenh_shortcodes.php

asset/css/admin.css

The two shortcodes available are unrelated. They deal with manual icon placement and pdf page breaks. On my to-do list is adding an option to the icon shortcode to specify an external css file to override any custom css in the database, as well as a separate shortcode to specify an external css file (in case the user has more than one PDF icon placed in the post, there should be no need to repeat the css parameter).

Anyway, please give this test version a spin. I think I’ve resolved the image alignment issue which Alex reported to me earlier, as well.

Cheers

I’ll give it a spin later in the week and report back. Many thanks for all of your work!

You bet, Ellyn!

Thanks for testing & feedback, as always.

Cheers!

Hi, Ellyn…

I’m curious to see whether the current CSS implementation suits your needs, or whether we need to reexamine the idea of grabbing an external CSS file or looking farther for TCPDF to handle the print media type in CSS.

Cheers

Lewis

Hi Lewis,
I’ve been swamped on things. Hopefully over the coming weekend I can give it a good workout.

Thanks,
Ellyn

No worries, Ellyn; believe me, I know what it’s like to feel like I’m treading water while wearing lead boots…!

Looking forward to your feedback. Good luck finding some time!

Cheers

Lewis

Any chance to test, Ellyn?

Possible enhancement to the CSS box is the inclusion of a better code editor to help with syntax highlighting and such, but I’d like to hear how it seems to work for you, since you requested it. ??

Cheers

Lewis

Hi Lewis,

I’m working on this now. I have basic CSS working for things like headings and table colors.

Do you happen to have a list of supported TCPDF CSS? I can’t seem to find anything in my searches, and it’s like trying to find a needle in a haystack and testing to see what works.

Just for the heck of it, I tried to include an @import url(“…/style.css”) without any success. Have you tried that? It would be an easier way than copy/paste.

Thanks for all the work you are putting towards this. I’ll let you know how things go as I get further.

Regards,
Ellyn

Hi Lewis,

It appears that what can be done with CSS is very limited with TCPDF. I’m having a heck of a time with all of the in-line HTML coding. For example, I would like to render a list with an image for a bullet as given in the last example at: https://www.tcpdf.org/examples/example_006.phps and https://www.tcpdf.org/examples/example_006.pdf.

Can you tell me where it is going to look for images? I’ve tried various locations without any luck. Here is the code:
<h1>Test custom bullet image for list items</h1>
<ul style=”font-size:14pt;list-style-type:img|png|4|4|images/logo_example.png”>

• test custom bullet image
• test custom bullet image
• test custom bullet image
• test custom bullet image

Also, it appears that the fonts configured in the settings are being applied after the CSS. Can you please verify?

Any input would be much appreciated.

Regards,
Ellyn

Hi Lewis,

I just wanted to mention that I’ve looked into the idea of including an external CSS file (@import or as a link) and using CSS @media print queries more with TCPDF. After searching quite exhaustively, I can not see any way to do this. I understand the DOMPDF does support both. Hopefully TCPDF will support them one day also.

Regards,
Ellyn

I’ve also looked into trying to find what CSS TCPDF does support, with very little luck. It’s hard to glean them all from the source file tcpdf.php.

From what I have read, the supported tags are: a, b, blockquote, br, dd, del, div, dl, dt, em, font, h1, h2, h3, h4, h5, h6, hr, i, img, li, ol, p, pre, small, span, strong, sub, sup, table, tcpdf, td, th, thead, tr, tt, u, ul.

As mentioned, TCPDF has very limited CSS support. TCPDF is able to parse all CSS properties but only a subset of them are applied. Currently, the following known CSS attributes are supported: font-family, font-size, font-weight, font-style, color, background-color, text-decoration, width, height, text-align. For tables: border, border-spacing, padding, but only in the table tag. Possibly there are more, but I have not found them yet.