Include a print CSS file? (restarted thread)

[Lewis Rosenthal]

Restarting this thread, as our formatting was thrown off by posting CSS snippets. ??

Sorry for the slow response, Ellyn; have had my head in some work which does not seem to be letting up… (Yes, work is good; it just makes stuff like this more difficult!)

Some items, in order:

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.

Unfortunately, no, I do not. I do know that from the changelog, we have picked up text transforms since 6.0.043. The latest development build of the plugin includes TCPDF 6.0.062 which is current as of the date I uploaded that build (FWIW).

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.

Agreed, that it would be good to figure out a way to support this, and no, I have not tried (though I am not surprised that it did not work). That said, thinking on it now, I should be able to make this happen (you may recall that we talked about using external stylesheets when we started discussing the whole CSS feature). Again, this is no guaranty that TCPDF will obey, but it would prove less tedious than entering all of that code again (and a shortcode could be used to override the admin setting).

It appears that what can be done with CSS is very limited with TCPDF.

??

Can you tell me where it is going to look for images?

This is defined in tcpdf/config/tcpdf_config.php and is set to '' (hmmm…). K_PATH_MAIN is set to WPPTOPDFENH_PATH.'/tcpdf/' so you might want to try (for now) using that directory (the tcpdf directory under the plugin – for everyone’s edification), and I’ll see what happens by setting K_PATH_IMAGES to something more useful, such as WP_CONTENT_DIR . '/uploads/' as a default, and adding an option for that in the admin UI.

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

I’ll look later and give you something more definitive. I believe that TCPDF prioritizes HTML over CSS. Are you finding that your CSS for the font size (in your example style tag) is being overwritten or ignored, or is there some other font issue happening?

Thanks so much for all of this. Sorry you’re still having so many issues, but your testing is invaluable (I can’t make it better if I don’t know what’s broken!).

Cheers

Lewis

https://www.ads-software.com/plugins/wp-post-to-pdf-enhanced/

[Lewis Rosenthal]

I also did some testing with trying to get some Twitter Bootstrap shortcodes and plugins to work, also with no luck. The ones I tried were: WordPress Twitter Bootstrap CSS, Bootstrap Shortcodes for WordPress, Easy Bootstrap Shortcode and Bootstrap Glyphicons in Visual Editor.

When you say that the shortcodes and plugins didn’t work, do you mean that with the options to include output from other plugins and process shortcodes enabled, we are not capturing that data? Are we seeing the raw shortcodes in the output, or are those divisions just blank?

Sorry, I don’t do any social media (I rant against it on my blog!), so I am completely unfamiliar with the output from these. If you could pass along a couple of links, I’ll be happy to have a look at the source code on the pages to see if there is something obvious here (and whether it ties into the CSS issues we’ve been discussing in this thread, vs starting one or more new threads to address them).

Cheers

Lewis

[elarson]

About, it appears that the fonts configured in the settings are being applied after the CSS.

I’ll look later and give you something more definitive. I believe that TCPDF prioritizes HTML over CSS. Are you finding that your CSS for the font size (in your example style tag) is being overwritten or ignored, or is there some other font issue happening?

I figured out what the problem was. In the CSS I had used grouped selectors for the color property and then set the font-family per selector. The font-family per selector was ignored. I’m learning to not use any shorthand features.

And to verify what you wrote, the HTML has precedence over the CSS, and the CSS has precedence over the Content Font configured in the settings.

[elarson]

About list images, image location, Twitter Bootstrap shortcodes, etc, I think it might help if I explain what I’m trying to accomplish.

I’m working on technical documentation. I want to include 2 admonitions (alerts) for warnings and additional information. Ideally, I would like to mark these up as div’s or as unordered lists with an image for the bullet. To give you an idea, please see https://dslocks-hoc.pitlarson.com/admonitions-test

