Generating a PDF in Bubble

Hello,

I was just wondering what’s the experience of other Bubble users about the PDF generation because it seems that we have a few plugins but at the end all have something missing like no multiple page, printing an image instead of a text, slowness, …

So I was thinking :thinking:, is that difficult to generate a PDF? I’ve seen that in other custom apps people use Jspdf but I guess that’s a difficult thing to implement in Bubble.

How custom codes apps can generate and download a PDF almost instantly? in bubble with selectpdf it takes about 5 seconds.

I’ve created this topic so that maybe we all can share our thoughts and see what’s the best option for PDF creation such as invoices for example.

Also @josh, do you mind giving us an update about the SelectPDF replacement?

Thanks a lot to all for listening and adding your value.

Have a good day!

I am in no way super experienced, but I tried this and found that making PDF’s from HTML can be pretty difficult. I tried making a plugin with the jsPDF but I ended up only using part of it and then passing the images I created to the PDF Conjurer because it worked really well and could be used on the backend. It seems to work instantly. We have it set to save the pdf’s and email a copy and it works great. I would recommend that Plugin. This is the code I ended up using for converting an element to an image and then just passed that image to PDF Conjurer. Maybe someone can share an easier way.
instance.publishState('pdf_img', null)
window.scroll(0, 0);
var element = document.querySelector('#' + properties.element_id);

var options = {
    useCORS:true, imageTimeout: 1500, dpi: 192
};

var opt = {
    margin:  1,
    filename: properties.filename,
    html2canvas:  {useCORS:true, imageTimeout: 1500, dpi: 192},      
    jsPDF:        {unit:'px', format: [properties.width,properties.height], orientation: properties.orientation, hotfixes: ['px_scaling']},
    pagebreak: { mode: ['avoid-all', 'css', 'legacy'] },       
};

html2canvas(element,options).then(function(canvas) {
    instance.data.pdf 
    html2pdf().set(opt).from(canvas).outputImg('datauristring').then(data => {
        context.uploadContent(properties.filename, data.substring(data.indexOf('4') + 2), function(err, url){
            instance.publishState('pdf_img', url)
            instance.triggerEvent('pdf_created')
        })
    })

});`
2 Likes

I personally use Docmosis which renders PDF and Docx. It’s a paid service with a trial, and connects via API and they have guides on their site. However, PDFs are generally also easier to come by on free services than Docx which is why I’m subscribed to them.

1 Like

Thanks a lot.

A bit tricky though.

Still is super weird that there is not an easy way to it. PDF Conjurer works great but has some limitations.

The easiest/best I’ve found is DocMaker plugin.

The best free one is PDF conjurer - takes a bit to get your head around and can be fiddly but it’s pretty good once you’ve mastered it :slight_smile:

2 Likes

Hey @equibodyapp

The best free option is PDF conjurer but also lacks of some kind of customization.