Most of the features you’d use to build a great survey can also be used to build highly interactive contact forms.
We use the term “survey” frequently around here (duh!) but some of the best uses for Alchemer are not surveys at all. They’re web forms!
This is the first of two how-to articles on using Alchemer to create Contact Forms, Lead Gen Forms, Support Request Forms, Newsletter Signups, or any kind of custom form with Alchemer.
Why use Alchemer to create a contact form?
- It’s cheap and easy
- We have 28 core question types
- You can embed the form directly into your website without a developer
- We have integrations with Salesforce, Google Docs and Email Service companies
- You can use Email Notifications to get form data delivered to your inbox!
Here’s how to do it!
Creating a Single Step Contact Form
A single-step contact form means that users fill out a single page, and then they see a thank you after submitting.
Step 1: Create a New Survey With a Contact Form Template
Create a new survey and choose one of the contact form templates that seems closest to your need.
- Contact Form – Simple
- Contact Form – Extended
- Support Form
- Newsletter Signup – Extended
You can (and should edit the questions and layout), so just pick something similar. Read more about the basics of creating a new survey.
The templates all have examples of forms and email auto-responders.
Step 2: Edit the Questions
Modify the questions to suit your needs. Clicking the pencil icon will allow you to modify many options. You can also add or reorder questions using the tools to the right of the questions.
Step 3: Process the Submitted Data
You have to decide what happens after the user clicks the submit button. Every form or survey in Alchemer always has at least two pages. The second page acts as a Thank You page, but it can also hold actions to act on the data collected. Use these actions to send email or push data.
Email auto-responders
Pushing information out of Alchemer
Alchemer Pro and Enterprise accounts have access to an Action type called HTTP Post. This is used to push data to outside services like Email lists, newsletter signups, customer databases, etc. You can transmit information to other outside services such as SalesForce.com, Constant Contact, Campaign Monitor, etc.
Step 4: Modify Look and Feel
When you are finished with your questions, it’s time to move on to modify your look and feel. If you used one of our Contact Form Templates, it already comes with a look and feel template that is well-suited to being embedded on a website.
You may, however, want to tweak the width of the form, the font size or font family, text color, the background color, or Submit Button text. You can change all those things on the Style tab. You can also select different templates or modify the HTML or CSS if desired.
For you designers out there – it is also possible to modify the look of a survey by adding CSS to your site that acts on the survey form’s ID and Class names.
Step 5: Embed the Form on Your Site
When you are happy with your preview, it’s time to Share (publish) the Contact Form. Clicking “Share” will show you all the options we have to share a form. You’ll most likely want to select the Embedded Survey > Javascript option. You can cut and paste this small snippet of Javascript code and place it on the page in your website where you want the form.
A Special note to WordPress or other CMS users like Drupal, etc.
You can create a page or a post and paste in the Javascript snippet. You need to make sure you paste the Javascript code into the HTML, so if you are using the Rich Text Editor click on the HTML button and paste the code in there. If you paste it in the Rich Text Editor directly it won’t work, because the code will be interpreted as copy text.
You’re done – go visit the page and test your form!
Email actions will run immediately (unless you set a time delay) as will integration hooks. Good luck!