Lewatkan ke konten utama
Tidak ada item yang ditemukan.
logo dropboxsign
Mengapa Dropbox Sign?
Perluas atau ciutkan akordeon

Apa yang dapat Anda lakukan

Menandatangani dokumen online
Buat tanda tangan elektronik
Pilih atau buat templat
Mengisi dan menandatangani PDF
Menyelesaikan kontrak online
Manajemen dokumen
Pelajari fitur-fitur
ikon panah kanan

Kasus penggunaan

Penjualan dan pengembangan bisnis
Sumber Daya Manusia
Perusahaan rintisan
Teknologi finansial
Real estat
Layanan sesuai permintaan
Produk
Perluas atau ciutkan akordeon
ikon dropbox
Sign
Mengirim dan menandatangani lebih mudah
ikon dropbox
Sign API
Mengintegrasikan eSign dalam alur kerja Anda
ikon dropbox fax
Fax
Mengirim faks tanpa mesin faks
ikon integrasi dropbox
Perpaduan
Kami menemui Anda di tempat Anda bekerja
Sumber daya
Perluas atau ciutkan akordeon
Blog
Keahlian alur kerja & berita produk
Kisah pelanggan
Kisah nyata dengan hasil nyata
Pusat bantuan
Panduan mendalam untuk produk kami
Pustaka sumber daya
Laporan, video, dan lembar info
Pengembang
Harga
Perluas atau ciutkan akordeon
Harga Dropbox Sign
Temukan paket yang cocok untuk Anda
Harga API Dropbox Sign
Kisah nyata dengan hasil nyata
Hubungi penjualan
Daftar
Hubungi Bagian Penjualan
Masuk
Perluas atau ciutkan akordeon
Dropbox Sign
Dropbox Forms
Dropbox Fax
Uji coba gratis
Blog
/
Pengembang

Building a Premium Branded eSignature Flow using Django and the Dropbox Sign API

by 
Julia Seidman
May 11, 2021
6
menit waktu baca
"Building a Premium Branded eSignature Flow using Django and the Dropbox Sign API" header image
ikon tooltip

Produk hebat yang sama dengan tampilan baru! HelloSign kini menjadi Dropbox Sign.

ikon tutup

When your application requires users to sign contracts and agreements, you likely want to keep the experience on your site. You can maintain control of what users see and still have the benefits of a secure eSignature platform.


Just as Django allows you to build more with less code, Dropbox Sign’s embedded eSignatures give you the tools to create a great experience, this allows your users to address their business needs in a unique and customized approach — whether it’s to improve an HR onboarding experience for new employees or to streamline contracting for a sales team. In this guide, we will be using a sample project which allows teachers in a school to have different forms signed by parents, we’ll walk you through how to create a custom premium branded eSignature flow for Django, from installing the HelloSign SDK in pip to finishing with a script import into your Django templates.


To get started, you can visit our Developer Portal and start testing for free (no credit card required).


Add Dropbox Sign to your app’s Virtual Environment and Customize with Premium Branding

You will want to create your Django project with two apps: an admin app and a user portal app.  

Inside your project’s virtual environment, install Dropbox Sign’s Python SDK.  Be sure that it is available to both the admin and user apps.


You will need to create a Dropbox Sign account to generate an API key.  You can find your API key under the API tab on the Settings page of your account.  You will also need to create a Dropbox Sign API App. In the same page where you get the key, click on “Create” in the API Apps section.  Give your API App a name and a domain. While you are in the testing phases of development, you can ignore the domain verification fields on the HelloSign dashboard or enter any URL you like, as those are only required for production uses.


Once you have created an application, you will receive a Client ID associated with that specific API App.  As a best practice, secure both your API key and Client ID in a .env file.  


By using the Premium Branding feature, you can customize the look of your Dropbox Sign eSignature experience to match your organization’s color scheme.  Using the Update API App endpoint and initiating the API call from the admin side of your Django project, specify the elements you would like to customize:


littleschool/admin/views.py

‍

You can find more information in the Premium Branding documentation


Create a Forms Page for Users

Dropbox Sign offers developers the ability to embed the signing experience directly in their websites, making the process of collecting documents with legally-binding eSignature from your clients or users feel like a seamless part of their experience on your website.


The Little School, has a website built in Django to accommodate Parent, Child, and Teacher profiles, making use of Django’s built-in auth features.  Each Parent object is associated with a specific authenticated User:


littleschool/models.py

‍

When parents log in to the school’s website, they are directed to a list of forms in the parent_portal app within the Django project file. Here, the school can post enrollment forms, field trip permission slips, and health forms.  All the files available through these links can be handled with the Dropbox Sign client, creating a centralized location for all the school’s required waivers and contracts.


If a project is set up with a relational database, including the default sqlite3, an admin user could control which forms appear on a given user profile by using the Teacher-Child relationship in models.py to send certain forms to a Parent user’s views.


Create Dropbox Sign Client and Methods

The embedding signing flow means users can view, sign, and review their contracts and waivers while still on your website.  Using Dropbox Sign’s Embedded Signing functionality allows you to display your SignatureRequests as <iframe> HTML elements and does not require any additional user accounts or authentication beyond what you already have on your site.  


