Now that we have the embedded_signing_url, we can display the document for signing. We'll do this with using the SignWell JavaScript library.

<script type="text/javascript" src="https://static.signwell.com/assets/embedded.js"></script>

Note: If you need to use the "integrity" attribute in the JS script tag, make sure you use the most current hash that matches the embedded.js file. This file can and will change at times. You can dynamically retrieve the correct hash at this endpoint: https://static.signwell.com/assets/embedded.txt

Once you've added the SignWell JavaScript library to your website or web application, you'll use the following code to display the iFrame.

var signWellEmbed = new SignWellEmbed({
  url: '[embedded_signing_url here]',
  events: {
    completed: e => { 
      console.log('completed event: ', e) 
      //document successfully signed/completed
    },
    closed: e => { 
      console.log('closed event: ', e) 
      //SignWell iFrame closed
    }
  }
})

signWellEmbed.open()

There are multiple options and events you can use when creating the SignWellEmbed object.

Name	Description
`url` (string)	This is your embedded signing URL. It's the only required option.
`containerId` (string)	The default behavior will open a modal with the iFrame. Instead, using this option, you can pass an ID of a DOM object on your website where the iFrame will be embedded.
`allowDecline` (boolean)	Whether to display the decline document option to signers. Defaults to `true`.
`allowClose` (boolean)	Whether the document can be closed before a document has been signed/completed. Defaults to `true`.
`declineRedirectionUrl` (string)	A URL where signers will be redirect to if they decline the document.
`redirectionUrl` (string)	A URL where signers will be redirected to after signing the document.
`allowRedirect` (boolean)	Whether to use redirect after signing settings if they exist. Defaults to `true`.
`showHeader` (boolean)	Whether to show the header on the document view page. Defaults to `true`.
`iframeRedirect` (boolean)	Whether the document redirect happens at the iFrame level or the iFrame's parent. Setting this to `true` redirects at the iFrame level. Defaults to `false`.
`allowDownload` (boolean)	Hides the download and PDF buttons/actions when set to `false`. Defaults to `true`.
`signatureDefaultName`(boolean)	Defaults the person's name on typed signatures when set to `true`. Defaults to `true`.
`events.completed`	Callback triggered when the document is successfully signed. Data: `{ id, url }` ( document ID, redirect URL )
`events.iframeLoaded`	Callback triggered when the iFrame is loaded. Data: `{ id }` ( document ID )
`events.documentLoaded`	Callback triggered when the document is loaded. Data: `{ id }` ( document ID )
`events.declined`	Callback triggered when the document is declined. Data: `{ id, declineReason }` ( document ID, decline signer comments )
`events.closed`	Callback triggered when the iFrame is closed. Data: `{ id }` ( document ID )
`events.error`	Callback triggered if there is an error.

What’s Next

What’s Next