3

I want to known suggestion about lightning design system rendered as PDF. I have a VF page that page rendered as PDF format. My page is also using lightning design system. but that designs are not rendered in PDF view. So any suggestion or Idea is most welcome. Here my code is

<apex:page renderAs="pdf" applyHtmlTag="false" sidebar="false" showHeader="false" standardStylesheets="false">
    <html>
    <head>
        <apex:stylesheet value="{!URLFOR($Resource.SLDS, '/assets/styles/salesforce-lightning-design-system.min.css')}"/>
    </head>

    <body>
        <div class="slds">
        <div class="slds-grid slds-grid slds-wrap slds-grid--pull-padded" style="text-align: center;">

            <div class="slds-col--padded slds-size--1-of-1">
                BAR CODE HERE
            </div> 

            <div class="slds-col--padded slds-size--1-of-1">
                16JULCOM
            </div>

            <div class="slds-col--padded slds-size--1-of-1">
                00004
            </div>

            <div class="slds-col--padded slds-size--1-of-1"> 
                <div class="slds-grid slds-wrap slds-grid--pull-padded">
                    <div class="slds-col--padded slds-size--1-of-3">Time Stamp 1</div>
                    <div class="slds-col--padded slds-size--1-of-3">Time Stamp 2</div>
                    <div class="slds-col--padded slds-size--1-of-3">Time Stamp 3</div>
                </div>
            </div>
        </div>
        </div>
    </body>
    </html>
</apex:page>
7
  • Please share code else it will hard to assist with Jul 29 '16 at 10:12
  • I attached my code here @MohithShrivastava
    – MSCB
    Jul 29 '16 at 10:17
  • Can you say ApplyHtMLtag=false and have html tag yourself written Jul 29 '16 at 10:33
  • Its does not work. I updated my code @MohithShrivastava
    – MSCB
    Jul 29 '16 at 10:44
  • Everything should be under main div with class SLDS.I think you may need that Jul 29 '16 at 10:54
1

Rendered as pdf does not allowing Internal and External style classes it only allowing Inline styles.

1

LEX is not supported in RenderAs Pdf right now. See trailhead for lightning experience module. Trailhead

You have to remove it to render as PDF or you can use other JS libraries like Pdf.js

-1

Visualforce pdf supports internal and external css files. But the issue is SLDS css file is not supporting in Visualforce PDF for some reason. The below URL works fine with internal CSS file(stored CSS file in Static resource)

https://developer.salesforce.com/page/Creating_Professional_PDF_Documents_with_CSS_and_Visualforce

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.