New Form Templates: Tooltips, Mobile Forms,…

We’ve upgraded form templates over the last few days. This affects the look and feel of all web forms. Notable changes include:

  • Tooltips — A help icon next to text fields now shows the field’s description and validation information on hover. You may want to review the field description you provided at the time you created your forms.
  • Variable form width — The width of embedded forms can be resized down to 360px without side-effects, and should degrade well beyond that.
  • Mobiles forms — Although our forms have always been accessible to mobile users, we now provide a specific template for standalone forms accessed from mobile devices. If your site visitors include a fair proportion of mobile users, you should also provide a link to the standalone form whenever you embed a form on your site.

If you installed the form embedding code on your website before August 2008, you should upgrade it to benefit from the new features.

Important: We’re now publishing most updates via our Twitter and Facebook pages. Please subscribe for updates and service status information.

Your feedback is most welcome.

How to Export an Online Form to Excel

FormSmarts allows customers to collect online form responses on the cloud and export them to Excel. We also support a number of options to create custom reports.

Export form results to Excel/CSV

Enable Form Data Storage for Export to Excel

Export to Excel requires that you turn on data storage for each of the forms for which you would like to use this feature.

For privacy reasons, form submissions were not saved on the cloud by default in the past. For Business accounts created after March 20, 2017, storage is now enabled by default. This does not apply to Pro accounts, for which storage is turned off by default and must be enabled for each form if needed. Note that the storage space available with Pro accounts is limited.

To enable stored form results and allow Excel reporting, visit the Submit Actions tab of the Form Details screen of each of the forms for which you would like to access form responses online, as shown in the video below.

Store form responses in on the cloud

You will then be able to download Excel reports from stored form responses in a few clicks with the report generator. Business-level members may also view individual form responses online and download a PDF Report.

To enable storage of form entries by default when you create a new form, check Turn on cloud storage for all new forms in the Settings Tab of the form builder. This option is only available in Business accounts and is turned on by default for accounts created after March 20, 2017.

This video shows how to set up a form to store form responses on the cloud for online access and export to Excel. Although it features an old version of FormSmarts, the information provided can still be used with the current version.

Updating Form Results

To ensure you get consistent and up-to-date data when you export form results as an Excel spreadsheet:

  • If you find out a form response has incorrect or out-of-date information, edit it and amend the data
  • After you submit a test run, remember to remove it.

Excel Report Generator Settings

Excel report generator settings

Show Field Names in the First Row

When toggled on, the first row of Excel spreadsheets shows the name of each field. This option is enabled by default.

Week Starts

The report generator allows you to specify the date range over which a report is generated by either picking a start & end date or choosing a preset period of time (This Week, Last Seven Days,…). For time periods that depend on the first day of the week (This Week, Last Week), we use the default first day of the week for your country (as set in your account). You can change the first day of the week with the Week Starts setting.

Select the Fields (Columns) Shown in the Spreadsheet

Select fields/column included in the spreadsheet

By default, Excel reports include:

You can also create custom reports that only include the fields you need in the spreadsheet. To choose the fields/columns to include/exclude, check/uncheck the fields and metadata items listed in the Fields section of the Settings.

Time Zone

Preset time periods, date ranges and the form submission timestamp shown in Excel reports are now using your time zone (as defined in your computer settings). If you would like to generate a report using a different timezone, select the relevant city in the Timezone drop-down list. Note that the city selected by default may not be your city of residence, but it should be a city with the same UTC offset.

Filter Form Responses by Tags

Filter fields by tags

If you have tagged form responses or a form has system tags set by FormSmarts when the form is submitted, you can create reports than only include form submission with the combination of tags and system tags you have specified.

You can for example create a report with all guests who registered and turned up at an event with the checked-in system tag. This tag is added when the event organizer checks-in attendees with the QR code in the confirmation email or PDF receipt.

Spreadsheet Format: CSV or XLSX