The images that I would like to use are Glyphicons (https://glyphicons.com) that are also used in Twitter Bootstrap. That is why I was testing shortcodes, in the hopes that it would work for screen as well as print — no chance.

That is why I had mentioned the following, and also asking where the image location was:

…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">

After a lot of trying, I can’t seem to get the in-line HTML style to work or the image to appear. Of course, the best solution will be to have it in the CSS, but I think the chance of that is highly unlikely.

BTW, I’m not big on social media either, but the design of the Glyphicons used in Twitter Bootstrap are nice and simple.

[Lewis Rosenthal]

Hi, Ellyn…

And to verify what you wrote, the HTML has precedence over the CSS, and the CSS has precedence over the Content Font configured in the settings.

Indeed, this is as expected, and well codified. I just need to add that to the plugin FAQ/docs (I’ll need to completely re-do the support page on my blog for this next release, as there is simply no way to get it all done on one page; perhaps that will give me the opportunity to better explain how much of this is supposed to work).

Glyphicons: Ugh. Personally, I’d like to shoot whoever came up with them, because while I wait for new builds of Firefox and SeaMonkey for OS/2, neither of my current ones can render those things, and I’m left with the little rectangles of gibberish. Without the WP Classic Admin plugin, the back end of my WP installations are completely unusable for me, as there is no fallback to real icons. The same holds true for my HP Touchpad tablet and its native browser (though I think they render properly in Firefox running in the Android Compatibility Layer).

I’ll need to think on how to get images for bullets to render. I agree that CSS would be the preferred method. The interesting thing is that even when I edit style.css for the Twenty Twelve theme, and add:

ul.leaf {
list-style-image: url('wp-content/uploads/leaf_icon.jpg');
}

(blatant copy from this site), I cannot get the web view to work (e.g., add the leaf class in the HTML editor), with or without an absolute URL; however, using the Web Developer Extension, I can edit the CSS of the rendered page, and it swaps the bullet images as expected. Without testing on some static HTML, I’m not sure whether this is something from WP which is causing this not to work, or something which TCPDF is skipping.

Thanks for explaining your use of the images from that plugin, and so very glad to hear that you’re not on the social media bandwagon! LOL!

More on this stuff as I can get some time to play.

Cheers

Lewis

[elarson]

Hi Lewis,

I’ve tried hundreds (if not thousands) of combinations of CSS and HTML “style” markup along with putting the images in many different locations.

Can you take a lot at the test page I made, specifically at Test 4: Marked up as unordered lists with list-style-type in HTML “style”

I have an expectation that at minimum the code I used for this should work, because it was taken from the examples at https://www.tcpdf.org.

I’ve included the HTML and a link to the source code where it is documented, the examples, and links to the locations where I have copied the images.

Can you maybe ask Nicola about this?

[Lewis Rosenthal]

Hi, Ellyn…

Your mention on your test page of TCPDF::setLIsymbol got me thinking that we may indeed need to set that option. While adding this to the admin UI to make it site-wide is not a big deal, the obvious choice would be to make it possible to be overridden with a shortcode.

Let me test adding that. If you feel ambitious, you could surely add the option somewhere around line 444 (my current working version differs from what is currently in Subversion; look for a comment “// Test TCPDF functions to include here” and just insert a line similar to:

$pdf->setLIsymbol(path-to-image.ext);

and see how that works. I’ll check it out here when I next have an opportunity to work on this.

I’ll surely post something for Nicola once we can confirm that either TCPDF is not doing something that it should or we have a viable enhancement to request. I know that he is continuing to add CSS functions, and of course, this would be our preferred method for many of these issues.

Cheers

Lewis

[elarson]

Hi Lewis,

I’ve downloaded the 1.1.0b20140325 Development Version (svn). I’m not able to get it to produce PDF, so I have not been able to test what you wrote.

Can you let me know if you upload another SVN?

Just as a note, I had no problems going from the stable version 1.0.4 with prior data being preserved.

Regards
Ellyn

[Lewis Rosenthal]

This is unexpected, Ellyn (not being able to generate any PDFs). Did you install the svn build as per the directions in the sticky topic, here? The problem is not with preserving your previous database settings, but with adding the new (necessary) ones. Be sure to save your settings at least once after installing the new build to add the new options. Many things which were previously hard-coded into the plugin are now set as options, and without them, I can see that PDFs might not render. In fact, the main holdup for releasing 1.1 is that I want to preserve the existing settings and add the new option defaults (the original design simply checked for the existence of the wpptopdfenh row in wp_options, and if present, would leave the contents alone; now, we need to preserve the existing options and add a bunch of new ones to the same field).

For now, the best way to test an svn build is to manually copy your existing settings, uninstall the old plugin, remove the wpptopdfenh row from the wp_options table, install the svn build, and then copy your saved settings back.

If you could try that and let me know if you still have a problem, I’d greatly appreciate it.

BTW, this weekend’s focus for this project is on the bullet image issue. ??

Cheers

Lewis

[elarson]

Hi Lewis,

I did follow the instructions “Notes for using the development version” and did it on 2 sites with the same results — existing settings being preserved, but no PDF generation.

I’ll give it a go later tonight with with deleting the wpptopdfenh row and will let you know.

Regards,
Ellyn

[Lewis Rosenthal]

Hmmm… I’ll go back over those directions and will test again, Ellyn. My apologies if I put anything in there which may have been misleading which has caused this. Of course, there could always be a broken file (I’ve had some <ahem> issues with my svn client, lately). Instead of using my own files for an upgrade, I’ll pull the package from svn and try to replicate your issue.

Apologies, again, for the trouble, and thanks so much for your continued valuable testing, feedback, and suggestions!!

Lewis

[elarson]

No apologies or thanks needed Lewis. I’m well aware of the caveats for working on development code.

I’m going a bit nuts, because on one site I got it working after deleting the wpptopdfenh row, but not on the other. Of course, it is not the site I need it on, so I have not yet been able to test changing the code for setLIsymbol.

Just as a note, on both sites, I appear to have two listings for “WP Post to PDF Enhanced” on the plugin page. I checked many times to make sure I had deactivated, deleted and then checked to make sure everything was deleted from the server.

I’ll let you know if I can figure out why it is not working on one of the sites. Please let me know if you get any further.

[Lewis Rosenthal]

Progress on one front, Ellyn:

I have setLIsymbol working. Note normal bullets in the HTML, and click the PDF link to see the rendered image files.

The syntax which I used along about line 338 in wp-post-to-pdf-enhanced.php was/is:

$pdf->setLIsymbol( 'img|jpg|4px|3px|' . WP_CONTENT_DIR . '/uploads/leaf_icon.jpg' );

which implies that I uploaded the image file (unconstrained, it is 24px x 38px) to the /uploads directory. The function takes care of constraining the image to suit.

It’s obviously not as elegant as CSS, and I haven’t yet tried overriding it for specific lists anywhere, but it’s a possible default entry to add to the admin UI.

Let’s break your upgrade issue out to a separate thread. I got stuck with some work over the weekend, so have not had a chance to dig into it to test, but I shall do so ASAP.

Cheers

Lewis

[Lewis Rosenthal]

New trunk build, Ellyn, as of March 31. This one adds admin settings to specify the use of a custom image, the type of the image file, width and height, and the file itself (which presently must be uploaded to the /uploads directory). See the sticky topic for development builds and/or the development log (RSS) available on the Developers page.

Cheers

Lewis

PS – If this works for you, we might want to think about marking this topic as resolved, and opening new ones for specific CSS/HTML/TCPDF issues, just to keep them straight.

[elarson]

Sorry to not get back sooner. I’ve struggled with trying to download the development version. Even if I get that working, my concern is that I really need 3 different list images (standard, warning, and information). That would mean that I would need this to work in CSS to be usable.

[Lewis Rosenthal]

We may need to go back to Nicola if CSS is a requirement here and we are not seeing the library respecting the code, Ellyn.

Are you still seeing the issue with two instances of the plugin showing up in the plugin list?

This promises to be another one of those weeks for me, but I’ll try to find some time to spend with this project to push the release (I know, I keep saying that it’s coming “any day, now” – it really is; it’s just the upgrade logic which is holding me up).

Cheers

Lewis