function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Abby StockerAbby Stocker 

Visualforce page to lightning component

I am having a lot of trouble making my visualforce page a lightning component action on my custom object. Any help is greatly appreciated! My visualforce page is called DeliveryNew
​​​​​​​User-added image
User-added image


























 
yogesh kherajaniyogesh kherajani
Hi  Abby Stocker

You can select action type as custom visualforce from the dropdown:
User-added image

thanks
 
Abby StockerAbby Stocker
Thank you, I will try that. What needs to be added to my code to add it as a lightning component? I replicated the code from another VF page that is a lightning component so I am curious as to what requirements I am not meeting to add it as one. Thank you! 
Abby StockerAbby Stocker
Also, when I add this as custom visualforce action and then add it to my page layout, it does not give me the option to download as PDF. The VF page that i copied the code from does. I am trying to figure this out with very minimal developer experience so any help is greatly appreciated. Please let me know if screenshots are needed. Thanks! 
yogesh kherajaniyogesh kherajani
can you please share your code
 
Abby StockerAbby Stocker
<apex:page standardController="Claim__c" renderAs="pdf" standardStylesheets="false" sideBar="false" showHeader="false" applyBodyTag="false">
    <head>
        <title>Claim PDF</title>
        <style type="text/css">
            @page {
                margin-top: 10%;
                margin-bottom: 10%;
                margin-left: 5%;
                margin-right: 5%;
            }
            * {
                font-family: Arial;
            }
            div {
                padding-bottom: 1em;
            }
            table {
                text-align: Left;
                margin-left: auto;
                margin-right: auto;
            }
            th {
                font-weight: bold;
            }
            .arhausTitle {
                font-size: 12px;
                line-height: 0px;
                text-align: center;
            }
            .formTitle {
                font-size: 11px;
                text-align: center;
            }
            .formFooter {
                position: static;
                bottom: 0;
                font-size: 14px;
                text-align: left;
                align-content: left;
                line-height: 24px;
            }
            .contactColumn {
                width: 50%;
                float: left;
                text-align: left;
            }
            .formBlanks {
                width: 20%;
                margin-left: 0;
                margin-right: auto;
                font-size: 14px;
                empty-cells: hide;
                text-align: left; 
            }
            .formBlanks td {
                width: 37%;
                text-align: left;               
            }
            #emptyCell {
                width: 5%;
                border-bottom: none;
            }
            .formTable * {
                font-size: 11px;
                border: 1px solid black;
                border-collapse: collapse;
                empty-cells: show;
                padding: 5px;
            }
            .formTable th {
                text-transform: uppercase;                
            }
            .formTable td {
                text-transform: none;
            }
        </style>
    </head>
    <body>
        <div class="Title">
            <div>
                <apex:image url="{!$Resource.QuoteLogo}" width="300px"/>
                
                <p></p>
                
                <p>Phone: (440) 439-7700 Fax: (440) 449-7073</p>
            </div>
        </div>
        <div class="formTitle">
            <h1>Delivery Charge Claim</h1>
        </div>
        <div class="formBlanks">
            <table>
                <tr>
                    <td>Order #: {!Claim__c.Order_Number__r.Name}</td>                
                </tr>
                <tr>
                 <td>Claim #: {!Claim__c.Name}</td>
                    </tr>         
        </table>        
    </div>
    </body>
    </apex:page>