Choose a spreadsheet format from Comma-Separated Values (CSV) or native Excel (XLSX) format. We recommend you use the default CSV unless:

  1. Form submissions have data in a non-Western European language which doesn’t show correctly when you open the CSV spreadsheet
  2. Some of the characters like typographic curly quotes (‘, ’, “, ”) don’t display properly when you open the file with Microsoft Excel

If you experience one of these issues, download the report in Excel XLSX format. You can alternatively change the CSV text import settings in Excel as explained in the next section, or open the spreadsheet with another application like OpenOffice or Apple Numbers (on Mac OS X).

Importing an Excel Report When the Spreadsheet Contains Non-Western European Characters

If an Excel (CSV) report contains text in a language other than English, you may need to change the character encoding to Unicode (UTF-8) in Excel’s Text Import Wizard, as illustrated below. The report may not display correctly for languages other than English unless the encoding is set to Unicode (UTF-8).

In the Data menu, click Get Data > From File > From Text/CSV

Excel Text Import Wizard

In Step 1 of the Text Import Wizard, set the file origin (character encoding) to Unicode (UTF-8):

Excel UTF-8 File

In Step 2 of the Text Import Wizard, set the delimiter to Comma:

Excel CSV Import Comma-Delimited File

Get Online Forms as HTML Email or PDF

The email format we use to send form responses is flexible and supported by all desktop, web-based, and mobile email clients. Plain-text emails however become tedious to read and process for long forms and when form results must be printed for processing, e.g. for mortgage application forms, quote request forms, and many types of forms in the insurance and real estate industries.

Get Form Responses in Rich-Text Format

FormSmarts users now have the option to have form submissions sent formatted as a table in a rich text (HTML) email.

Form in HTML Email
The main advantages of HTML emails are:

  • Form reports are shorter
  • Look is more appealing online and printed
  • Email addresses, web links, and callto links (e.g for Skype) will launch the relevant application when clicked, as long as the field type as been set correctly.

To start receiving form results in HTML, change the Email Format to HTML Email in the Settings tab of your account.

Customize the Subject of Form Response Emails

With Business accounts, the subject line of form response emails can be customized on a form-by-form basis via the API Console as explained in the API documentation. The subject line template may include parameters that will be replaced with the form’s name, its ID, the FormSmarts reference number of the form submission, or the value of a particular input field.

Parameter Description
$form_name Form name
$form_id Form ID, e.g. 196x for form http://f8s.co/196x
$fs_ref_num The FormSmarts reference number of the form submission
$1, $2,… $n The value of the nth input field. The data type of the field must be one of Letters Only, Letters+Numbers, Positive Integer, Number, Country, Date, or the value of a drop-down list, radio buttons or checkbox.

Email subjects can’t be customized via the form builder at this time.

View Form Responses Online or Get a PDF Report

Business-level customers can view form data online and download a copy in PDF using the links located at the bottom of email notifications.

Note: This feature requires that data storage be enabled for each of the forms for which you would like to be able to access form responses online.

Form Response in PDF

Download a PDF

To download a form response in PDF, use the Download PDF link at the bottom of the email notification. If you’ve deleted the message (or have turned off email notifications), generate an Excel report and locate the form entry. Use the link corresponding to the form entry to access it on FormSmarts and download a PDF.

View & Manage Individual Form Responses

FormSmarts allows users to view and manage each individual form entry online via the View online & add notes link in the email notification. If email notifications are turned off or you have deleted the message, download an Excel report and locate the form entry. Use the link corresponding to the form entry to access it on FormSmarts.

You can also work out the URL of a form response if you know its Reference Number: assuming the Reference Number of a form entry is QR6SADIWB4THC6H9S94635LA, its URL is https://f8s.co/e/2QR6SADIWB4THC6H9S94635LA.

Manage a Form Response

View a form response on FormSmarts add notes or comments about it, download a copy in PDF or delete it.

Form Response Metadata

