Bootstrap support in html to pdf conversion

[Marco]

Hi,
I am using WebKit rendering engine to convert HTML to PDF.

In HTML template I use bootstrap 4 grid and, after conversion, in the file created with HtmlConverterLibrary the layout I made is absent.

Can anyone help me to solve this problem?

Thanks a lot     

Attachment: bootstrapissue_96f778bd.zip

[Gowthamraj Kumar]

Hi Marco, 

Thank you for using Syncfusion products. 

We have checked the reported issues with HTML to PDF converter. Our HTML converter internally make use of Qt WebKit rendering engine for converting HTML to PDF. WebKit rendering engine preserves the output PDF document like how the input HTML file/URL is displayed on the WebKit based web browsers (safari). You can confirm these Bootstrap4 behaviors with Safari and our Qt WebKit browser (internal tool). We have attached a screenshot of the provided Bootstrap4 webpage (without print.min.css) view in safari browser and output PDF document for your reference. WebKit rendering engine itself, preserves the web page like below.  

Qt WebKit browser: https://www.syncfusion.com/downloads/support/forum/148653/ze/FancyBrowser-853395696  

Steps to use the WebKit browser (internal tool):  

1. Download and Extract the browser from above link.  

2. Copy and Paste the fancybrowser.exe into QtBinaries folder.  

3. Run the fancybrowser.exe.   

4. Browser window will open with default URL (www.google.com ) and you can also modified the URL and check the web page behavior. 

Bootstrap4 HTML view in Safari browser: 

 

 

Qt WebKit Browser image : 

 

WebKit Output Screenshot: 

 

 

Documents : https://www.syncfusion.com/downloads/support/forum/148653/ze/Document685991266  

Kindly please provide us the complete input HTML file (with all resource style, script, etc.,), code snippet, product version to check the issue in our end. So, that it will be helpful for us to analyze and assist you further on this.  

Regards, 

Gowthamraj K 

[Marco]

Hi, thanks for reply.

Print.css file contains mainly Boostrap4 code, here is url of the official source (https://getbootstrap.com/docs/4.3/getting-started/introduction/):

<link rel="stylesheet" rel='nofollow' href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">

And here is url of Bootstrap grid documentation:

https://getbootstrap.com/docs/4.3/layout/grid/

Does it work with WebKit?

Thanks a lot

[Marco]

Here is a basic example of grid system.

Thanks

Attachment: example_395c6d8d.zip

[Gowthamraj Kumar]

Hi Marco, 

Thank you for your update.   

As we mentioned in earlier, we are internally using Qt WebKit rendering engine for converting HTML to PDF. We have checked the provide HTML file in WebKit based browsers (safari, internal tool), the Bootstrap4 styles are not supported in WebKit rendering engine itself. So only the styles are not working in WebKit based browsers (safari, internal tool) as well as our converter. So, currently it is not possible to preserve the bootstrap4 styles on our converter. 

However, we have suggest you try our new Blink based HTML converter to overcome this issue. Blink converter internally make use of chromium executable in headless mode for converting HTML to PDF. And it have been converted properly to the provided html files. Kindly refer below link for more information of our Blink converter.   

 

Blink: https://help.syncfusion.com/file-formats/pdf/convert-html-to-pdf/blink  

KB : https://www.syncfusion.com/kb/10377/how-to-convert-html-to-pdf-using-blink-rendering-engine  

 

We have shared the generated output documents of WebKit/Blink HTML converters for your reference, 

Documents : https://www.syncfusion.com/downloads/support/forum/148653/ze/Documents-1453973630 

 

Note: Blink HTML converter is not supported in .NET Core. 

Please let us know if you need any further assistance on this. 

Regards, 

Gowthamraj K 

[Marco]

Thanks a lot! Using Blink it works!

Can you tell me if it will be compatible with NET Core?

[Gowthamraj Kumar]

Hi Marco, 

Thank you for your update. 

Currently, Blink rendering engine do not have support in .NET Core. We have already logged a feature request for “Support for HTML conversion using Blink rendering engine in .net core”. We will implement this feature in any of our upcoming releases and update the details in this forum. 

Please let us know if you need any further assistance on this. 

Regards, 

Gowthamraj K