The Online Form Builder Blog

Posts Tagged ‘form builder’

« Older Entries

Engage Users via Twitter & Facebook to Increase Form Conversion

FormSmarts allows you to better engage with your user community by adding a social component to your online forms. The assumption with social networks is that a user is more likely to perform an online action such as filling out a form, registering for an event or sign up for a class if she knows that her friend or colleague has already done so.

Online Forms Get Social

For each form, FormSmarts allows you to set up a message template that will be used to post an update to social networks when the form is submitted. The message can incorporate any information entered on the form.

The user’s expectation when filling out online forms is that the information submitted will only be disclosed to the form owner, and you clearly need to ensure you don’t leak personal information (more about this in the last section). We define two types of input fields on a form. Those which will be populated by information which—taken out context—is so general that it can be safely disclosed, and those which should be kept private. In the example below, we deem First Name, City and Country as public, while all other fields are deemed private.

How to Set Up FormSmarts to Post Twitter Updates

First connect your Twitter account with FormSmarts to allow FormSmarts to post tweets on your behalf. You will be taken to Twitter for authentication and asked to authorize FormSmarts to post updates using your account. You will only need to do this once. Note that FormSmarts will not have access to your Twitter password. Once this is done, Twitter will send you back to FormSmarts.

Next click on Twitter Feed Setup in the Form Details screen of the form builder. Enter a short text using placeholders $1, $2, $3,… where you want the value of the corresponding input field to be inserted. Use $1 for the value of the first input field, $2 for the second, etc., in the order fields appear on the form.

Posting Updates to Your Facebook Wall

When someone submits a form, FormSmarts can post an update to your Facebook wall via the Twitter App for Facebook. First set up FormSmarts to post updates to Twitter as described in the previous section, then add the Twitter App to your Facebook page or profile. We will add native support for Facebook if there is demand—please let us know here. (Note: if you ended up here while looking for information on integrating an online form to Facebook, read this).

Respecting the Privacy of User Information

Protecting the information of your users is of paramount importance. When someone submits his information via an online form, he does it with the implicit understanding that his personal information will not be disclosed.

1. Add a privacy note on the form (like on this demo) to ensure people understand that some none-personal information will be posted to social networks. Say what information will be published.
2. Make sure you’re using the correct placeholder (e.g. $1, $2,…) in the message template. Remember that $1 will be replaced by the value of the first input field in the order they appear on the form, $2 will be replaced by the value of the second input field, etc.
3. If you change the order of fields on the form, don’t forget to update the message template with the correct placeholder name.
4. Always test the form after setting up a Twitter feed or changing field order.

To further prevent the leak of confidential information, FormSmarts will not publish Twitter updates for SSL secure online forms, even if this has been set up through the online form builder.

How to Disable a Twitter Feed

If you no longer want FormSmarts to post a Twitter update when a form is submitted, simply erase the message template in the Twitter Feed Setup screen (pictured above) and save changes.

Posted on December 13th, 2011 in form builder.
1 Comment »
Tags: facebook, form builder, form recipient, form results, form submission, pro, twitter

Advanced PayPal Integration in Two Steps

The new FormSmarts Advanced PayPal integration is as easy to use as our popular PayPal form feature, but it provides several additional benefits, mainly:

• FormSmarts only notifies you of a new order form submission after the payment is confirmed and verified.
• Your customer receives an automated order confirmation email.

What Are the Benefits of Advanced PayPal Integration?

FormSmarts standard PayPal integration is easy to use and set up as it requires no change to your PayPal account. A downside to this is that FormSmarts has no way to know if the payment went through or not, and you — the seller — needs to manually reconcile payments and order forms using the FormSmarts Reference Number. That’s usually not an issue for small sales volumes, but can quickly become so as sales increase. At this stage payment processing must be fully automated and integrated with the form processing platform. That’s exactly what FormSmarts Advanced PayPal Integration is doing. Here are the benefits:

• The seller is only notified of an order when the payment has gone through.
• The transaction won’t appear in stored form data until the customer has paid.
• No need to reconcile the order forms received with payment notifications from PayPal.
• FormSmarts verifies that the payment details match those of the order.
• FormSmarts sends an order confirmation email to the buyer with both the order details and a payment confirmation. If you have verified your website and uploaded a logo, your site URL and logo will appear in the email.
• Payment processing is fully automated and if you’re using online/PDF reporting or export to Excel, your order forms are on autopilot — at least for the ordering part.