In addition to form data, the page contains additional information that is not accessible by other means like the timestamp associated with the entry and the IP address and approximate location from where the form was submitted.

Send Form Results to Multiple Email Addresses

We’ve updated FormSmarts form builder and form processing back-end to allow several email subscribers for each form. We’ll be releasing more subscription mechanisms later this month.

Before using an email address as a form recipient, you first need to add it to your account, and verify it. You can change the recipients of a form in the Form Details screen of your account.

The number of email subscribers allowed for each form depends on your plan.

How to Make a PayPal Form

FormSmarts PayPal Integration is your best option when you need to collect data and get a payment on a form. It makes it very easy to receive PayPal payments on your forms, while giving you the power, flexibility and ease of use of a full-featured online form builder.

For example, you can easily build:

Note: The demos above are hosted on FormSmarts, but you can also embed a form on your own website with the code snippet given by the form builder.

How to Create a PayPal Form in 3 Minutes: Video Tutorial

This video is a step-by-step tutorial showing how to make a payment form with FormSmarts’ form builder and set up your PayPal account to receive payments.

Receive Payments on a Form

To allow people to pay on a form:

  1. Sign up for a FormSmarts Business account and create a form with the form builder
  2. Add radio buttons, a drop-down list or a checkbox, and enter the description and fees (or item price) formatted as Item Description ($30 USD), as shown on the screenshot below.
  3. To complete PayPal integration, add your Notification URL to your PayPal account.

Registration Form with PayPal

It’s as simple as that. We’ll pick up the items, fees or amounts and quantities that are selected on the form, and we’ll redirect the user to a pre-filled page on PayPal where they can enter their credit card info or sign in to pay with their PayPal account.

Payments are sent to the PayPal account matching your FormSmarts login email. Make sure the email address you use for PayPal and FormSmarts are the same. You can change your FormSmarts login if needed.

Charge for Multiple Items on a Form

You can as easily charge for several items on a form by adding more drop-down lists or radio buttons formatted as just described.

Add a Quantity to a Fee or Priced Item

There are several ways to let your customers choose a quantity for a fee or priced item, for example the number of tickets or guests on an event registration form.

The simplest way is to combine the ticket price or fee and a quantity selector into a single drop-down, as illustrated below:

Online Payment Form with Price and Quantity

If you want to allow your customers to buy an open-ended number of items, use a quantity box instead.

Build a Subscription Form with Recurring Payment

A membership or subscription involves paying a recurring amount each billing cycle until the subscription ends or is canceled. This article covers how to create a subscription form in detail.

In most cases, you just need to add the recurring fee to a form as Monthly Subscription ($19.99 USD/month)

You can also use a recurring payment to allow your customers to pay in installments. A payment in installments is a recurring payment where the number of payments is fixed.

The syntax is Payment in 12 Installments (12x$9.99 USD/month), as show in this demo.

Create a Donation Form

FormSmarts Payment Integration also supports PayPal Donations and recurring donations.

To create a contribution form:

  • Add a Text Box to your form with the field name formatted as My Donation ($ USD)
  • Set the field’s allowed content to Positive Number

You can add multiple donation boxes to a form to allow contributions towards multiple projects or causes on the same form like on this demo.

Offer a Discount on a PayPal Form

FormSmarts allows you to offer discounts on your online payments forms.

We support three types of discounts:

  • Discount for a fixed amount (flat discount)
  • Discount percentage
  • Discount codes, which may be either for a fixed dollar amount or a percentage of the total amount due

Payment in Other Currencies

We demonstrate PayPal forms on this page with amounts in US dollars (USD) with a the dollar symbol ($), but FormSmarts also supports other currencies.

To specify another currency, change the three-letter currency code and currency symbol in the item’s description.

For example, use GA Ticket (€60 EUR) to get a paid in Euros, VIP Ticket (£60 GBP) for a payment in British Pounds, and Registration Fee ($60 CAD) to collect a fee in Canadian dollars.

