Howdy! 😀
Today I am excited to share with you a new flow screen component that I built, called Signature Capture. As the name suggests, you can use this component in your flows screens to get your end users’ signatures and save them in the Salesforce as Files. You can also attach the signature file to a record simultaneously.
Where else can you use this?
You can also use this on home/app/record lightning pages by adding the corresponding interface to the lightning component.
For the ease of creating this component, I created an unmanaged package which you can directly install in your Sandboxes.
Link: https://login.salesforce.com/packaging/installPackage.apexp?p0=04t6F000000cfGo
Let’s see it in Action!
I added this component to a flow screen and then created a quick action to call this flow.

I hope the Ohana finds it useful. Always open to feedback and suggestions! 😀
Thank you for being an awesome reader! Subscribe to this blog for receiving all the latest updates straight to your inbox. 🙂
How do you adjust the signature canvas width? The default is too small.
LikeLike
That’s a really good thought. Sorry, I should have added as an input option😅.
In the meantime, if you open the Signature component ‘.cmp’ file in the developer console, you can add the height and width attributes to the canvas tag in the component code. Something like this:
canvas aura:id=”canvas” height=”SPECIFY_Height” width=”SPECIFY_Width” style=”border:2px solid #ddd;background: white;”
Remember height and width should be in numbers(pixels is the unit).
LikeLike
How can I adjust this, so that it also include text? Similar to signing a consent form.
LikeLike
Do you want the text to be a part of the saved signature image?
LikeLike
Yes. I want both the signature and text to be in the image that gets saved.
LikeLike
Hmm.. That’s going to be tricky and will require quite some effort. Unfortunately, my component doesn’t support this. You should probably ask your in-house dev team to get this done, or hire someone, if that works for you.
LikeLike
Is there any update on this? This would be a fantastic feature if we could save the signature along with the consent text it’s associated with in the same file.
LikeLike
Seems like a good thought! However, I have been able to spare time for this. 😬
LikeLike
Yes the ability to save text with the signature (similar to a consent form) would be a fantastic feature!
LikeLike
Well, the current component can’t do it but can be extended. Unfortunately, my timeline is a bit stuffed for next few weeks so I’m not sure if I can spare some free time for it.
LikeLike
Hey, can I use this on a visualforce page, when using on a force.com site to capture a signature?
LikeLike
Yes, but you will have to refactor the code a bit to make it work!
LikeLike
Great component!
How can i hide the file created message – this will be on a community site and so we dont want that.
LikeLike
Hey Sean,
For that you will have to edit the component and make a small adjustment to the code.
LikeLike
How do I use this in a Public community using the Guest User Profile? I have allowed the flow to run in the system without sharing context so the Guest User Profile can find their contact, but the component files to upload the file to the contact record. Here is the error I see when I run the screen flow:
Error: SignatureCaptureCMPControllerException.saveSignatureToRecord Error: Insert failed. First exception on row 0; first error: CANNOT_INSERT_UPDATE_ACTIVATE_ENTITY, You do not have the level of access necessary to perform the operation you requested. Please contact the owner of the record or your administrator if access is necessary.: []
Any help would be great!
LikeLike
You’d need to provide the necessary access to Guest User profile, in this case:
– Access to the Apex controller being used in the Signature component.
– Permission to create files(I can’t remember the exact permissions though).
LikeLike
Hi I am getting following errors when I try to install this package via link
Error Number: 1363516513-98141 (980901188)
Problem:
1. Method does not exist or incorrect signature: void startTest() from the type Test
SignatureCaptureCMPControllerTest: Method does not exist or incorrect signature: void startTest() from the type Test
2. Method does not exist or incorrect signature: void stopTest() from the type Test
SignatureCaptureCMPControllerTest: Method does not exist or incorrect signature: void stopTest() from the type Test
LikeLike
I think one of the potential reason you’re getting this error is your org might have a class called “Test”. If that’s the case(which is bad), you’ll have to rename the class to something else.
LikeLike
Hey Narender,
Is it possible to populate the ‘Save As’ field with a stored value (eg, a variable containing the name of the Current User) in the flow?
Thanks
Paul
LikeLike
Hey Paul,
Yes, you should be able to use any variable, even a formula variable. 🙂
LikeLike
Hey I loved this component, but I can’t “save” the signature. I’m using it on a screen flow, but how can I see the “signature” once saved, or where is it saved??
LikeLike
Hi,
You should be able to find the saved signature under Files tab.
LikeLike
The link above directs me to install into production but I want to install in a sandbox first.
LikeLike
I replaced login.salesforce.com with test.salesforce.com and managed to install into my sandbox but I have a new problem now that I hope you can help with.
I have added your signature component to the end of my flow, activated it and created a new quick action on my Opportunity. It is all working with the exception that I had to add a mandatory field to Content Version such that when the user uploads photos earlier in the flow which is for an Inspection Report they are able to rename the photo title and add details about the Area e.g. Area 1, Kitchen but because of this I cannot Save and Upload your signature because it also gets saved as a File and requires input of this new custom mandatory field. I really don’t want to switch off the mandatory field because it is the only way the user is able to edit the file name and when they upload a number of photos they need to rename them. Can you think of any other workaround for them both to work?
LikeLike
Interesting…
One way I can think of it is to pre-populate the field by using a before save flow but I’m not sure if you can create record triggered flow on ContentVersion object.
LikeLike
I removed the mandatory field on the Content Version and put it down to a trade-off for being able to add your signature capture was is great by the way.
LikeLike
thanks so much for this. helped a lot
LikeLike
🙂
LikeLike
This component works only on Account records?
I need to capture sign of contacts.
tks
LikeLike
No, it should work for any type of Object.
LikeLike
Hi,
Would it be possible to add the signature to a word document like service agreement with customer and then create a PDF file? Thank you
LikeLike
Hi–I love this component and it works great in my flow when running under my system admin credentials. I have put the flow on a public site, given site guest user access to apex classes and has permission to upload files. But am getting an error ‘List has no row assignment for Sobject’ Any help would be appreciated!
LikeLike
You might have to give read access to the object where you’re trying to attach the file.
LikeLike
I’m having the same issue. Has anyone been able to resolve this issue?
LikeLike
Hi,
Thank you for this component. We are using it in our org and it’s helpful. Sometimes users forget to click ‘upload and save’ for their signature and move to next step in the flow. This is resulting in some users not having a saved signature file. How can I fix this issue? Thank you!
LikeLike
You can add validation by checking if there is a new file uploaded. If not, then redirect back to the same screen showing an error.
LikeLike
We are using this component in our screen flow and works well. Thank you. Is there a way for me to pre-populate or retain the saved signature when user navigates between screens. So for example, if my screen flow has 3 screens, with signature capture as the second screen, and if user clicks Previous on this screen (takes him to screen 1) and comes back to this (screen 2), how I do auto populate the captured signature?
LikeLike
The current version of this component doesn’t support this but it should be possi le by adding some code.
LikeLike
Thank you for your response. Any chance you will update this component with this functionality in the near future? Thanks
LikeLike
Hey,
It’s not on my todo. But if it fits, we can do a paid arrangement and I can built it for you.
LikeLike