Salesforce Sidekick

There are often times that you need to get a bit more complex than a simple URL to launch your Flow.  When that time comes, you can use a Visualforce Page!  You might say, “I haven’t written one of these before”, but don’t let that stop you from reading on!  We will walk through this slowly and break down each step so that you know how to customize a Visualforce Page for any use case!  If you do want to learn Visualforce in more detail, check out Trailhead!

Lets get started… We need to create a Visualforce Page that we can customize.  That means we need to head to our Developer Console!

Now lets create and name our Visualforce Page.  To do this, go up to File, New, and then Visualforce Page.

We are now prompted to enter our New Apex Page’s name.  I typically use a name similar to my Flow’s name.

Awesome!  See, that wasn’t too hard, was it?  Now you are ready to dive into writing the code!  So, we want to start to add to what we have (or by the end of this walk through, copy and paste our ‘template’ onto our Visualforce Page.

To embed our Flow in a Visualforce Page we must use this component: “flow:interview“.  But, simply putting that in our Visualforce Page will not do anything.  We need to add some attributes to this component that will let us tell Salesforce which Flow we want to call.

The first attribute we always will use is “name“.  This is where you place the Flow’s Unique Name (‘API name’).

The second attribute we use is “finishLocation“.  This is where we tell the Flow where we want to go when we are at the end of our Flow.  You can send someone to a specific UR or a dynamic URL (by using a Record Id).  I find that in the majority of my Flows, I send the User back to the record that they were previously on.

To pass variables into our Flow we need to use the “apex:param” component.  This component must be placed inside of our “flow:interview” to work properly.  This allows you to state the name of the variable in your Flow and the Value you want it to be.  99.9% of the time I only use the Record Id and/or the Running User’s Id.

“Name” inside the param component is reserved for the name of the variable in your Flow.  “Value” is the value outside of your Flow that you want to pass into your Flow. In my example below, we will be passing the Case.Id value into our Flow using the variable inside the Flow, var_CaseId.  If you want to pass more than one variable into your flow, simply add another param component into your code.

So, we covered the ‘basic’ Visualforce Page for embedding your Flow and how to pass a variable into it.  If you want to do some more complex features like passing a variable out of your Flow into the Visualforce Page, you’ll have to hold tight for the next post!

The finished product:

Text of the code:

<apex:page standardController="Case">
 <flow:interview name="Internal_Case_Comment" finishLocation="/{!Case.Id}">
      <apex:param name="var_CaseId" value="{!Case.Id}"/>
 </flow:interview>
</apex:page>

RECAP:  Flows embedded in a Visualforce Page take a bit more work than a simple URL, but you gain much more control and flexibility.  You can limit who has access to the page via the Visualforce Page’s Security.  As well as add additional content around your Flow, like a Company Logo?  Who knows what you might want to do, but you leave yourself with more options than a URL with just a bit more work!