Inside the parent_portal file directory, create a file called hellosignclient.py.  In this file, you will add the code to create embedded eSignature requests and display documents for signature at a unique URL.  You can create a single SignatureRequest method and reuse it for multiple forms:


littleschool/parent_portal/hellosignclient.py

‍

Here, we are using the pip package python-decouple to handle variables from our .env file.  


Then, we import the Dropbox Sign Client and Django User.  The sign_request method is a reusable method that associates the logged-in User with the request to Dropbox Sign.  

In the enrollment method, the reusable sign_request method is called and given parameters specific to the enrollment form.  Then, Dropbox Sign generates a unique ID for the signer which is passed as part of the get_embedded_object request.  The function returns the unique URL for the User’s signature.  


Display the Embedded Signature Request

If you have built your front end using Django Templates or Jinja2, you can still use Dropbox Sign's JavaScript client-facing Embedded Signature Request UI.


First, use npm to install the Dropbox Sign Embedded package.  If you are not using npm, it is still possible to install it via CDN, manual download, or by compiling from the source by visiting Dropbox Sign's wiki.  


Then, create a file called hellosign.js to call the front-end client:


littleschool/parent_portal/hellosign.js

‍

This script, which gets the signURL variable passed from views.py, can be embedded in your HTML templates, either in the <head> or <body>.  In this case, in order to make the <script> element callable from multiple templates, we’ve opted to put it in the <head> inside base.html:


littleschool/parent_portal/templates/base.html

‍

Then, from inside the `enrollment.html` template, we call the method with an onClick function:


littleschool/parent_portal/templates/enrollment.html

‍

Get Confirmation When Documents Are Signed

It’s best to monitor completion of eSignature requests in a separate admin app.  In the case of a school, this might be the app used by just the Enrollment Director, or it could be accessible to all staff.  Either way, keep this functionality separate from the parent_portal.  


Use the signature_request_id of the desired SignatureRequest to call the Dropbox Sign API for the current status using the Get Signature Request endpoint. If desired, those results can be sorted or filtered - for example, an administrator might want to see all kindergarten enrollment forms, or a teacher might want field trip forms for just the students in one class.  


Your admin app can follow a similar setup to the parent_portal, or you can locate the Dropbox Sign files - hellosign.js and hellosignclient.py in a directory where both Django apps have access, perhaps determined by the scale of your admin functionality.  Either way, the calls to the HelloSign client will use the same API credential as the parent_portal methods.  


The get_signature_request endpoints, both individual and list,  will return a signature_request object, which will contain the status of each signature:


littleschool/admin/hellosignclient.py

‍

At any point during the SignatureRequest process, you can download your files to see the current version.  To do this, you’ll need to have a file management system installed in your application, like the basic PyPi file system, fs. You can download .zip or PDF files:


littleschool/admin/views.py

‍

So long as you maintain your Dropbox Sign account, you’ll have ongoing access to your files through the API, or you can set up your system to download them and save them locally or to a cloud drive.


Dropbox Sign offers a great deal more functionality, and as your application scales, that functionality and Django’s flexibility will work together to deliver a seamless experience! To learn more about the Dropbox Sign API and start testing for free, visit Dropbox Sign’s Developer Portal.

Mengikuti perkembangan

Selesai! Periksa kotak masuk Anda.

Thank you!
Thank you for subscribing!

Lorem ipsum

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Lorem ipsum
ikon panah kanan
ikon tutup

Up next:

Ilustrasi close-up tanda tangan yang ditulis tangan, merepresentasikan solusi penandatanganan digital modern.
Pengembang
15
menit waktu baca

Mengintegrasikan Dropbox Sign dengan Ruby on Rails: Tutorial Langkah demi Langkah

Ilustrasi close-up tanda tangan yang ditulis tangan, merepresentasikan solusi penandatanganan digital modern.
Pengembang
15
menit waktu baca

Dropbox Sign vs. SignNow for developers

eBook

4 cara API tanda tangan elektronik memungkinkan pertumbuhan bisnis

Produk
Dropbox SignAPI Dropbox SignDropbox FaxPerpaduan
Mengapa Dropbox Sign
Tanda tangan elektronikTandatangani dokumenMenandatangani dan Mengisi PDFKontrak onlineBuat tanda tangan elektronikEditor tanda tanganTandatangani Dokumen Word
Dukungan
Pusat bantuanHubungi penjualanHubungi dukunganKelola cookieMemulai: Dropbox SignMemulai: API Dropbox Sign
Sumber daya
BlogKisah pelangganPusat sumber dayaPanduan legalitasPusat kepercayaan
Mitra
Mitra StrategisLokasi mitra
Perusahaan
KarierKetentuanPrivasi
ikon facebookikon youtube

Metode pembayaran yang diterima

Logo MastercardLogo VisaLogo American ExpressLogo Discover
Lambang Kepatuhan CPALencana kepatuhan HIPAALencana Sky High Enterprise ReadyLencana Sertifikasi ISO 9001

Tanda tangan elektronik Dropbox Sign mengikat secara hukum di Amerika Serikat, Uni Eropa, Inggris, dan di banyak negara lain di dunia.
Untuk informasi lebih lanjut, silakan lihat Syarat dan Ketentuan serta Kebijakan Privasi kami