Render Skuid pages as PDF

Any news on the PDF print option for Skuid yet Anna?

I would also like to have this feature! Any updates or workarounds to get a skuid page to pdf?

We have done some initial exploration of this possibility but run into enough problems that we decided to set it aside in favor of more actionable targets.  We totally recognize the need for this and our executives pretty regularly glare at us for not having delivered yet…  I’ll consider your voice added to the chior. 

I totally understand the struggle on this one…

I come from a MVC .NET c# background and used to have to do this all the time and it was very very difficult until this guy made this component. Not sure if it will help at all or if it might spawn up Ideas but there is a component (Free) out there that I used all the time in Dev on .NET MVC. All I had to do was feed it HTML and it would take care of the rest…

The component I used was called WKHTMLTOPDF and this guy made a .NET wrapper for it but the source WKHTMLTOPDF is open and not just for .NET. 

Maybe some super Dev out there can wire up something like this for Force.com and just dump HTML to it and poof … PDF 🙂


https://github.com/tuespetre/TuesPechkin

https://github.com/wkhtmltopdf/wkhtmltopdf

+1

+1 I am evaluating Skuid and thought this would be native capability…I’d hate to have to go build a Visualforce form. Charts output to PDF, so I’m hoping we’ll see this soon. I would like to produce a meeting agenda and attach it to the record as a PDF.

+1

Great to have such feature.

+100 🙂

There are some ideas in this Idea thread (specific to pdf generation)
https://community.skuid.com/t/idea-page-to-print-page-to-pdf-page-to-email-page-to-conten…

We went the DocRaptor route and wrote an Apex class that waits for DocRaptor to return the pdf, then we grab it and attach it to the record of choice (we pass id in our snippet, along with the custom Name we want the document called.)  It is working great for us - downside is you pay DocRaptor per document (not licensed user.)  For us it ended up being a fraction of the cost and SO much faster then another popular Salesforce pdf generating tool that rhymes with Bonga.

So basically we create our “document” in a Skuid page - with all the flexibility that Skuid provides, then send all that content to DocRaptor, which returns the pdf.

That said, we would love to have this native in Skuid!!

Thanks Chandra! I am testing it out now. Pretty straight forward to get set up. The issue I am running into is my Graphs/Charts are not fitting on the page. I.E. the margin is big on the left and so the chart is getting cut off in October instead of showing all the way to February. Have you figured out the best place to tweak the CSS to keep the width of a chart all on the same page? Thank you for your help!

Hey Rich, We JUST finished our first report containing charts. There was a lot of tweaking that went on to get it to fit, but we did!

Here’s what I did:

• for all my pdf Skuid pages, I apply a custom theme that I exclusively use for documents. The primary purpose of this was to shrink everything down: adjusted font size (Global level) to 11 px, reduced padding and margins in field editors and tables, removed some borders - stuff like that.
• My Wrapper that gets sent to DocRaptor (contains all my content) I put a max Width of 735 px. This number just came from playing around with it.

For my document that has charts (I did 2 columns of charts… see below for the screen shots):

• I used panels to put the charts (not responsive grids, because I wanted them fixed) and set the max height of my charts to 275px, pie charts to 300px (again… I have 2 columns of charts, so your might allow for a larger height. But I found restricting the height made the chart not expand off the page.
• I used the chart Sub-Title for my title, not the Title (the title font was too big, sub-title was better for me.)
• We wrote a before render snippet and put it on each chart to reduce the axis fonts and the Legends (for pie charts especially, the legends were HUGE and made the pie super small.) This makes these changes be in-line, and thus get passed over to DocRaptor.

var params = arguments[0], $ = skuid.$;

params.legend.itemStyle = { “color”: “#333333”, “cursor”: “pointer”, “fontSize”: “8px”, “fontWeight”: “bold” };

if (params.chart.type == “line”){
params.xAxis[0].labels = { style: { “color”: “#666666”, “cursor”: “default”, “fontSize”: “8px” } };
params.xAxis[0].title.style = { “color”: “#666666”, “fontSize”: “10px” };
params.yAxis[0].labels = { style: { “color”: “#666666”, “cursor”: “default”, “fontSize”: “8px” } };
params.yAxis[0].title.style = { “color”: “#666666”, “fontSize”: “10px” };
}

else if (params.chart.type == “pie”){
params.legend.labelFormatter = function() {
var words = this.name.split(/[s]+/);
var numWordsPerLine = 3;
var lbl = ;

for (var word in words) {
if (word > 0 && word % numWordsPerLine === 0 && words[word] != ‘(SUM)’)
lbl.push(’
');

lbl.push(words[word]);
}
lbl.pop();
return lbl.join(’ ');
};
}
else {
console.dir(params);
}

This is still an active development project for us. We are getting close, but still have some styling work to do before we start sending these reports to our customers.

Hope some of this is helpful!
Chandra

Amazingly helpful and thorough! And so quick! You are awesome!!! Thank you so much for your help! Appreciated beyond belief!

Follow up question. Any luck with images? I have tried three different methods and all do not work.

1. I have a template that shows a picture of the user. I am using img src = and it returns the full absolute URL of the users picture. (as suggested by DocRaptor)
2. I have also tried Tables with “Photo VIew” set so I am only seeing pictures of my assets.
3. I also tried the image component.

Those pictures show up fine in the Skuid view but don’t show up at all in DocRaptor. I have submitted a question to DocRaptor but wondered if you had overcome this issue yet. If not I will continue figuring this one out and post when I come up with a solution.

Thanks!
Rich

DocRaptor’s response was: "Your images aren’t loading for me in my browser. It looks like they require you to be logged in to load, and obviously our render is not logged in on that server. We have to have access for them to appear. " ME: Can you point me to any direction on using Salesforce with your service. All my information is coming out of Salesforce via VisualForce pages. DocRaptor is accessing all the other information on the page from Salesforce and it is coming over fine. Can DocRaptor access the picture info or do I have to go with a private server option like Prince? DocRaptor: “We use Prince as our PDF renderer (but have a separate and much better JavaScript parser). I don’t think Prince will help you in this situation. Somehow, you are grabbing the HTML of the page and sending us that HTML. Your only real option to get the images is to also get the images and send them to us as part of your HTML. I’d recommend using bae64 encoding to pass us the images.”

We use a company logo image on some of our reports but have the images hosted on a part of our external company website, which is publicly accessible.  That doesn’t help for your profile images, so keep me posted on what you do in case we run into a similar problem!

Oh - for our Skuidified community, we found we had to put images in salesforce “Documents” and mark “Externally Available Image” to true in order for community users to see it.  That may be another option for you.

This reply was created from a merged topic originally titled Skuid Page as PDF !!. Hello,

In skuid Can we save our skuid page in PDF format like we do in VF pages by using Render As attributes?

Please tell me how we can do this?I want to save my Skuid Page in PDF format.

Looking ahead for an quick Response,

Thanks.

Hello, and thank you for this wonderful post. We have been trying to get away from Drawloop and this is the perfect solution. I got the script working with DocRaptor, but I can’t figure out how to get Salesforce to auto-attach the document to the record. Could you elaborate on how you did this? 

Thank you!

Sam - Chandra outlined this here: https://community.skuid.com/t/idea-page-to-print-page-to-pdf-page-to-email-page-to-conten…

about halfway down, look for global class AFLattachAsPDF