The text of the button inviting the user to proceed to payment is displayed in their preferred language, in any of the supported languages.

How Payment Integration Works

Payment Flow

Payment Button on a PayPal Form

  1. A customer fills out the registration form for your event and picks the registration package and extras she wants
  2. After reviewing her submission and confirming, she taps the Proceed to Payment button
  3. FormSmarts directs her to a PayPal checkout page where she can choose to sign in to her PayPal account or enter her credit card detail
  4. PayPal confirms the payment is successful and, if you’ve set a form Return URL on FormSmarts, provides a button for the user to navigate to a thank you page on your site
  5. PayPal sends an automated message to FormSmarts notifying us of a new payment
  6. FormSmarts verifies that the amount paid is correct and confirms the registration
  7. We send email notifications to the destination emails of the form
  8. We also send a payment confirmation to the registrant, which she can use as an e-ticket
  9. You can now access the registration online and see it in Excel reports.

How We Identify the PayPal Account Receiving Funds

FormSmarts directs payments to the PayPal account under the email address you use to sign in to FormSmarts.

To ensure money is sent to the correct PayPal account, your primary PayPal email address must match your FormSmarts login. You can easily change your login if needed.

To avoid users having to enter the same information twice if paying by credit card (on the form and on the payment screen), FormSmarts tries to identify the person’s first name, last name, email, postal address, and country provided on the form, and if available pass them to PayPal.

  • Make sure you call the First Name and Last Name fields exactly like this.
  • To allow FormSmarts to recognize an address and populate the billing address on PayPal, mame the relevant fields like on this form or this one.

Redirect Users to Your Site After Payment

If you want to redirect users to a Thank You page on your website after they have completed payment on PayPal, visit the Form Details screen of the form builder and set the Return URL of the form to your site’s URL.

Personalize the Confirmation Message Shown After a Form Submission

FormSmarts allows you to personalize the confirmation message that is displayed after a form has been submitted successfully.

To personalize the confirmation message of a form, visit the Forms tab of the form builder, and click the Edit icon. This feature is only available for Pro and Business accounts.

Default Confirmation Message

Like all messages shown during the form submission process, the default confirmation message is localized. If you change the confirmation message, users will see your personalized message instead of the default confirmation message in their own language.

You can always revert to the default confirmation message by erasing the text in the Personalized Message box.

Links & Formatting

You may insert links in the confirmation message and add basic formatting with this wiki-like syntax.

Attaching Multiple Email Recipients to a Form

With the new version of FormSmarts, Pro users can now subscribe to form results using one or more of the following mechanisms:

A notable change is of course the ability to send forms to several email addresses. The allowance of one email recipient per form for users of the free service stays unchanged.

The new subscription mechanism should best fit the needs of most users. We welcome your feedback about this development.

How to Create Multi-Language Forms

We’ve now released the first international version of FormSmarts. Form users now see instructions, error messages, and confirmation messages in their preferred language. FormSmarts is already available in 27 languages, and more translations are under way.

The languages supported are: Arabic, Bulgarian, Chinese (Traditional), Chinese (Simplified), Czech, Danish, Dutch, English, Finnish, French, German, Greek, Hebrew, Hindi, Italian, Korean, Malay, Norwegian, Polish, Portuguese (Brazil), Portuguese, Russian, Spanish, Swedish, Thai, Turkish and Ukrainian . If your language is not listed and you are willing and able to translate FormSmarts into your language, sign up here.

Other changes worth mentioning:

  • Create forms in any language. Because of the character encoding that was used, web forms could before only be designed using a West-European language. FormSmarts now supports all languages.
  • Now using ISO date format. The date format accepted was changed to the ISO format YYYY-MM-DD. Note that because most users enter dates with a date-picker, the impact of this change is very small in practice. The format used on the confirmation page and in email notifications has not been changed.
  • New form URL format. The default form URL format was changed to accommodate forms which title is not in English. The previous URL format that was based on form title is still supported for backward compatibility.

