CMS: Connecting the Signature Input Field to a Collection

The signature input element lets you collect digital signatures directly on your website. Connecting it to a CMS (Content Management System) collection allows you to store and manage signatures in one place.

You can add other input elements and connect them to the same dataset to create a custom CMS form with several fields. For example, a photography business can have clients sign release forms online and save their signatures in a database, streamlining document management.

Before you begin:

• Make sure to add the CMS to your site or enable coding if you haven't already.

• Make sure you have a CMS collection for storing the submitted signatures.

Step 1 | Add and set up the signature input element

Add the signature input element to your page and customize its settings, layout, and design.

Wix Editor

1. Click Add Elements

   

   on the left side of the editor.

2. Click Input.

3. Click Signature Input.

4. Click and drag the Signature Input element of your choice onto the page.

1. Click Settings on the signature element to edit the following:

   • Field title: Edit the name that appears on the input, which also lets screen readers know what the input is about.

   • Clear signature button: Edit the name that appears on the button visitors click to clear their signature.

   • This field is: Select the Required checkbox to make it mandatory that the signature is filled out before it can be submitted to your collection.

2. Click the Layout icon

   

   to adjust the indentation, spacing, text direction and alignment.

3. Click the Design icon

   

   to choose a preset design. Then click Customize Design to adjust the design further.

Studio Editor

1. Click Add Elements

   

   on the left side of the editor.

2. Click Input.

3. Click Signature Input.

4. Click and drag the Signature Input element of your choice onto the page.

1. Click Settings on the signature element to edit the following:

   • Field title: Edit the name that appears on the input, which also lets screen readers know what the input is about.

   • Clear signature button: Edit the name that appears on the button visitors click to clear their signature.

   • This field is: Select the Required checkbox to make it mandatory that the signature is filled out before it can be submitted to your collection.

1. Click the Layout icon

   

   to adjust the indentation, spacing, text direction and alignment.

2. Click the Design icon

   

   in the Inspector panel to customize the design.

Step 2 | Connect the signature input to the CMS

Connect the signature input element to a dataset that binds to your CMS collection that will store the signatures. You can connect the signature value to image field types in your collection.

Wix Editor

1. In your editor, click the signature input element.

2. Click the Connect to CMS icon

   

   .

3. Click the Choose a dataset drop-down and select an existing dataset that connects to your collection. Alternatively, select Add a Dataset, then choose the collection you want to connect, give the dataset a name and click Create.

4. Click the Value connects to drop-down and select the 'Image' field in which you want to save the signatures. Select + Add if you need to add an Image field for storing the signatures.

1. (If needed) Adjust the dataset settings:

   1. Click Dataset Settings in the panel on the right.

   2. Click the permission type next to Permissions to edit your collection's permissions & privacy settings.

   3. Click the Dataset mode drop-down and select the relevant option:

      • Read & Write: Elements that are connected to the dataset can display content from your collection. Input elements can add or edit content in your collection.

      • Write: Elements that are connected to the dataset can add and edit collection content. However, connected elements cannot display content from the collection.

2. Add a 'Submit' button for visitors to click to submit their signature and responses to any other input elements that connect to the dataset.

3. Click Preview to test your signature input.

4. Click Publish if you are ready to make the changes go live.

Studio Editor

1. In your editor, click the signature input element.

2. Click the Connect to CMS icon

   

   .

3. Click the Choose a dataset drop-down and select an existing dataset that connects to your collection. Alternatively, select Add a Dataset, then choose the collection you want to connect, give the dataset a name and click Create.

4. Click the Value connects to drop-down and select the 'Image' field in which you want to save the signatures. Select + Add if you need to add an Image field for storing the signatures.

1. (If needed) Adjust the dataset settings:

   1. Click Dataset Settings in the panel on the right.

   2. Click the permission type next to Permissions to edit your collection's permissions & privacy settings.

   3. Click the Dataset mode drop-down and select the relevant option:

      • Read & Write: Elements that are connected to the dataset can display content from your collection. Input elements can add or edit content in your collection.

      • Write: Elements that are connected to the dataset can add and edit collection content. However, connected elements cannot display content from the collection.

2. Add a 'Submit' button for visitors to click to submit their signature and responses to any other input elements that connect to the dataset.

3. Click the Preview icon

   

   at the top right to test your signature input element.

4. Click Publish if you are ready to make the changes go live.

FAQs

Click below for answers to common questions about the signature input element.