Transforming Wysiwig HTML to PDF output - html

Using "wkhtmltopdf" as a PDF generator, and CKeditor as a Wysiwig editor, the font-size looks different between what I see in my browser, and what is shown in the PDF.
I tried many things: changing the font-size to cm/px/pt, changing the font-size percentage on the body ... but I can't find a way to have the same look in my HTML editor and in my PDF.
Is there some kind of link between PDF font-size and html one's ? Is the output in a PDF smaller than the one in a browser ?
Does someone already managed to obtain the same look in a WebBrowser than in a PDF using those kind of PDF generation tool ?

I found a satisfying solution.
I tried to import font using #font-face, but this doesn't work for me, because multiple #font-face for each "style" (italic, bold, bold+italic) was not recognized by wkhtmltopdf.
I had to use a "free" font ("DejaVu Sans" in my case) that was available on my Windows system and on the Linux Server and is directly available by the system when it generates the PDF.
Those two fonts now renders similarly between my Wisywig and the PDF generated. I also had to use a lot of CSS rules to make it clean, removing PNG images ... but that's another story.

Related

embed a pdf archive like it were part of the html code

i had a little question, i want to embed a pdf like it were part of the website, i could rewrite the pdf in html but it will be a lot of work, what would be the best looking option to embed it?
The pdf has pictures and letters with fonts and columns.
Thanks.
I would go with one of the two approaches. One is a native rendering of the PDF content in a DOM node, using PDF.js. It is an open source library that's used as the default PDF viewer in Firefox.
Another way is to emulate the look by converting the PDF pages to images when the PDF is uploaded. You may use imagemagick to parse the pages, and display the content in a slideshow/gallery widget.

HTML to PDF convertion and editing in iOS

I am creating an iPad application for reading PDF, this PDF should be generated from a HTML file. I have seen some sample codes for converting HTML to PDF, and I think that part will be fine for me to implement.
I have seen some apps from from AppStore for reading PDF files, in that there is an option for increase the font size (not zooming), color style etc. When we increase the font size the text content automatically wrapping to next line. How can I implement this in my app? Any idea about how would they have done that?
I have seen in some posts that, it is not possible to edit a PDF file, so are they actually using PDF file or some other format?
When rendering your PDF to show it to user, you can convert it in other formats like HTML and then allow user to change font-size, font-style. So your PDF remain unchanged. Also it is easy to manipulate HTML than binary formatted documents like PDF.

C# control / code to display local HTML file with image tags and CSS

I am developing an application and part of the design is there is a local folder with HTML files and a folder for images that the HTML files use.
The HTML files can have in-line CSS declaration which will also need to be displayed / rendered. The CSS will be VERY basic like font size , color, padding, etc, but nothing advanced like CSS 3.0 or even advance CSS 2.0 features.
The HTML files are not complicated, just text in tags with a few image tags in there with some CSS to style on some tags. There will be NO JavaScript, NO PHP, etc.. and all the files are local and not loaded from the web.
I can't seem to find a control or code online to display this kind of file contents. I have found some code that will display HTML code but it does not render CSS or render images. This control needs to be read only so the user can not edit the view.
I am using Visual Studio 2010 and my application uses WPF WinForms in .NET 4.0.
Just to clarify what I want, I want code to render the above HTML files on my form or a control that allows me to render those HTML files. The control needs to be able to support a scroll bar if the HTML file contents don't fit the control. The control also needs to be able to resize if the form is resized.
Thank you, I look forward to seeing some solutions to this problem! I have never done this before and am excited to see what is available and what you have done in the past to solve this problem!
Use the WebBrowser control and call the Navigate method with Uri pointing to your local file path of your HTML files. The browser control can be displayed inside any Wpf container (grid/border/stackpanel etc).
Reference example is available at msdn.

Any good way to convert html table (with colored text, images, etc) to Word, pdf, or Excel

I have a html table. Inside the table are images, links (different font colors, etc). What is the easiest way to get this exported into an ms office format (powerpoint, excel, word, pdf)? I was going to start hand writing this but figured I would throw out this question if there was any thing that would help with this conversion . . . my really low budget solution is to take a screen shot and resize to fit on a page!
You can install a PDF printer and open the html in a browser, then choose print, as if to a normal printer, and the output is converted into a pdf.
For windows you can download and install from this page:
http://www.cutepdf.com/products/cutepdf/writer.asp
This software:
http://www.cutepdf.com/download/converter.exe
http://www.cutepdf.com/download/CuteWriter.exe
For other operating systems it is probably a built in feature when you try to print.
It doesn't always work perfectly, but most of the time I can open any html files I have in adobe, and it will auto convert them to pdf and you can save, usually everything looks the way it should. You can also just open the html in word, but it doesn't work so well if you are using any css.
This page has information on transforming XML to Word XML format: http://www.linkwerk.com/pub/xml/invitation/xml2wordml/
I haven't used it, but perhaps it will be helpful.

Getting PDF to stay in an embedded <object> or <iframe>

I've edited this quite a bit and bolded my question at this point. I realize that PDF won't be fully controllable in the browser, but that's not my issue here. My problem is, well, below in bold.
<div>
<object
data="${pageContext.request.contextPath}/UB04.xml"
type="application/vnd.adobe.xdp+xml"
width="415" height="500"/>
</div>
The XML is actually an XDP file; it gives dynamic data and a URL for a static PDF, and combines them in Adobe Reader. This displays in the browser as desired if it's a PDF, but when put in as an XDP, it takes control of the window and opens itself fullscreen to display the PDF. Serving an all-in-one XDP (with the PDF embedded as base64) has the same issue.
Help me make the XDP behave the same as a PDF?
Alternatively, if I can use iText to glue together the XDP XML and the static PDF template, I can serve the PDF directly, which seems to work just fine. Just not sure how to create PDF that route, which is somewhat underwhelmingly documented online.
This behavior is dictated by the user agent (client), and that is how it should remain. Sorry.
One possible solution: use iText to join the data into the PDF, skipping XDP entirely.
What you are looking for is called Adobe Flashpaper:
http://www.adobe.com/products/flashpaper/examples/
Otherwise you cannot dictate how the user will view the PDF.