In this SilverStripe-focused post, one of our talented developers, Jack, introduces a new 'module for a module' within our preferred content management system.
For those of you who have not yet heard of or used SilverStripe’s own Userforms module, I would firstly encourage you to check it out in detail. This module will help you cut development time significantly; it allows forms to be dynamically created in the CMS, complete with form validation, email notifications, status alerts upon form submission, and more.
Today however, we bring you our own module - which is essentially a module for a module - that integrates directly with SilverStripe Userforms. Whilst working on a client project we found ourselves utilising Userforms, covering all criteria except one important aspect - a digital signature field. After journeying through the depths of Github, I finally came across a jQuery signature field repository.
With as little as three classes (two of which extend from Userforms’ classes), a small amount of jQuery entwine to initialise the field, and a touch of CSS to make the field look pretty; the module was up and running for all of the SilverStripe community to view and use. Our module currently requires you to use any Userforms version between 3.0.0 and 3.4.2.*, meaning this module is compatible with all versions of SilverStripe above 3.1 and below 4. Depending on demand, a version compatible with SilverStripe 4 may also be on the cards.
Our module is called silverstripe-ufesignature, which is short-hand for SilverStripe Userforms e-signature. The module will give you the ability to select a new field called ‘Signature Field’ from the field list dropdown when creating a new user form. The field comes with working validation so you may mark it as ‘required’ if needed. Once the form is created, the end-user will then be able use their mouse (or finger if they’re on a mobile device) to draw their signature into the signature field box and submit. Once submitted, the signature is stored as a base64 code in the database and rendered into an image tag when being previewed from the CMS.
At the time of writing this our e-signature module is the only existing example that integrates directly with Userforms. Please take care to be aware of the license agreement when using this module. If you’re interested in using or seeing other modules we have developed, visit our Github page.
If you’re interested in the web development, digital strategy and marketing services that we can provide, please don’t hesitate to get in touch with us.