Convert Bootstrap Page to PDF?

Question

I am looking for a way to convert a page designed using Bootstrap to PDF. I have been playing around with jsPDF and am able to save content as pdf, but I am unsure of how to translate the design into pdf as well.

Has anyone done this before, or does anyone have suggestions?

Read the [HTML to PDF tutorial](https://developers.itextpdf.com/content/itext-7-converting-html-pdf-pdfhtml). The tutorial uses Java, but the libraries are also available in .NET. As for creating a design, please read [How to create template and generate pdf using template and database data?](https://stackoverflow.com/questions/50921762/how-to-create-template-and-generate-pdf-using-template-and-database-data-itext-c) — Bruno Lowagie, Jun 27 '18 at 06:35
Thanks, @Bruno Lowagie. I actually got a workable solution using both jspdf and html2canvas. I am using PHP5 and JQuery so that worked for me. Also, why are people so downvote happy, I asked a reasonable question? — Bad Programmer, Jul 03 '18 at 18:49
Apart from the down-vote, I see also two close votes. When voting to close, you need to give a reason why you voted to close. That reason is: the question is off-topic because you're asking to recommend a product, tool, library,... As explained in the Stack Overflow FAQ, such questions are not welcome on Stack Overflow. I hope this helps you understand why you received a down-vote. Personally, I prefer close-votes because your close vote only counts if you explain why you want to close the question. — Bruno Lowagie, Jul 04 '18 at 06:26

score -1 · Accepted Answer · answered Jul 03 '18 at 18:53

my workaround was to use html2canvas to create an image of the web page, and then save that image as a pdf using jsPDF.

<!-- jsPDF -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.4.1/jspdf.debug.js" integrity="sha384-THVO/sM0mFD9h7dfSndI6TS0PgAGavwKvB5hAxRRvc0o9cPLohB0wb/PTA7LdUHs" crossorigin="anonymous"></script>
</html>

<!-- html2canvas -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.min.js"></script>

<script>
    html2canvas(document.body,
    {
        onrendered:function(canvas)
        {

            //create image from web page
            var img = canvas.toDataURL("image/png");

            //create pdf object and add image to it, and then save
            var doc = new jsPDF('landscape');
            doc.addImage(img,'JPEG',5,5);
            doc.output('save', 'path/and/filename');

        }
    });
</script>

Convert Bootstrap Page to PDF?

1 Answers1