Customizing Output

Well, you can start customizing your output using the new CSS feature introduced in version 1.0.1. However, if you wan to add elements to the output, you’ll need to query the WP database for them and then add them to the intermediate HTML. This involves modifying the core of the plugin and some knowledge of TCPDF.

I can’t promise that I’ll add all of what you want, but if you can be a bit more specific (there are already plans to include custom fields), I can see how your requests might be useful to others and will consider adding features.

When you say that you want a different layout, my read on that is that you want to rearrange the locations of various elements in the header and footer, and perhaps add a column of custom content. Is this what you are suggesting?

Cheers

Lewis

How can i edit for example a “p” style?

It’s sufficient to add:


p {
someproperty:somevalue;
}


Or i have to read documentation somewhere?

In the admin area, under PDF Formatting Options (output tuning), enter your css in the Custom CSS box and check the option to apply it to all PDFs (there is currently no facility to apply specific styles to specific pages/posts).

Of course, reading the documentation is always a good idea. ??

Cheers

Lewis

Let me explain:

In the documentation I did not and I do not find if it works with simple CSS proprerties inserted into directly.. Or… With strange name of tags, for example.

From what you say it seems to me that it’s strict normal CSS in that input field, and so that paragraphs are “p” (for example), and than that i can style simply with:


p {
someproperty:somevalue;
}


(for example).

I’m right? Thanks. ??

In effect it looked like a very stupid question but I had absolutely no idea how your PDF library create PDFs and so i do not know how you operate the input field and how that input field can apply CSS style to a PDF.

Just type in the CSS you want to apply, as though you were putting it in a file. Here’s an example which will at least show you that the CSS is getting applied:

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	font-family: inherit;
	font-size: 200% !important;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
}

Copy and paste the above into the Custom CSS box and click the box to apply it. Save your settings and then open a page on your site and click the PDF button. That should give you some idea of what it can do to the output.

TCPDF does not actually read an external file for CSS. Instead, the style data in the file must be embedded in the HTML fed to it. Storing it in the db is actually easier than providing a method for editing the CSS and then saving to an external file (though I originally considered doing that).

The roadmap for the plugin provides that at some point, we want the shortcode to allow for importing an external CSS file. This would/will make it easy to apply a specific set of styles to a single post (or group of them), overriding the site-wide CSS stored in the db.

If you look at the main class (wp-post-to-pdf-enhanced.php), scan down to line 365 (version 1.0.2) to see how we inject the CSS into the HTML for handing off to TCPDF:

// Apply global css, if set in config
            if ($this->options['applyCSS']){
	        $html .= '<style>'.$this->options['customCss'].'</style>';
	        }

You can see that what we’re doing is just taking the CSS from the database and wrapping it in <style> tags.

I hope this answers your question!

Cheers

Lewis

Oh, and it wasn’t a stupid question; please don’t think that at all. More to the point, my own documentation gives no clear example, so it is I who am at fault for not making this clear. I realize that it’s not all that intuitive. So, what I should do is make a bug report in my tracker to clarify either the docs or add a hint to the admin panel to make this a little easier to grasp at first glance.

Thanks for mentioning it to me!

Lewis

Thank you for reply, here’s what I am trying to do.
A 3 pages PDF, I want to divide the post’s contents into 3 pages like for example the featured image will be the first page. The main content in 2nd page, and the custom fields’ data in the 3rd page.

(Thaks Lewis. I’ll try to style the body of the article simply with “body” and “p”. Have a nice day.)

You might try to start your content with the wpptopdf_break shortcode. This should put the page break before the text, but after the featured image. Insert another one at the end of the content, and that should give you another page after. That said, if your custom fields show up in your content and you want to move them to the last page in the PDF, that’s a taller order. ??

Likewise, adding custom fields to the PDF can be done manually (search the threads here, you’ll find one solution to this), but it requires hacking some of the core of the plugin, though I do want to add this ability at some point.

Cheers, and good luck. Please let us know how you make out!

Lewis

Any further issue with this, or is the current CSS box working for you?

If no more issues, I’d like to close this as resolved, even though the OP has not followed up (though I still have not addressed the custom fields issue).

Cheers

Lewis