Check out our new Signature Input Editor Element!
With Signature Input you can create custom forms that your visitors can sign.
Go ahead and put in that final missing piece in those contracts, application forms, incident reports or the now all-too-common health declarations.
You can find Signature Input in the Add panel under the Input section after you turn on Dev Mode.
For a hands-on demonstration, head over to the Signature Input Corvid Example.
The Corvid API Documentation of $w.SignatureInput should be your next stop. We recommend you read the Introduction section to get an overview of this new element.
To learn how to store an image of the signature in a Data Collection, look at the documentation of .value and the "Get a signature input and insert it in a collection" code example next to it.
Please note that Signature Input does not have a Connect to Data panel just yet. We plan to introduce this feature soon. In the meantime, working with Signature Input requires code.
As always, we’re here for questions, and of course, feedback is much appreciated!
does the signature feature require a specific plan or can it be done with a basic plan?
Thank you Code Queen! Super helpful. Regarding creating a validation code to make sure they've signed one or the other (draw or typed signature), any advice on how to set this up?
Thanks again, D
Hi, thanks for building this awesome tool! I have a few questions that I'd really appreciate your help with:
Is it possible to make it so a site visiter can choose to draw or "type" their signature? (like Docusign or Adobe allows) I've been having a hard time drawing mine (using a macbook pro trackpad) and don't want users to bounce because of this.
I'd like to automatically collect a date stamp when a user hits submits. Is it possible to set that up in the data set? (I've never used a data set before but I believe I've linked all the fields correctly!)
Lastly (and least important for now!), is there a way to show a table publicly on the site of all the names I collect (and maybe a counter)? I'm using this for a leadership pledge and would like people to be able to opt in and show that they've signed onto the pledge.
THANKS for any help!
D
Happy to announce the release of the Connect to Data panel for Signature Input.
This means that creating a custom form with a Signature Input no longer requires writing code; it can be done purely using data connection.
We have therefore started exposing Signature Input also to users who created a Data Collection, but have not turned on Dev Mode.
You can connect the signature value to an Image field.
Upon Submit an image of the signature would then be stored "in-place" inside this Image field using a Data URL. The signature image would not be uploaded to the Media Manager.
Mind that if you connect a Signature Input to a dataset with Read permissions (either "Read-only" or "Read&Write") the stored signature image would not be loaded and the signature pad would stay empty.
If you are interested in loading stored signature images into Signature Input, please let us know. For now, you can present such images by connecting them to Image elements.
That's it. Hope you find this useful 😊
I have a rather large custom user input form (32 user input boxes), so I would rather not use code to input them all into the dataset. Is there a way to use the submit button to input everything using the connectors, and then use code to input the signature into an image field?
Also, trying to add the signature to an email I receive when the user submits the form.
\rSignature: ${$w("#signatureInput1").value}`;
This code just returns "Signature: data:image/png" and doesn't attach or show the image.
Love this, and everything is working well for me, except when I try to use the signature png in an automated email. I'm having my clients sign a waiver online, then send an email copy of the waiver to them through email automations. It sends, but when I see if from my email it doesn't have a copy of the signature. I'm guessing its something to do with the email host having difficulty embedding a .png? Is there a way to change the format to a .jpg? See picture below for example of what it shows me. Since I can't seem to save these as a document easily (like the whole form saves as a picture file) I figured this was an ok work around. Any help would be appreciated!!
Hi Eyal Michael Cohen, this signature input is really helpful. awesome work by the team!
but i have an issue, can i keep a signature in a dataset and display it in another page? (i can't find the 'connect to data' for the signature input element)
For example, I have an invoice signed by my customer in 1 page and i would like to get them to reconfirm their details and signature in my 'summary checkout' page. I'm not a coder and have limited knowledge in coding. would you able to enlighten me on this?
Thank you Nayeli, that is no problem for me, i also could it just copy and paste before, just wanted to know why i can not see the new menu.
But allright now, thank you for the information.😊
And by saving it into my own designs, it is really a good idea.
Well done Eyal Michael Cohen 👑👑👑👑👑
But wait a minute, still can not see the new element under "Input-Elements", even when Dev-Mode is ON.
Something gone wrong?