4

I have a VF page built on Lightning Design system (LDS) framework. When I add the renderAs="PDF" attribute, pdf does not show the content with LDS CSS/Style.

Reference Link: SLDS not rendering CSS styling when VF renderAs PDF

Note1: apex:page tag has all the usual attributes which is required for pdf *

(showHeader="false" sidebar="false" standardStylesheets="false" docType="html-5.0" applyHtmlTag="false" applyBodyTag="false")

Note2: Salesforce supports external stylesheet. That is, CSS file stored in Static resource. Link of example: Creating Professional PDF Documents with CSS and Visualforce

I also copied the whole css content from the LDS CSS file (Path: 'assets/styles/salesforce-lightning-design-system-vf.min.css') and applied as inline CSS in VF page. But still, there is no luck.

My styleSheet is referred in VF page as below

apex:stylesheet value="{!URLFOR($Resource.SLDS221, 
    'assets/styles/salesforce-lightning-design-system-vf.min.css')}"

Page works absolutely fine if it is not rendered as PDF.

Any suggestions?

  • looks similar to this salesforce.stackexchange.com/questions/133649/… – vladdihoney Jun 13 '17 at 6:01
  • @VladyslavKushney Yes Issue is similar, but the accepted solution for that issue is absolutely WRONG. Salesforce accepts the Internal and External styles(mentioned in Note2), Additionally, I made a comment on that issue as well. Thanks for linking this with that. – Syed Moosa Nazir TN Jun 14 '17 at 4:47
6

It is a common assumption that the HTML to PDF engine presently used by Salesforce is Flying Saucer that only supports version 2.1 of CSS (W3C Recommendation 07 June 2011) whereas SLDS is designed to work with modern browsers only that support version 3 CSS.

So while you may be able to eventually get some parts of the SLDS markup to work, the PDF output is unlikely ever to be as you would like it to be. Including simple CSS used just for the PDF output is the simplest workaround.

  • 2
    You can try to get in the Summer'17 Pilot "Use Advanced PDF to Render Visualforce Pages as PDF Files": releasenotes.docs.salesforce.com/en-us/summer17/release-notes/… – Fabien Taillon Jun 13 '17 at 8:14
  • @FabienTaillon Thanks!. As you mentioned, its a pilot product which we cant relay on it. It is subject to change at any time. I will request Salesforce to enable this feature to test my code. But in simultaneously trying to figure out this issue. – Syed Moosa Nazir TN Jun 14 '17 at 4:55
  • @Keith. Thanks!. I feel you are correct. Salesforce use a legacy versioned tool to generate pdf which is not supporting the advanced CSS/Styles. I end up by converting into simple CSS. Thanks for your clarification. – Syed Moosa Nazir TN Jun 14 '17 at 4:59

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.