How the Language of a Form is Selected

Each time a form is loaded, FormSmarts customizes it based on the language preferences set in the user’s browser. Common text, error, help and confirmation messages will be displayed in the form user’s preferred language, not necessarily in the language you used to create the form. For example, if you built a form in English but some of your visitors have set Spanish as their preferred language, those users will see the form questions and the text you entered in English, and help and confirmation messages in Spanish.

Setting a Form to Use a Specific Language

Dynamic language selection explained in the last section provides the best user experience in most cases. This approach however becomes awkward when the main language of the form and the preferred language of the form user employ a different reading direction. If you have built a form in a right-to-left (RTL) language (Arabic or Hebrew) and expect all form users to understand that language and a number of them to use a browser set to a left-to-right (LTR) language auch as English, then you should set the language of the form as explained next.

Dynamic language selection most-usually provides the best user experience and we recommend against setting forms to a specific language except in the case discussed above.

To set the language of a form to a specific language, set the lang parameter of the form URL to the ISO code of that language. So if the URL of your form is http://formsmarts.com/form/lqh and you would like to set it to always display in Hebrew, you would need to use the URL http://formsmarts.com/form/lqh?lang=he or change the URL in the form snippet published on your site to http://formsmarts.com/form/lqh?mode=embed&lay=1&lang=he.

PayPal Integration

If you’re using FormSmarts' PayPal integration on a payment form aimed at users in locales with a non-Western European language, you need to set up your PayPal account to use the UTF-8 encoding.

Give Feedback

We welcome your feedback about this new version of FormSmarts. Please report any problems you may find.

FormSmarts Soon in More Languages

We’ve started to translate FormSmarts’ form handler into other languages. When the international version is released, form users will see instructions, error messages, and confirmation messages in their preferred language.

International form owners will welcome this move, but not only them.

  • FormSmarts users with international websites will be able to create forms in English, while making them available to an international audience without any extra efforts;
  • a U.S. user with a preferred language set to Spanish in his browser will see messages in that language.

Note that the internationalization in progress only applies to the form processor at this time. At the rate we introduce new features to the form builder, we wouldn’t be able to keep translations in sync.

We’ve already emailed international users to ask anyone able and willing to translate FormSmarts into their own language to sign up. If you would like to contribute but didn’t get the email, please register here.

Update: We would like to thank all the users who have already volunteered to translate FormSmarts into their language. Our most wanted languages are currently:

  • Chinese (Simplified) / 中文 (简体)
  • Japanese / 日本語
  • Russian / русский
  • Italian / italiano
  • Polish / polski
  • Korean / 한국어

Calling Embedded Form Users!

Form Widget Size Calculation Upgraded

To accommodate users who need to create forms with a large number of fields, we’ve recently introduced a much more sophisticated way to calculate form widget size. If forms on your site currently display a scrollbar, we strongly advise you to upgrade the form embedding code.

Refresh the Code on Your Website When You Add a Field

Once you have inserted the HTML code for the form widget on your site, we cannot resize it at our end. That means that whenever you add more input fields, you must refresh the code on your website. If you don’t do it, a scrollbar may show up, and some users may not be able to see the bottom of the form.

Space at the Bottom of Web Forms Is Normal

The spare space at the bottom of web forms is there for a reason: leaving enough space for error messages that may occur during form submission. Here again, if you remove that space, a scrollbar may show up, and some users may not see the bottom of the form.

Optimizing form widget size is not a simple issue because it depends on the rendering characteristics of the diverse web browsers, as well as on the different aspects of each form. If you believe the size of a form you’ve created is not optimal, let us know.

« Older Entries Newer Entries »

About the Form Builder Blog

The Online Form Builder Blog is published by FormSmarts, a web form service providing all you need to create a form and publish it online in minutes. FormSmarts makes it easy to build a form and embed it on your site. You can then get form submissions by email or store them on FormSmarts and download an Excel report. Learn more about the many other benefits of FormSmarts.