Embed send document within your app

Fill in for the Demo

Try filling out the form details below and sending the document for signing. This will give you a better understanding of how the Embedded Send for Signing process works.

Code Reference The embedded request allows the sender to send the document directly within your website or mobile app using an iFrame, a popup window, or a new tab.

Checkout API documentation

Code flow:

Step 1

On the form submission, create the new document from the template using Create embedded request link from template API. It will return the document Id which we can use to generate the embedded request link.

curl -X 'POST' \
'https://api.boldsign.com/v1/template/createEmbeddedRequestUrl?templateId=YOUR_TEMPLATE_ID' \
        -H 'accept: application/json' \
        -H 'X-API-KEY: YOUR_API_KEY' \
        -H 'Content-Type: application/json;odata.metadata=minimal;odata.streaming=true' \
        -F 'DisableEmails=true'
        -d '{}'

var apiClient = new ApiClient("https://api.boldsign.com", "Your_API_Key");

var templateClient = new TemplateClient(apiClient);

var templateRequest = new EmbeddedTemplateRequest()
{
    TemplateId = "YOUR_TEMPLATE_ID",
    DisableEmails = true,
    Roles = 
    [
        new Roles()
        {
            RoleIndex = 1,
            SignerName = "David",
            SignerEmail = "[email protected]",
            SignerType = SignerType.Signer
        }
    ],
    SendViewOption = PageViewOption.PreparePage,
    ShowToolbar = true
};

var embeddedSendCreated = templateClient.CreateEmbeddedRequestUrl(templateRequest);
var sendUrl = embeddedSendCreated.SendUrl;

import boldsign

configuration = boldsign.Configuration(host = "https://api.boldsign.com", api_key="YOUR_API_KEY")

with boldsign.ApiClient(configuration) as api_client:
    
    template_api = boldsign.TemplateApi(api_client)
    
    role = boldsign.Role(
        roleIndex=1,
        signerRole="signer",
        signerName="Signer Name 1",
        signerEmail="[email protected]")
    
    embedded_send_template_form_request = boldsign.EmbeddedSendTemplateFormRequest(
        roles=[role],
        disableEmails=True,     
        showToolbar=True,
        sendViewOption="PreparePage")
    
    embedded_send_created = template_api.create_embedded_request_url_template(template_id="YOUR_TEMPLATE_ID", embedded_send_template_form_request=embedded_send_template_form_request)

<?php require_once "vendor/autoload.php";

use BoldSign\Configuration;
use BoldSign\Api\TemplateApi;
use BoldSign\Model\{Role, EmbeddedSendTemplateFormRequest};

$config = new Configuration();
$config->setHost('https://api.boldsign.com');
$config->setApiKey('YOUR_API_KEY');

$template_api = new TemplateApi($config);

$role = new Role();
$role->setRoleIndex(1);
$role->setSignerRole('Signer');
$role->setSignerName('Signer Name 1');
$role->setSignerEmail('[email protected]');

$embedded_send_template_form_request = new EmbeddedSendTemplateFormRequest();
$embedded_send_template_form_request->setSendViewOption('PreparePage');
$embedded_send_template_form_request->setShowToolbar(true);
$embedded_send_template_form_request->setRoles([$role]);
$embedded_send_template_form_request->setDisableEmails(true);

$embedded_send_created = $template_api->createEmbeddedRequestUrlTemplate($template_id = 'YOUR_TEMPLATE_ID', $embedded_send_template_form_request);

ApiClient client = Configuration.getDefaultApiClient();
client.setBasePath("https://api.boldsign.com");
client.setApiKey("YOUR_API_KEY");
        
TemplateApi templateApi = new TemplateApi(client);

Role role = new Role();
role.setRoleIndex(1);
role.setSignerName("Signer Name 1");
role.setSignerEmail("[email protected]");
role.setSignerRole("Signer");

EmbeddedSendTemplateFormRequest embeddedSendTemplateFormRequest = new EmbeddedSendTemplateFormRequest();
embeddedSendTemplateFormRequest.setRoles(Arrays.asList(role));
embeddedSendTemplateFormRequest.setDisableEmails(true);
embeddedSendTemplateFormRequest.setShowToolbar(true);
embeddedSendTemplateFormRequest.setSendViewOption(EmbeddedSendTemplateFormRequest.SendViewOptionEnum.PREPARE_PAGE);

EmbeddedSendCreated embeddedSendCreated = templateApi.createEmbeddedRequestUrlTemplate("YOUR_TEMPLATE_ID", embeddedSendTemplateFormRequest);

import { TemplateApi, EmbeddedSendTemplateFormRequest, Role } from "boldsign";
import * as fs from 'fs';

const templateApi = new TemplateApi("https://api.boldsign.com");;
templateApi.setApiKey("YOUR_API_KEY");

const role = new Role();
role.roleIndex = 1;
role.signerName = "Signer Name 1";
role.signerEmail = "[email protected]";
role.signerRole = "Signer";

const embeddedSendTemplateFormRequest = new EmbeddedSendTemplateFormRequest();
embeddedSendTemplateFormRequest.roles = [role];
embeddedSendTemplateFormRequest.disableEmails = true;
embeddedSendTemplateFormRequest.showToolbar = true;
embeddedSendTemplateFormRequest.sendViewOption = EmbeddedSendTemplateFormRequest.SendViewOptionEnum.FillingPage;

const embeddedSendCreated = templateApi.createEmbeddedRequestUrlTemplate("YOUR_TEMPLATE_ID", embeddedSendTemplateFormRequest);

Step 2

Once the embedded URL is generated for sending a signature request, load the URL in an iFrame within your app using the following code.

<iframe src="https://app.boldsign.com/document/embed/?documentId=17882f5a-xxxx-xxxx-xxxx-ce5737756339s_dyU07s_hkU07;dfeab145-xxxx-xxxx-xxxx-d705b85823c8" style="width:100%;height:100%"/>