Setting Up Advanced PayPal Integration

To set up advanced PayPal integration, first create an order form with prices formatted in the same way as you would do with FormSmarts standard PayPal integration. Then visit the Forms tab of the form builder and select Integrate with PayPal using advanced integration in the Form Details screen, as illustrated below.

It’s now time to log on to your PayPal account to add your Secret PayPal URL. PayPal will use that URL to communicate with FormSmarts. You’ll find your personal URL in the Security Settings section of your FormSmarts account. Note that the URL contains your private security key and it should therefore be kept confidential.

In your PayPal Profile, go to Selling Preferences, Instant Payment Notification Preferences and paste your URL there. Make sure IPN message delivery is enabled before saving.

Notes

Advanced PayPal Integration comes with all Business-level plans and doesn’t work with recurring payments/PayPal subscriptions or donations at this time.

Posted on April 28th, 2011 in payment form.
8 Comments »
Tags: form builder, payment integration, paypal, paypal form

How to Build a PayPal Subscription Form

Many websites allow visitors to access online content and services for a monthly subscription fee. Creating a subscription form is somewhat different from creating a regular payment form, because it involves setting up a recurring payment, so that the buyer is automatically billed a fixed amount of money at a fixed interval until the subscription is canceled. The online form builder’s payment integration feature now supports PayPal Subscriptions.

Creating a Subscription Form

Creating a subscription form is quick and easy:

1. If you haven’t got a FormSmarts account yet, sign up for a FormSmarts Pro or Business account, then create a form with the form generator
2. In the Form Details screen of the form generator, set the On Submission option to Show Confirmation & Integrate with PayPal
3. Add radio buttons, a drop-down list or a checkbox, and enter the description, price and duration of subscription options formatted as My Subscription ($19.99 USD/month), as shown on the screenshot above and in this demo.

Duration of a Subscription

The time before another payment is due can be specified in days, weeks, months, or years. The form builder understands the following formatting variations:

• Monthly Subscription ($9.99 USD/Month)
• 30-Day Subscription ($9.99 USD/30 days)

Trial Subscription

Like in the example presented in the first section, you may specify a trial period for the subscription. This is typically used to give a free trial subscription to the buyer before he is charged for the first billing cycle. The buyer will not have to pay anything if he cancels the subscription before the end of the trial period.

• The trial period doesn’t need to be free
• You may specify up to two trial periods
• Any trial periods must be placed on the form after the main subscription specification.

Any Feedback?

As always, your feedback is important to us and is our primary source of inspiration for developing new features. You can also post your questions and comments on Facebook and Twitter (@FormSmarts).

Posted on January 17th, 2011 in payment form.
1 Comment »
Tags: form builder, payment integration, paypal, paypal form

Attach a File to a Form in a Click: File Upload Made Easy

With the new file upload feature, you can now let form users attach a picture or document to a form like in this demo.

Adding a file upload widget to your forms is as easy as adding a simple text box: visit the Fields Tab of the form builder, and create a new field choosing the File Upload widget. That’s all there is to it. Once a file has been uploaded and the form confirmed, that file will be stored on FormSmarts and available to you.

Customizing File Upload Fields

Although a file upload field created as just described will be fully functional, you may want to restrict the type of content the form will allow users to upload, as well as set the maximum file size permitted. You can also specify how long FormSmarts should hold uploaded documents on the server. To change these options, visit the Field Details screen of the form builder.

Allowed Content Type

By default, a file upload field will accept all supported content types: documents (PDF, Word, Excel, RTF, OpenOffice ODF, and HTML documents) and images (JPEG, PNG, and GIF). You can restrict the type of content the form will allow users to upload to either documents or images. For example, if you’re building a job application form, you will want applicants to upload their CV and should restrict uploads to Documents to prevent mistakes.

Maximum File Size

By default, the maximum size of uploaded files is set to the maximum for your plan: 2Mb for Business Starter, 4Mb for Business Plus, and 6Mb for Business Max & Premier. You should use the slider to change that value to whatever makes sense for the purpose of the form.

Storage Policy for Uploaded Content

You can define the period of time during which FormSmarts will store uploaded content. At this time, we support five storage policies:

