Auto-generate PDF with product metafields?

[charhew]

Hi all, I'm looking for a way to create a "DOWNLOAD PDF" button on each product page that lets the user automatically generate and download a PDF that contains all the metafields of that particular product.

Each of my products has a bunch of metafields (specs such as weight, color, finish, etc.) and I want the user to be able to download these specs in PDF form, without creating these PDF's myself manually.

Any suggestions for how to do this?

[Amanda]

I'm curious if you ever found a solution for this? We're attempting to do the same thing.

Thanks!

[charhew]

In the end, we just hired a Shopify Expert to do it. 

[Amanda]

One of our sites is for a wholesaler, but haven't ventured into something like this yet. As you might know, Shopify uses its own unique code. Any chance you know if they used an app to resolve it or they coded it via liquid? What's your site? We would love to take a peak at it.

Thanks in advance for your help.

[charhew]

All done through Liquid/JavaScript/HTML as far as I can tell. No apps were installed. We used a library called jsPDF.

My process was a bit convoluted: first, I got my programmer friend to code the PDF-generator for me, and he was able to do it using jsPDF (just in the code). The only issue with his code was that it would sometimes generate the incorrect image. That's when I hired the Shopify Expert to fix that one bug. So basically, the end result is a mish-mash between my friend's code and the Expert's code. However, I have no doubt that a Shopify Expert would've been able to do all of the code from the beginning.

My site is www.maxilite.lighting. Just go to any product and click Download Spec Sheet.

[Amanda]

Thank you so much! We are coders, so hopefully this will help out. If we have any other questions, do you mind me sending you a follow up?

Thanks a ton!

[charhew]

Good luck! Sure, no problem.

[Amanda]

By the way, is the system auto generating the line sheet or do you have to create PDF's for each one?

[charhew]

Not sure I understand the question. Are you referring to the empty table at the bottom? That's just made up of a bunch of lines and text (drawn with jsPDF) that are absolutely positioned on the page. I kind of just hacked it together, haha

[charhew]

To be honest, our code is quite messy. If you look at it, you'll notice that one giant textbox holds all the keys (Model:, Finish:, etc.) and the second textbox holds all the values (MX 1234, Polished Chrome, etc.). Then I positioned these 2 textboxes side-by-side so that it appears to be a table with rows. But it's actually just 2 textboxes side by side. Maybe you can find a more elegant way to do this.