Step A: Add External URL to white list
...
a. As shown below and the in the sample code snippet, the lightning App is AS_WITForLightningOut which was created on Step B.
...
...
...
3. Also provide the exact name of the Lighning Lightning Component which holds the flow
a. As shown As shown below and the in the sample code snippet, the lightning component is ASFundraisingFlow.
Make sure to have a unique id for <div> element which will serve as container of the lightning App that is going to be rendered and must match the third parameter of the component creation method.
a. <div id="AS_WITForLightningOutContainer"></div>
b. Must match the third parameter of the method createComponent.
Make sure to provide the right domain of the org to call on the lightning.out.js resource. As shown below the domain is https://alphasys-a.my.salesforce.com.
a. <script src="https://alphasys-a.my.salesforce.com/lightning/lightning.out.js"></script>
...
6. Also make sure to provide the right site endpoint of the Experience Cloud of the org. a. Just simply replace .my.salesforce.com of the domain with .force.com.
Step D: Applying the lightning out on external sites
1. Applying the lightning out on a WordPress site.
a. Login to WordPress site.
...
e. Apply the constructed code snippet for lightning out on the content editor and click Update/Publish button to save.
...
f. Test the flow to see if its rendering.
Our flow requires a campaign ID as refrence reference to all the data and configurations
needed. We now mush add the AS_Campaign_Id parameter on the URL with the campaign Id value. For this example, the URL is https://webforceconnect.alphasys.com/wit-lightning- out/?AS_Campaign_Id=7015g000000xNl6AAE
As shown below the flow is successfully rendered on the craeted created WordPress page.
...
2. Applying the lightning out on a Joomla site.
a. Login to Joomla site.
After logging in to the site, go to Content -> Articles -> Add New Article.
Provide a title of the article.
Apply the constructed code snippet for lightning out on the content editor and click Save button to save.
Test the flow if its rendering.
Our flow requires a campaign ID as refrence reference to all the data and configurations needed. We now
...
add the AS_Campaign_Id parameter on the URL with the campaign Id value. For this example, the URL is https://joomla-demo.alphasys.com/wit-lightning- out?AS_Campaign_Id=7015g000000xNl6AAE
As shown below the flow is successfully rendered on the created Joomla page.
...
3. Applying the lightning out on a Drupal site.
Login to Drupal site.
After logging in to the site, go to Content and click Add Content.
...
needed. We now mush add the AS_Campaign_Id parameter on the URL with the campaign Id value. For this example, the URL is
https://drupal- demo.alphasys.com/node/1?AS_Campaign_Id=7015g000000xNl6AAE
...