Salesforce Cookies #14

      No Comments on Salesforce Cookies #14

How to use Lightning component into a Visualforce page

Sometimes, you might have a situation where you want to access your lightning component in the Salesforce classic view and here ltng:outApp comes into picture.

ltng:outApp : Is a component in the long namespace which is used to expose your lightning component outside of the lightning experience.

Sample Code

We need to wrap a component in a lightning app and make sure that lightning app is extending the ltng:outApp component. Look at the below sample code.

After creating the lightning app, we will have to create that lightning app in the VF page along with the lightning component in the script. In order to create these 2 resources, we will have to use apex:includeLightning tag.

apex:includeLightning – Includes the Lightning Components for Visualforce JavaScript library, lightning.out.js, from the correct Salesforce domain.

Look at the sample code which is creating the lightning app with it’s lightning component.

As you can see in the above code, we have defined a

which will work as the container. We are using the $Lightning variable in the script and passing the required parameters such as lightning app name, lightning component name and the div element id.


We have managed to see the lightning component in the VF page and here is the output.

Screenshot 2019-03-29 at 8.44.01 AM.png

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.