{"id":2841,"date":"2020-05-29T00:55:47","date_gmt":"2020-05-29T06:25:47","guid":{"rendered":"https:\/\/www.emizentech.com\/blog\/?p=2841"},"modified":"2022-09-12T07:01:42","modified_gmt":"2022-09-12T07:01:42","slug":"embed-lightning-component-in-flow","status":"publish","type":"post","link":"https:\/\/multisitelocal.ezxdemo.com\/blog\/embed-lightning-component-in-flow.html","title":{"rendered":"How To Embed Lightning Component In Flow In Salesforce"},"content":{"rendered":"\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"\/blog\/wp-content\/uploads\/sites\/2\/2020\/05\/1-1.png\" alt=\"Embed Lightning Component in Flow\" class=\"wp-image-2845\" \/><\/figure><\/div>\n\n\n\n<p>To create a new flow, Go to Setup -&gt; Quick Find Box -&gt; Flows -&gt; New Flow<br>and you can learn more about <a href=\"https:\/\/multisitelocal.ezxdemo.com\/blog\/how-to-create-flows.html\" target=\"_blank\" rel=\"noopener\">how to create flows<\/a> in Salesforce<br><\/p>\n\n\n\n<h5 class=\"wp-block-heading\">Also Read: <a href=\"https:\/\/multisitelocal.ezxdemo.com\/blog\/create-salesforce-lightning-map-component.html\" target=\"_blank\" rel=\"noopener\">How to Create a Salesforce Lightning Map Component?<\/a><\/h5>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"\/blog\/wp-content\/uploads\/sites\/2\/2020\/05\/2-1.png\" alt=\"Lightning Components\" class=\"wp-image-2846\" \/><\/figure><\/div>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"\/blog\/wp-content\/uploads\/sites\/2\/2020\/05\/3-1.png\" alt=\"Salesforce Lightning Components\" class=\"wp-image-2847\" \/><\/figure><\/div>\n\n\n\n<p>If you want to use Lightning Components, you need to create Screen flow so that you can fill values in Lightning Component.<br><br>You need to add the screen in the flow from the left panel, it will open the screen which has all the components like text, date, currency, and address, etc. My Flow:<br><br>From here you can add any custom lightning components and also download it from AppExchange. Here is a demo of custom Lightning Component.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Component<\/h2>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;aura:component implements=\"lightning:availableForFlowScreens,lightning:availableForFlowActions,force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction\" access=\"global\" &gt;\n\t&lt;aura:handler name=\"init\" value=\"{!this}\" action=\"{!c.doInit}\"\/&gt;\n\t&lt;ui:message title=\"Regarding Vote\" severity=\"info\" closable=\"true\"&gt;\n\t\t\tPlease Click the below button to Vote.\n\t&lt;\/ui:message&gt;\n&lt;\/aura:component&gt;<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\">Controller<\/h2>\n\n\n\n<pre class=\"wp-block-code\"><code>({\n\tdoInit : function(component, event, helper) {\n\t\talert(\"Hello\");\n\t}\n})<\/code><\/pre>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"\/blog\/wp-content\/uploads\/sites\/2\/2020\/05\/4-1.png\" alt=\"Lightning Components Flow\" class=\"wp-image-2848\" \/><\/figure><\/div>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"\/blog\/wp-content\/uploads\/sites\/2\/2020\/05\/5-1.png\" alt=\"Lightning Components Embed Salesforce\" class=\"wp-image-2849\" \/><\/figure><\/div>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"\/blog\/wp-content\/uploads\/sites\/2\/2020\/05\/6-1.png\" alt=\"Lightning Components Embed\" class=\"wp-image-2850\" \/><\/figure><\/div>\n\n\n\n<p>My Flow to create a record.<br><br>When started debugging the flow it will first show the component output:<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"\/blog\/wp-content\/uploads\/sites\/2\/2020\/05\/7-1.png\" alt=\"Lightning Components Output\" class=\"wp-image-2851\" \/><\/figure><\/div>\n\n\n\n<p>After clicking on ok, it enters to the flow.<\/p>\n\n\n\n<p>Emizentech is one of the leading <a href=\"https:\/\/multisitelocal.ezxdemo.com\/salesforce-consulting.html\">salesforce consultants<\/a>&nbsp;offering custom <a href=\"https:\/\/multisitelocal.ezxdemo.com\/salesforce.html\">salesforce solutions<\/a> to businesses and organizations for a long time. So, if you have a salesforce project please get in touch with us.<\/p>\n\n\n\n<h5 class=\"wp-block-heading\">Also Read: <a href=\"https:\/\/multisitelocal.ezxdemo.com\/blog\/relate-contact-multiple-accounts.html\">How To Relate a Contact To Multiple Accounts<\/a> and Learn about <a href=\"https:\/\/multisitelocal.ezxdemo.com\/blog\/pipedrive-salesforce-integration.html\" target=\"_blank\" rel=\"noopener\">Pipedrive and Salesforce Integration<\/a><\/h5>\n","protected":false},"excerpt":{"rendered":"<p>To create a new flow, Go to Setup -&gt; Quick Find Box -&gt; Flows -&gt; New Flowand you can learn more about how to create flows in Salesforce Also Read: How to Create a Salesforce Lightning Map Component? If you want to use Lightning Components, you need to create Screen flow so that you can<\/p>\n","protected":false},"author":39,"featured_media":2952,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"MSN_Categories":"Uncategorized","MSN_Publish_Option":false,"MSN_Is_Local_News":false,"MSN_Is_AIAC_Included":"Empty","MSN_Location":"[]","MSN_Add_Feature_Img_On_Top_Of_Post":false,"MSN_Has_Custom_Author":false,"MSN_Custom_Author":"","MSN_Has_Custom_Canonical_Url":false,"MSN_Custom_Canonical_Url":"","_lmt_disableupdate":"","_lmt_disable":"","footnotes":""},"categories":[87],"tags":[],"class_list":{"0":"post-2841","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-salesforce-development"},"modified_by":"Marketing EmizenTech","featured_image_src":"https:\/\/multisitelocal.ezxdemo.com\/blog\/wp-content\/uploads\/sites\/2\/2020\/05\/How-To-Embed-Lightning-Component-In-Flow-In-Salesforce-1.png","featured_image_src_square":"https:\/\/multisitelocal.ezxdemo.com\/blog\/wp-content\/uploads\/sites\/2\/2020\/05\/How-To-Embed-Lightning-Component-In-Flow-In-Salesforce-1.png","author_info":{"display_name":"Virendra Sharma","author_link":"https:\/\/multisitelocal.ezxdemo.com\/blog\/author\/salesforce"},"_links":{"self":[{"href":"https:\/\/multisitelocal.ezxdemo.com\/blog\/wp-json\/wp\/v2\/posts\/2841","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/multisitelocal.ezxdemo.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/multisitelocal.ezxdemo.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/multisitelocal.ezxdemo.com\/blog\/wp-json\/wp\/v2\/users\/39"}],"replies":[{"embeddable":true,"href":"https:\/\/multisitelocal.ezxdemo.com\/blog\/wp-json\/wp\/v2\/comments?post=2841"}],"version-history":[{"count":0,"href":"https:\/\/multisitelocal.ezxdemo.com\/blog\/wp-json\/wp\/v2\/posts\/2841\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/multisitelocal.ezxdemo.com\/blog\/wp-json\/wp\/v2\/media\/2952"}],"wp:attachment":[{"href":"https:\/\/multisitelocal.ezxdemo.com\/blog\/wp-json\/wp\/v2\/media?parent=2841"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/multisitelocal.ezxdemo.com\/blog\/wp-json\/wp\/v2\/categories?post=2841"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/multisitelocal.ezxdemo.com\/blog\/wp-json\/wp\/v2\/tags?post=2841"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}