• 5 days
• 10 days
• 30 days
• 90 days
• Forever (default)

While storing file attachments on the server forever gives you the most flexibility, you may then exceed your storage quota — currently 75Mb for Business Starter, 500Mb for Business Plus, 1Gb for Business Max, and 3Gb for Business Premier. We’ll send you an email if you’re getting close to or exceed that limit.

Secure File Upload with SSL

File upload works with FormSmarts secure form feature so that files attached to a secure form only transit via a secure connection (SSL), both when uploaded to FormSmarts and downloaded to your computer.

Any Feedback?

As always, your feedback is important to us and is our primary inspiration for developing new features and improving existing ones.

Have a wonderful 2011.

Posted on January 4th, 2011 in file upload.
No Comments »
Tags: business, file attachment, file upload, form builder, secure form, SSL

What’s the Return URL of a Form?

When creating a new form with FormSmarts Form Builder, you’re asked to provide a return URL for that form. The return URL is where visitors will be automatically redirected to or invited to go to (by clicking a link) after a successful form submission.

We also use return URLs to compute the list of websites in Settings > Websites.

If you don’t have a web page, simply use “http://formsmarts.com” as the return URL.

Return URL & Form Ownership

To prevent abuse, the link to the return URL is only displayed on the confirmation page if the form owner is verified or is a FormSmarts Pro or FormSmarts Business user. Visit the Settings tab of your account to verify your sites.

Redirecting Visitors to a Page of Your Site

You can set up a form to skip the Confirmation page and automatically redirect the visitor to the form’s Return URL. Note that the visitor will then not get the FormSmarts Reference Number of the transaction. Redirection can be activated in the Form Details screen of the form builder, under On Submission. FormSmarts Pro and Business customers only.

PayPal Landing Page for Forms Including a Payment

If you use our PayPal form feature to add a payment to your form, the Return URL will be used as the PayPal landing page. Users will be redirected to that page by PayPal after the payment has been completed.

Posted on July 11th, 2008 in HTML form.
20 Comments »
Tags: form builder, form owner, payment integration, paypal, return url, web forms, widget

Form Color Settings

Like many FormSmarts users, you may sometimes want to customize the style of your web forms. This may be because you want the forms to match the rest of your website, or because you want a form to stand out on a web page.

The form builder now allows you to change the text and background color of your forms. Visit the Form Details window in the Forms tab to set color preferences for a particular form.

Things to note:

• color settings only affect embedded forms, not forms access by their FormSmarts URL
• because your color settings are stored in our servers, you can change settings and see the result immediately. You don’t need to update the form code on your website.

How to Change Form Colors

1. By default, form text is black, and form background is transparent. This should fit the needs of most users, and if you’re happy with this, you don’t need to do anything.
2. If you do want to change a color, the easiest way is to choose one of the popular colors we’ve preselected. Just click on the color you want.
3. If you prefer to use your own colors, you may type any valid 6-digit HTML color code directly. For example, 808080 is a shade of gray.

Usability Note

It’s important to preserve the accessibility of your forms to visually impaired visitors, and their usability under poor reading conditions (e.g. bright sunshine). Always keep a high color contrast.

Posted on July 6th, 2008 in form builder.
7 Comments »
Tags: embed, form builder, usability, web forms, widget

Form Owner Verification with Google Page Creator

To verify you own a website, we ask you to create a file with a specific name on your web host. If you use Google Page Creator, proceed as follows to verify your site:

1. create a new page
2. enter the verification file name (e.g. syronex8800…2523.html) as the page title
3. publish the new page

Form ownership verification is optional but recommended to build trust with your visitors. It is required you intend to advertise a web form URL by email.

Recent Issues with Google Page Creator

Although hundreds of Google Page Creator users have successfully verified their site, we’ve had a few issues in the last few days. Google was redirecting some of the requests to googlepages.com to the same page on google.com, thus preventing us to check the verification file exists. We obviously have a limited scope for action, but we identified a likely cause and took technical measures that seem to have solved the problem. Leave a comment if you experience any more problems.

Posted on July 2nd, 2008 in form builder.
1 Comment »
Tags: embed, form builder, google page creator, widget

How to Lay Out Form Input Fields

Your goal as a web publisher is maximize the number of (legitimate) respondents to your forms. A first step towards this goal is to lay out your forms in a way that is intuitive to users, makes forms faster to fill in, and minimizes form validation errors.

