Lightning out – Jitendra Zaa's Blog

Show Lightning component on public website without authentication

I have posted few articles on Lightning Out. In this post, we will see how Lightning components can be displayed on public website. To access these Lightning components, users don’t need to login to Salesforce.

For this post, I will consider Text slider component created in this post. Using this same method, I have displayed Live demo of Lightning component on wordpress blog.

What do you need :

Option 1 [Used in this blog post] :

Public Site or Public Community Page
Visualforce wrapping Lightning App marked as Lightning out
This website – https://JitendraZaa.com added in Salesforce CORS setting, so that Salesforce can be added as iframe in this website
Embed public site as iframe

Option 2 :

Follow this documentation
Import Lightning Out Javascript Library in your website using Community URL
Use JavaScript SDK to create Lightning application dynamically

Live Demo using Public Site and Visualforce :

Use Lightning Components on external websites – Lightning Out

Show Lightning Component in Node.js using Lightning Out

If you were the users of IGoogle, few years back, you would be excited to know that web development is progressing in that direction. Architect of web application development is getting shifted towards component based development by introducing concepts like Web Components and frameworks like polymer and Lightning Components. One of the possible use case of component driven development is ability to use whole component externally. In IGoogle, components were built by partners and then was exposed as widgets to be used on your custom Google home page. Salesforce product team, being visionary came up something like this by introducing Lightning Out. With the help of Lightning Out, we can surface our existing Lightning Component to external websites. Previously, we already discussed that how Lightning components can be used on Visualforce pages using Lightning Out.

Let’s see how we can do it.

Use Lightning Component in Visualforce Page

Use Lightning Components in Visualforce Pages

In all of my projects currently, I have stopped creating Visualforce code. well, thats partially correct ;). I still need Visualforce page because most my clients are still on classic / Aloha Salesforce. However, If you have noticed, all Salesforce release notes, talks, webinars, Dreamforce focuses on Lightning experience. And I can say with confidence that Lightning is really really very cool. Sky is limit to your imagination, You can unleash hidden talent within you. Well, all talk talk… and you may be thinking, how can I start with Lightning Component? My client don’t even want to move away from classic. Its lots of work and money for them.

Well, here is an Idea what I am doing. I still uses Salesforce classic, still uses Visualforce but behind the scene, magic… tadaaa , Lightning Component. I will show walk you through this, how its being done.

We will use existing Flipcard Lightning Component to display on Visualforce page. Once Lightning Component is created, we need to create a Lightning Application to act an as a container.