Table of Contents
- What is DeForm?
- What can DeForm be used for?
- Access Gating
- Marketing campaigns
- Allowlists
- Grants applications
- Hackathon submissions
- Project feedback
- How to set up a form
- Step 1: Create an account and sign in
- Step 2: Tell us how you intend to use DeForm!
- Step 3: Create your first form
- Step 4: Customize your form
- Customizing the form title
- Adding a description to your form
- Adding new inputs to your form
- Removing an input from your form
- Reordering sections of your form
- Input types (with examples)
- Identity Verification
- Wallet Connect
- Twitter Connect
- Discord Connect
- Facebook Connect
- Telegram Connect
- Classic Questions
- Short Text
- Long Text
- Single Select
- Multiselect
- Rating
- Number
- Email Address
- Link
- Date
- Physical Address
- File Upload
- EVM Address
- Payment
- Access gating your form (Optional)
- Conditional Logic
- Multiple forms of verification (Conditional Logic example)
- Condition types (with examples)
- Data Lookups (Optional)
- Step 5: Styling for your form
- Changing your form’s background
- Changing your form’s font
- Adding a cover page (optional)
- Uploading a cover image (optional)
- Customizing your success page (optional)
- Step 6: Customizing additional form settings
- Submission settings
- Customize your form link
- Give your form a thumbnail preview (for social media)
- Step 7: Sharing your form
- Viewing form responses
- Additional features
- NFT giveaway feature
- Automated promotional codes
- Upcoming features and roadmap
- Questions?
Do not index
Do not index
Welcome to the DeForm Quickstart guide! Here, you’ll learn how to create, edit, update, and share a form using various features and components that DeForm has to offer.
If you ever have any questions, we’d love to chat! 🙂
Tweet at us @deformapp or email us: support@deform.cc
Check out our website here: https://deform.cc/
What is DeForm?
DeForm is more than your typical form builder - it’s a robust tool designed to empower marketers in new and exciting ways. With DeForm, you can seamlessly validate onchain digital asset holdings and track social media engagement. It grants you the ability to effortlessly orchestrate NFT giveaways, craft web3 surveys, and analyze community insights, all without requiring any coding skills.
What can DeForm be used for?
Click on the arrow left of the use case to view more information about it. Here are a few of our favorite ways to use DeForm:
Access Gating
Using the access gating method, DeForm used onchain records to verify whether a developer has deployed on Base, a Layer-2 network, which determines whether or not they are eligible for Base’s Genesis Builder NFT. Read more about this in our article: Onchain Summer: Launching a Developer Ecosystem with Base and DeForm.
Another example of Access Gating: MeTown Melons
In the tweet above, access gating was used using the Wallet Connect method to verify NFT ownership. This allowed DeForm to help distribute melon NFTs to contributors of the project! You can learn more about how to implement access gating a form by checking out this section of our guide: Access gating your form (Optional).
Marketing campaigns
DeForm can be used for marketing campaigns. In the above example, GeN3 Magazine utilizes DeForm to facilitate sign ups/purchases for their first magazine issue. Using DeForm allows creators to implement payment options like credit card purchases via Stripe. Crypto payments can be easily implemented as well! You can see how GeN3 Magazine customized their form here: GeN3 Magazine - Telling the Story of Web3.
Allowlists
Grants applications
Using DeForm is a great way to collect applications for grants. Check out the examples listed in the tweets below. DeForm has proudly powered amazing grants and fellowship programs like the Press Start x Developer DAO Fellowship program as well as the ENS Public Goods - Large Grants program!
Hackathon submissions
Project feedback
It’s important to note that these are just a few examples of how DeForm can be used. In later sections of the guide, we will explore all of the current and upcoming features to help you decide how DeForm will be a great fit for your project!
How to set up a form
In this section, you will learn how to set up a new form from scratch. We will be exploring available customizations so that you can decide what works best for your form.
Step 1: Create an account and sign in
Navigate to the DeForm website: https://www.deform.cc/. There are a few different buttons that will initiate the account creation/login process. Additionally, you can click through the links on the navbar to explore DeForm’s features, pricing, partners, FAQ, docs, or roadmap.
Once you are on DeForm’s landing page, you can click on the
Get started for free
button located near the center of the page or the Sign Up
button located in the upper-right corner of the page. Once clicked, a new window will open where you can enjoy a password-free sign in experience.You can either use the Sign in With Google button or simply type your email address in the box to receive a magic link. If this is your first time, doing this will create a new account for you. If you’ve already done this, you can use the same method to sign in. Once you click the
Continue with email
button, you’ll need to visit your inbox to continue.Step 2: Tell us how you intend to use DeForm!
After successfully signing in for the first time, you will be greeted with a quick form to fill out. This form will allow us to personalize your experience. Simply answer the questions and then click the
Get started now
button at the bottom of the form to proceed. Note: When you enter the name of your organization, it will also be your workspace name. Once saved, this cannot currently be changed without reaching out to our support team. (Example: Entering “DeForm” would make the name of your workspace “DeForm’s Workspace”)
Step 3: Create your first form
Click the
Create DeForm
button near the center of the website. This will create a new, untitled form for you to edit and style to your liking! In this guide, we will go over all of the different ways that you can customize and style your form.Step 4: Customize your form
After clicking the button on the previous page to create your form, it’s time to customize it. One of the greatest strengths DeForm has is the ability to customize forms in-depth. For the purpose of simplicity, we’ll start by creating a basic form and then add additional customizations later.
Note: Text formatting (Bold, italics)
By default, all DeForm titles are in Bold text. You can remove bolded text by highlighting the title and pressing CTRL+B (or CMD+B if you’re on a Mac!)
You can also italicize text in your title by selecting the text you wish to edit and pressing CTRL+I (CMD+I on a Mac).
Customizing the form title
To customize your form’s title, click on the text near the top of the form that says “Untitled form” and update it to whatever title you’d like. (Example: Kitty Cat GFX Feedback Form)
Adding a description to your form
If you want to add a description to your form, click on the input box that says “Form description” and start typing your form’s description. This can be left blank if you’d like.
It is recommended to add a description to your form so that responders know the purpose of your form, how the data they’ll provide will be used, etc.
Adding new inputs to your form
To add new inputs to your form, click the
+
button located near the lower left area of the form. This will open a window showing all of the input options that you can add to your form. You can click on each item on the left menu bar to read more about the input before adding it. There are several different identity verification options available. You do not have to have an identity verification on your form if you want it to be open to everyone.
Additionally, you have access to classic question inputs such as text boxes (short text and long texts), single select, multiselect for questions that may have more than one answer, rating, and more. Check out the Input types (with examples) section of this guide for examples of every input type currently available.
If you like an input type, you can add it to your form by either clicking the
Add to form
button in the upper right hand corner of the input. Alternatively, you can quickly add an input by hovering over it on the left side menu and clicking the +
button.Removing an input from your form
By default, you may see a Wallet Connect input on your form. This is just an example of one of the ways you can access gate a form. Don’t want it there? No problem! To remove a question, highlight the area of the Wallet Connect input and click on it. From there, you can click the trash can icon in the lower right corner of the component to remove it from your form.
Reordering sections of your form
DeForm makes it easy to reorder sections of your form around! Hover over the question that you’d like to move. You will notice that a rectangle with six dots appears to the left of the question. Click and hold the rectangle and then move your question to the desired position. Once in the desired position, let go of your mouse.
Input types (with examples)
Now that you’ve learned how to add and remove inputs to your form, let’s go over all of the different input types and how to use them. If you find an input type that you like, make sure to add it to your form!
Identity Verification
You can use identity verification inputs to validate social media accounts or wallet addresses. Using identity verification on DeForm helps verify legitimate and unique users. You can click on the arrow to the left of the available identity verification methods below to learn more about them and view examples of how they might look on your form.
Wallet Connect
Adding Wallet Connect can be a great way to validate unique users. You can use wallet verification once per form. Users will be able to connect using many different EVM-compatible wallets with this method. It’s important to note that this will not trigger a transaction or cost any gas fees.
You can customize the Wallet Connect question and description however you’d like while in edit mode on DeForm. Simply click the title or the description area and start typing to edit. Edits will be autosaved!
Example Use Cases:
- Allowlists
- Even signups
- Bot prevention
- Exclusive giveaways
- Voting & governance
- Community feedback
Twitter Connect
Once of the social media verification options that DeForm currently offers is the ability to verify a responder’s identity using their Twitter account. Twitter Connect can only be added once per form.
Using the Twitter Connect form input option will allow responders to authenticate their Twitter/X handle by signing in and authorizing public information (i.e. followers, following, account age, etc.) to be shared with you.
Example use cases:
- Bot prevention
- Verifying followers
- Exclusive giveaways
- Identifying influencers
Discord Connect
If you have a Discord server that you want your responders to be in, adding the Discord Connect option to your form will make verifying users a breeze. Discord verification can be used once per form.
Using the Discord Connect option will allow responders to authenticate their Discord account. The authentication will allow you to access the responder’s username, avatar, banner, servers, and member info (nickname, roles, etc.) for each server they belong to.
Example use cases:
- Bot prevention
- DAO management
- Server & role verification
Facebook Connect
If you add Facebook Connect to your form, responders will be able to authenticate using their Facebook account. Public information like name, email, and profile avatar will be shared with the form administrator.
Example use cases:
- Bot prevention
- Verifying identity
Telegram Connect
If you have a community on Telegram, you can add Telegram Connect to your form so that responders can authenticate their Telegram username.
Example use cases:
- Business development
- Community management
Each identity verification method can only be added once per form. It is important to consider the target audience of your form when choosing an identity verification method. Alternatively, you don’t have to use an identity verification method. (although, we would highly recommend to do so!)
Classic Questions
Adding classic questions to your form can help you understand your community with ease. You can click on the arrow to the left of the available classic questions below to learn more about them and view examples of how they might look on your form.
Short Text
You can use a short text input to collect short answers to a question. Additionally, you can make questions required if you’d like by flipping the switch next to “Required” to on. Also, you can add as many short text questions as you’d like!
To edit your question, start by typing your question in the first box at the top. You can add an optional description to inform the responder how the data to the question will be used.
Example use cases:
- Name/nickname collection
- What is your name?
- Attention checks
- Type ‘blue’ in the box
- Referral questions
- Who were you referred by?
- How did you hear about us?
Long Text
.
You can use a long text input to collect longer answers to a question. Long text questions work well for responses where a person might provide a detailed response.
Long text questions are great for open-ended questions which may require a lengthy response. In the example screenshot above, you’ll notice that responders were asked: “Why do you want to join our team?”
Example use cases:
- Typed cover letters
- Why do you want to join our team?
- Why should you be considered for this project?
Single Select
You can use a single select question when you have a question that calls for a single selection from a list of potential answers.
Single select questions make a great option when you’re looking to add guided questions to your form. Asking questions like, “Why are you contacting us today?” (like in the example above) can help form creators categorize their responses. (ie: demo requests, product support and questions, billing issues, etc.)
Example use cases:
- Guided questions
- Why are you contacting us today?
- Yes / No questions
- Do you want to opt-in to our weekly newsletter?
- True / False questions
- Attention check: True or false: The second letter in the word “cat” is “A.”
Multiselect
You can use a multiselect question to offer a range of answer options. Using a multiselect question will allow responders to select multiple answers to a question.
In the screenshot example above, you will notice that the multiselect question was used to ask responders which products/services they have used. Implementing this as a multiselect question will now allow responders to choose one or more products/services that they’ve used, providing extra context to feedback provided in the form.
To add choices, use the
+ Add choice
button. To add an other box that allows responders to type text in the box, click the Add "Other"
button.Question settings
Unlimited selection - Responders can select as little or as many answers as they’d like.
Exact selection - Responders have to select the exact number of options (ie: 3 options exactly if this is set to 3)
Range - Responders can select a minimum number of answers without exceeding the maximum number of available selections set by the form administrator.
Example use cases:
- Which of our products have you used?
- What kind of services are you looking for today?
- What are the top 3 best qualities that you enjoy about our app? (Select 3 answers)
Rating
You can use rating questions to implement a rating scale. Rating questions are great to measure customer satisfaction!
You can customize the start and end of the rating scale however you’d like. By default, it will go from 0-10. In the screenshot example above, you’ll notice that the question is set to go from 0 to 5.
Question settings
Start - the lowest number you want the rating scale to start at.
End - the highest number you want the rating scale to end at.
Example use cases:
- Net Promoter Score (NPS)
- Opinion scales
Number
You can implement a number question when you want to receive a type of number as a response.
In the screenshot example above, you will notice that a number question was used as an attention check measure. The responder is expected to type the number ‘49’ into the box. If the question is answered incorrectly, the form administrator can potentially filter out the response as a bogus response.
Question settings
Numeric validation
Options: decimal, integer, or percentage
Min/max switch - allows you to customize the range of numbers that a responder can type in.
Example use cases:
- DAO voting
- Prioritization questions
Email Address
You can implement an email address question when you are looking to collect correctly formatted email addresses as answers.
In the above screenshot example, you will notice that the email question is used as a way to let responders enroll in a weekly newsletter.
Example use cases:
- Rewards
- Newsletter signups
- Customer feedback
- Follow up opportunities
Link
You can implement a link question to collect correctly formatted URLs and links. If a responder attempts to add text that is not in URL format, they will have to try again.
In the screenshot example above, you’ll notice that the link question was used to ask responders to share a link to their project submission. Notice how you can even customize the example link in the submission box to further illustrate the example of type of URL you intend to collect from responders.
Example use cases:
- Portfolio link
- LinkedIn link
- Project submission
Date
You can implement a date question on your form. This will allow you to ensure that the form responder enters a valid date, ensuring accuracy of the data.
In the screenshot above, you’ll notice that the date question was implemented to ask responders about when their desired start date is.
Example use cases:
- Birthday
- Expected start date
- Project start date
- Project completion date
Physical Address
You can implement a physical address question on your form to collect correctly formatted physical addresses. This input type uses Google Maps autocomplete to help standardize user input and improve data quality.
In the example screenshot above, you’ll notice that the physical address question was added to ask responders, “Where should we ship your swag to?”
Example use cases:
- Sending swag & gifts
- Planning local meetups
File Upload
You can add a File Upload question to your form when you’d like to collect a file. This can be useful when you want responders to upload files like presentations, images, etc.
In the example screenshot above, the file upload question was used so that responders can upload their resume. If you are the form administrator, you will be able to click a link to download the responder’s uploaded file when reviewing form submissions.
Example use cases:
- Presentation upload
- Resume upload
EVM Address
You can add an EVM Address question when you want to collect correctly formatted wallet addresses or contract addresses as answers.
Note: ENS domains are also supported and will be automatically converted into its EVM address in the form response output.
In the example screenshot above, you will notice that the EVM Address question asks: “What is your ETH wallet address / ENS name?”
Example use cases:
- Rewards
- Wallet collection
- Contract directory
- Allowlists
Payment
You can implement payment options on your form using your Stripe account. If you’d like to accept crypto for payment, you can reach out to us to help set it up!
To get started, add the payment question to your form. You will notice that part of the component is blurred out. This is because you need to connect your Stripe account. Click the
Connect Stripe
button and follow the process to enable payments for your form.Once you have connected your Stripe account, fill out each field of the form and then save the payment question to set the price. Make sure to fill out a detailed description of what the payment will be used for!
Example use cases:
- Sell physical goods
- Sell digital collectibles
- Sell services
Access gating your form (Optional)
You can implement Form Access Requirements to manage who can fill out your form. You can start adding access requirements by navigating to the Access tab on the navigation bar on the left side of the DeForm editor. Click on the
Get started now
button to start editing the requirements. Access gating is perfect for forms that look for responders to own specific NFTs, tokens, etc.Note: Access Gating using Discord or Twitter
You can get access to either of these features by contacting us via email: support@deform.cc
Access Gating using Discord: You can also access gate your form to require users’ Discord accounts to meet certain criteria before they can access your form. (ie: must be part of a specific server, have a certain role, joined before a certain date, etc).
Access Gating using Twitter: You can access gate your form to require users’ Twitter accounts to meet certain criteria before they can access your form. (ie: Must be followed by a certain account, must be following a certain account, Twitter account created before a certain date, etc).
In the example screenshot above, the form requires responders to hold at least .001 ETH in their wallets in order to proceed. It is important to note that there are several different access gating methods available. You can also customize the text content and description on your access gated form!
After clicking the
Get started now
button, you will be able to start adding requirements. First, you’ll need to select a requirement type from the dropdown menu. Currently, you can choose from: NFT ownership, ERC20 ownership, Native token ownership. In the future, you will be able to implement a requirement for the responder to have any contract deployment.You can view the additional fields, their descriptions, and available options in the table below for more information. Once you are happy with your requirements, click the
Confirm
button down at the bottom right to add your requirement(s).Field | Description | Requirement options |
Pick a requirement | This requirement type will automatically add the responder’s wallet address, token ownership (True/False and balance) to your form responses. | - NFT ownership (ie: owns a cryptopunk)
- ERC20 ownership (example)
- Native Token ownership (ie: ETH, MATIC)
- Any contract deployment (coming soon) |
Chain | Once you’ve selected your initial requirement, you can use the chain field to select the network that your requirement is on. | - ETH Mainnet
- Optimism
- Arbitrum
- Base Mainnet
- Polygon
- Testnets are also available (ETH Goerli, Optimism Goerli, Arbitrum Goerli, Polygon Mumbai, and Base Goerli) |
NFT Contract address | The contract address that the NFT is tied to. | - Contract address (pasted in the box)
- Minimum balance (ie: 1, 2, etc) |
Advanced conditions | Customize advanced conditions to further access gate your form. | - Specific Token ID
- Specific Token Name
- Specific Token Attribute |
Conditional Logic
You can adjust your form to only show questions after a certain condition is met. This is known as conditional logic. Conditional logic can be used for showing follow-up questions to certain inquiries, to change the overall flow of a form, or for other various reasons. We will go over a few different ways you could use conditional logic on your DeForm so that you can decide if it would be a good fit for your form!
Multiple forms of verification (Conditional Logic example)
Using conditional logic, you can allow a responder to choose which way they’d like to verify themselves. This can be especially helpful if the community that you’re gathering responses from is spread across various social media sites.
First, you’ll need to create a Single Select input similar to the one shown in the photo above. Customize the question and then add all the options of verification that you’d like to include.
After you’ve created your initial verification question, look over to the right side of your form. You will notice a component that has two tabs: Design and Conditional logic. Click on the
Conditional logic
tab. It should look similar to the photo above. Click on the Get started now
button to continue to the next step.You can customize the name of your logic by double clicking in the title area (which says “Untitled Logic” by default) and editing the text. You can leave it as untitled or change the name to something relevant to your logic (ie: Verification Logic).
The When field will be the event that triggers the logic to start. For this example, click on the dropdown menu (Select a conditional field) and select your verification question. In the above example, the question “How would you like to verify your identity?” is getting selected.
After selecting a question for the When field, you’ll need to select an additional condition. In our example, we want to make sure that when the identity verification choice is selected, the correct verification input will show up. You can reference the following table to see exactly how this would be setup using multiple instances of conditional logic on the same question.
When (chosen question) | Is (selected answer) | Then (expected behavior) |
How would you like to verify? | Wallet Connect | Show “What is your wallet address” w/ Wallet Connect option |
How would you like to verify? | Twitter Connect | Show “What is your twitter username?” w/ Twitter Connect option |
How would you like to verify? | Facebook Connect | Show “What is your Facebook account?” w/ Facebook Connect option |
How would you like to verify? | Telegram Connect | Show “What is your Telegram handle?” w/ Telegram Connect option |
How would you like to verify? | Discord Connect | Show “What is your Discord handle?” w/ Discord Connect option |
There are a lot of different ways that you could use conditional logic. You may notice in the above example, we only used the “is” condition. There are several different condition types: is, is not, is any of, is none of, is empty, and is not empty. Take a look at the table below for more information on each condition type and how it can be used.
Condition types (with examples)
Condition type | Definition | Example |
is | When the specific condition is met, a new question will be triggered. | When “Do you prefer cats or dogs?” is set (answered) to cat, then trigger another question asking “What’s your favorite breed of cat?” |
is not | A new question will be triggered when a certain answer is not selected. | When “Do you prefer cats or dogs” is not set to cat, and instead is set to another answer, trigger a new question asking, “Why do you prefer other animals over cats?” |
is any of | A new question will be triggered when any of the selected answers are picked. This is a multiselect condition. | When “What products of ours do you use?” has any answer(s) selected except for “I haven’t tried any of your products”, trigger a new question that will ask, “Which of the products that you use is your absolute favorite?” |
is none of | A new question will be triggered when none of the specified answers are picked. This is a multiselect condition. | When a question like “What kind of meat do you like?” has none of the meat options selected, responders will receive a follow up with a question, “Are you vegetarian or vegan?” |
is empty | A new question will be triggered when the selected question is empty. | When a question like “What is your name?” is empty, display a question that asks, “If you don’t want to provide your actual name, what is a nickname we can use for you?” |
is not empty | A new question will be triggered when the selected question is not empty. | When someone chooses to answer an “What is your email address?” question (so that the field is not empty), then follow it up with a single-select question asking, “Is it alright for us to contact you for updates?” |
Data Lookups (Optional)
DeForm can verify blockchain assets for each new response. Using data lookups, you can look up certain information about a responder like whether they hold a specific NFT, ERC20 token, ENS, or a native token balance of your choosing.
Note: Data lookups require the Wallet Connect question to be included in your form.
Review the table below for more information about the data lookups currently available.
Lookup Item | Description | Requirements |
ERC20 token ownership | On each incoming response, we will lookup and save the number of tokens owned by a responder that matches the chain and contract address specified by you. | - Form creator must specify which chain the ERC20 token is on.
- Form creator must specify the contract address of the ERC20 token. |
NFT ownership | On each incoming response, we will look up and save whether the responder owns an NFT that matches the chain and contract address specified by you. | - Form creator must specify which chain the NFT is on.
- Form creator must specify the contract address of the NFT. |
ENS | On each incoming response, we will lookup and save the responder’s ENS name, Avatar, Email, and URL. | No specific requirements. You can just add this data lookup to your form. |
Native token balance | On each incoming response, we will look up and save the native token balance (on the chain specified by the form’s creator) owned by responders. | - Form creator must specify which chain they want to check for a native token balance on. |
Step 5: Styling for your form
You can style different elements of your form. We’ll go over all of the different customization options for your form in this section. For example, you can change the display image for your form by clicking the 👀 (eyes emoji) icon near the top of your form. This will allow you to upload a new image.
Note: For best results, we recommend uploading a logo (display pic) that keeps a 1:1 square ratio. (ie: 500x500, 1000x1000, etc)
Once you’ve uploaded a logo from your computer, it will auto update on your DeForm. If you ever want to replace the image, simply hover over the display image element and click it to begin another file upload. Customizing your form’s display image is one of the many different ways that you can style your form!
Elements you can style:
- Your form’s display logo
- Your form’s background color or image
- Your form’s font
- Your form’s cover page (optional setting)
- Your form’s link/social preview image (optional setting)
- Your form’s success page
Reference the table below for the suggested ratio and maximum file sizes for each element. To learn more about customizing each element, reference the table below. You can click on the link for each element to learn more about customizing it.
Element | Suggested ratio | Example Size
(px) | Maximum file size |
1:1 | 500x500 px | 10MB | |
3:1 | 1800x600 px | 10MB | |
3:2 | 1080x720 px | 10MB | |
2:1 | 1000x500 px | 1MB | |
1:1 | 500x500 px | 10MB |
Changing your form’s background
You can change the background of your form by clicking on the Design tab if it’s not already selected by default. Under the global styling section, you will notice the ability to change the color of your form’s background. Additionally, you can even change it to an image!
Changing the background color
You can change the background color of your form by clicking on the gradient-colored circle in the background section of the global styling options located under the Design tab. A color wheel will pop up, where you can simply click and drag your mouse around until you find a color that you like.
If you have a specific color in mind, you can swap between various color modes. This can be done by hovering over the color mode near the bottom of the background component and clicking. It will cycle through the different color modes available.
Background color modes:
- RGB (Default)
- HSL
- HEX
Changing the background image
If you don’t want a gradient background, or if you have a specific branding kit, you may want to change the background image of your form. This process is very simple to do with DeForm using the global styling options beneath the Design tab.
To change the background image of your form, select the dropdown menu to the right of the Background setting under the design tab and then click on Image.
Background image tip: For best results, we recommend uploading a background that has a 3:2 ratio. (with a max of 10MB file size)
Once you click the option to change your background to an image, you’ll be able to select a file from your computer to upload. Select the image that you’d like to use as a background. It will apply automatically to your form!
Changing your form’s font
Not only can you customize your form’s background, but you can also change the font used across all pages of your form. In the above example, we chose to use the Prompt font! DeForm has several different fonts for you to choose from.
You can change the global font style of your form by clicking on the dropdown menu to the right of the Font setting. This is located under the design tab (to the right of your form in edit mode). There are several different fonts to choose from, so choose the one that you enjoy the most!
Adding a cover page (optional)
You can add a cover page to your form using the DeForm editor. This is found under the Cover Page tab of the navigation menu on the left side of the DeForm editor. A cover page is great to have when you plan on collecting important information or feedback from responders.
You can implement a consent checkbox as well which will require responders to check the box before proceeding to your actual form. A cover page is perfect to include an in-depth description on how you intend to use form responses, any disclaimers, etc.
To enable a cover page for your form, toggle the “Page display” switch to on. This section is also where you can choose to enable the consent checkbox for your form. If the consent option is toggled on, it will add a checkbox near the bottom of your form’s Welcome Page. Responders will have to tick the checkbox and press the Continue button to proceed.
Uploading a cover image (optional)
To add a cover image to your cover page, click on the “Add a cover image” button and choose an image file. For best results, we recommend uploading an image in a 3:1 ratio. The file upload cannot exceed 10MB.
Customizing your success page (optional)
You can customize your form’s success page by clicking on the “Success page” tab located on the left side of the DeForm editor’s navigation menu. There are several different elements that you can change on your success page: the display image, title text, description, button text, button link, and share message.
To customize the image displayed on your success page, you can click on the smiley face photo that is there by default to upload your own image. Alternatively, you click the upload icon to the right of the “Image” option under the design tab.
Display image tip: We recommend uploading square images/logos in a 1:1 ratio (ie: 500x500). The file cannot exceed 10MB.
To customize the title/header on your form’s success page, click on the bold text, erase it, and add your own.
To customize the description on your form’s success page, click on the light grey text beneath the header and type in your description. You can leave this blank if you don’t want a description.
To customize the main button on your form’s success page, click the text area of the top button and edit the text. You can change the link that the button navigates to by swapping the link that says “Redirect to” (located under the design tab on the right pane of the DeForm editor).
To remove the main button from your form’s success page, toggle the “Main Button” switch to off (located under the design tab on the right pane of the DeForm editor).
To customize the “Share on Twitter” message on your form’s success page, adjust the text in the box labeled “Custom message”. You can also view what the message would look like by clicking the
Preview Tweet
button.Step 6: Customizing additional form settings
If you want to customize additional settings for your form, you can find useful features by navigating to the Settings tab on the left side menu of the DeForm editor. Here, you’ll be able to toggle useful features on or off. There are several settings to customize.
Submission settings
Setting | Purpose |
Stop accepting new responses | When toggled on, your form can no longer receive any additional responses. |
Email form creator (notification) | When toggled on, the form’s creator will receive an email each time a response has been submitted. |
Email responders a copy of their responses (notification) | When toggled on, responders will receive a copy of their form response. |
reCAPTCHA (bot prevention) | When toggled on, responders must complete a reCAPTCHA before submitting their responses. This can help protect against bots, spam, and abuse. |
IP address collection (bot prevention) | When toggled on, this will collect the IP address from each responder. This helps filter out spam and bots. |
Prevent multiple submissions (multiselect) | You can select one or multiple options for this setting. When an option is selected (ie: Unique wallet addresses), this will help ensure unique submissions. |
Customize your form link
You have three different options to customize your form link: use default link, use a subdomain, or use a custom domain.
Use default link
This is what the default link for your DeForm will look similar to. Every time you create a new form, you will be assigned a link that looks like a form subpage link on the deform website (see screenshot above for reference).
Use a subdomain
If you want to level up your form a notch, consider using a subdomain! In the screenshot example above, you will notice that the form creator opted to use the subdomain kittycatgfx.deform.cc. You can also customize the end of the link (after the slash) if you’d like.
Configuring a Custom Domain
Setting up a custom domain for your form can enhance your branding, provide a professional appearance, and improve user experience.
This document will guide you through the process of configuring a custom domain in your form settings tab. Additionally, it will provide information about the types of domains accepted, specifically root domains and subdomains, and explain how to configure your DNS provider with the necessary records.
I. Types of Domains Accepted
When configuring a custom domain for your form, the following types of domains are accepted:
- Root Domain: A root domain is the main domain for your website or application, such as "example.com". It does not contain any subdomains and represents the highest level in the domain hierarchy.
- Subdomain: A subdomain is a prefix to the root domain and allows you to create separate sections or subdivisions of your website or application. For example, "blog.example.com" is a subdomain of "example.com".
Please note that slugs, which are additional path components in the URL (e.g., "example.com/blog"), are not accepted for custom domain setup at the moment. You can request for this feature here.
You also do not need to include the protocol (e.g. “https://” or “http://”) when adding the custom domain.
II. Configuring DNS Provider with Records
After adding a custom domain, you should see a To configure your DNS provider correctly, follow these general steps:
- Log in to your DNS provider's website or administration panel.
- Locate the DNS management section or a similar area where you can edit DNS records.
- Add a new DNS record, usually a type called "CNAME" (Canonical Name), to map your custom domain to your app's URL or endpoint.
- Enter the necessary details for the CNAME record:
- Host/Name/Label: This should be the desired subdomain or leave it blank for the root domain.
- Target/Points to/Value: Enter the URL or endpoint provided by your app's settings for custom domains.
- Save the changes or publish the DNS record.
- Wait for the DNS changes to propagate, which can take some time (usually a few minutes to several hours). During this time, your custom domain may not be accessible.
- Once the DNS changes have propagated, return to your app's settings tab and verify the custom domain configuration.
Note: DeForm uses Vercel to manage domains. If you are have added your domain before on another Vercel project, you must add an additional verification DNS record for _vercel
that you must add to your DNS provider to complete the set up.
This is a
TXT
record that will be provided to you along with any other records you need to add.II. Domain Verification
Once you have added the records to your DNS provider, DeForm runs a verification check to make sure the DNS records are set up and have propagated. You can always click Re-verify to update trigger this verification check.
Unverified Custom Domain
If you see a red badge with “Connection failed” after you have updated your DNS provider with the provided records, please follow the Troubleshooting steps below.
Verified Custom Domain
This means that the domain is active and you should be able to access your form at the configured domain.
Troubleshooting Custom Domain
- Clear your browser cache or try accessing the custom domain from a different device or network to ensure you're not viewing a cached version.
- Double-check the DNS records for accuracy, paying attention to any typographical errors or missing characters.
- Ensure that the DNS records have propagated fully. You can use online DNS propagation checking tools to verify this.
- If the custom domain is still not working correctly, consult your DNS provider's documentation or our team at support@deform.cc for further assistance.
Give your form a thumbnail preview (for social media)
Make your form stand out on social media by giving it a thumbnail preview! Thumbnail previews are great if you have already established brand identity across social networks.
Uploading your social/link preview thumbnail
To upload a link preview thumbnail, click on the upload icon and select a file to upload. You can only upload thumbnail previews that are less than 1 mb in size. It’s important to note that thumbnail previews may take 5-10 minutes to show up after uploading.
Note: For best results, we recommend uploading link previews that are in a 2:1 ratio (ie: 1000x500, 600x300, etc). The file cannot exceed 1 mb in size.
Getting your thumbnail to appear on Twitter / X
If you are trying to get your DeForm thumbnail image to show up on Twitter / X, there are two methods you can use to get it working. See the table below for more information.
Method | Steps |
Use Twitter Card Validator | 1. Go to this link: https://cards-dev.twitter.com/validator
2. Paste your DeForm URL in the Card URL box and click the Preview Card button.
3. Wait 5-10 minutes then refresh your browser and try typing in the form URL on Twitter again. It should contain your thumbnail now!
Didn’t work? Try the second option. |
Add a random query parameter to the link | 1. Copy the link to your DeForm
2. Paste it into your browser and add ?a=1 to the end of your link. This works on normal DeForm URLs as well as custom URLs!
Example: https://app.deform.cc/form/89e67abe-aa2e-4d76-a6b0-4ae43df0cb5d?a=1
Example using a custom URL:
https://signup.acme.com/?a=1 |
Step 7: Sharing your form
To share your form, you can click on the Share icon at the top of the DeForm editor to copy a link to your form to the clipboard. With this, you will be able to paste the link wherever your community is at so that they can access the form.
Note: If you’d like to have a thumbnail preview for social media, check out the Give your form a thumbnail preview (for social media) section to learn more!
Viewing form responses
You can view responses to your form by clicking on the Responses tab on the left navigation menu of the DeForm editor. Here, you can choose to either download a .CSV file of your responses by clicking the
Download CSV File
button. Alternatively, you can view live results in Google Sheets by logging into your Google account using the
Connect
button. After connecting your account, you can press the View results
button to view the responses.In the screenshot example above, you will notice how the data from a simple form looks on Google Sheets. You can always expand a field by double clicking the divider between sections to resize the field.
Additional features
NFT giveaway feature
DeForm supports NFT giveaways for commemorative NFTs like POAPs. This currently requires manual setup. You will need to email us at support@deform.cc or contact us via Telegram.
Automated promotional codes
You can have promotional codes added to your DeForm. This feature currently requires manual setup. You will need to email us at support@deform.cc or contact us via Telegram.
Upcoming features and roadmap
Want to check out our upcoming features? Got a suggestion? View our roadmap, upvote features that you like, and even suggest new features here: https://deform.canny.io/.
Questions?
You can contact our team by using the support option on the DeForm website (located in the lower right corner of the site).