It follows four points you should consider when designing a web form:

• choose the most appropriate input field widget for the situation
• group fields together within logical sections
• place multi-line text input fields (textarea in HTML) towards the bottom of the form
• group optional fields together at the bottom of the form

The first point is discussed in details in FormSmarts documentation.

The second point commends, for example, that when you ask people about their contact details, you group all relevant fields (first name, last name, email,…) together. We found that most form designers tend to do that right. The form builder will in the future allow users to define different logical (and visual) sections within web forms.

Multi-line text input fields obviously tend to take longer to fill in than other input fields. They require more effort, thinking and typing, so place them after other fields. Visitors will be less inclined to abandon the form altogether if they have already spent time completing the first part of the form.

The last point is about grouping optional fields together at the bottom of the form. This allows people to quickly review the remaining questions, and skip the fields they don’t want to fill in or don’t apply to them. This may of course conflict with grouping fields within logical sections. In that case, place optional fields at the end of each logical section.

We’ve now enabled comments, and we warmly welcome your thoughts and feedback about this post. if you’re reading this by email, just click on the title to post a reply.

Posted on June 29th, 2008 in HTML form.
4 Comments »
Tags: form builder, form design, howto, input field, web forms

Ever Wished You Could Reorder Fields?

The set of form-making operations supported by FormSmarts form builder was up to now almost complete, allowing to:

• create a form
• delete a form
• edit form properties (name, title, return URL, form filling instructions, recipient email account)
• add a form input field
• delete a field
• edit field properties (name, description, field type, input widget, optional/required)

The last unsupported operation was to allow users to easily change the order in which fields appear on a form. This is often needed to:

• group fields logically
• group optional fields together at the bottom of a form
• insert a field in a existing form
• move fields around to increase the visual appeal of a form

Reordering fields manually is tedious, as it involves deleting and re-creating fields.

No more. Reordering fields is now a trivial drag & drop: in the fields tab, drag the field you want to move, and drop it in the position you want.

As usual, we welcome your comments and suggestions about this feature.

Posted on June 20th, 2008 in form builder.
5 Comments »
Tags: form builder, form design, input field

Managing Email Accounts & Form Recipients

You can manage the email addresses linked to your FormSmarts account in the Settings tab of the online form builder, under Email Accounts.

Adding an Email Account to FormSmarts

Before you can start using an email address as a form recipient, you must add it to your account and verify it.

To add a new email account to FormSmarts, visit the Settings tab of the form builder. Click the Email Accounts link and enter a name and email address under Add an Account.
FormSmarts verifies that the owner of an email account agrees to his email being used by sending a verification link. Once the email account owner has visited the verification link, the status of that email address will change to Verified. Use the Refresh button to check if a newly added email account has just been verified. You can start using an email address as a form subscriber or as your FormSmarts login as soon as it shows as Verified.

Changing the Recipients of a Form

When you create a new form, responses are sent to your login email address by default. To have a form sent to another email account (or email accounts):

1. Add a new email address to your account as described in the last section.
2. In the Forms tab, edit each form checking or un-checking each email recipient as required (see screenshot above).

Note: An email address will only appear in the list after it has been verified (see previous section).

Changing Your Login Email

You can set any of the verified email addresses registered on your account as your FormSmarts login. Note however that you won’t be able to use an email address as you login if it’s already the login of another account.

A key icon is displayed next to your login email address.

Note: Any email addresses that you use as your login or form recipient has the Active status and cannot be removed (the corresponding trash can will be grayed out).

Removing an Email Address From Your Account

To remove an email address from your FormSmarts account, Visit the Email Accounts pane of the Settings tab and click on the trash can icon corresponding to the email address you want to remove.

Trash can icon greyed out?   The trash can icon will be grayed out if the corresponding email address is still in use as a form recipient by at least one form or is the account’s login. To remove the email address, first edit each of the forms in the Forms tab and uncheck that email address under Form Subscribers (see screenshot above). Then go back to the Settings tab, refresh the list of email accounts, and click on the relevant trash can icon.

Give Feedback!

We welcome your feedback about this feature. This will help us improve it in the future.

Posted on June 16th, 2008 in form builder.
20 Comments »
Tags: form builder, form recipient, form results

« Older Entries