Customizing PDF File

[madpato]

Hello

I am following this entry in the wiki: http://fabrikar.com/forums/index.php?wiki/pdf-output/

But im struggling with some parts, i have installed fabrik libraries and created my custom template and i want to align all the elements to the left with their content next to it (pretty basic). But it does not work, here is my code:

#{$form_1} .fabrikElementContainer.span12 {position:relative;margin-bottom:10px}
#{$form_1} .fabrikElementContainer .span4 {display:inline-block;width:30%}
#{$form_1} .fabrikElementContainer .span8 {display:inline-block;left:31%;width:68%}

I have only one form when i render the pdf it shows the same as the original template so, probably i am doing something wrong in my custom_css.php this code is the only thing i have there. Trying my first steps...

On the same topic i want to add the logo of the website to the pdf on the top right corner, how can that be done?
I am not a developer just a joomla advanced user trying to make fabrik work on a small project.

Regards.

 

[troester]

1. It's #{$form} (not form_1). Fabrik will replace $form with your current form/details_X, so you'll get e.g. #details_1

2. The CSS is an example, you must adapt it. It may also depend on your Joomla template. See also http://www.fabrikar.com/forums/index.php?wiki/form-and-details-templates

3. Enable "Debug PDF" in Fabrik options [Debugging] to see the generated HTML/CSS code on you screen, to see if your custom CSS is loaded etc. You can examine with your browser console, but keep in mind that the CSS rendering on screen is not identical to the PDF (especially "float", that's why

 

[madpato]

Hello thanks for your reply, if i enable debug pdf i see it on screen fine (custom is loaded) but if i disable it i got it all messed up again when the PDF is created. Im trying to find out how to manage it to work but at least is a start. Any insight on this is appreciated.
On the same topic, how can i insert the website logo inside the template? like just call the same logo used on the website template.
Regards.

 

[troester]

In the screen debug you can see (in your browser dev console) which HTML/CSS will be sent to the PDF, i.e. if your custom CSS etc. is defined and applied correctly.
But you won't see the exact PDF rendering (e.g. the PDF doesn't render float).

To include images add the HTML in your custom PDF details template.