Archive for 2013

How to Add Links and Basic Formatting on a Form & More…

Did you know FormSmarts allows you to include links on a form? You may also use bold, italic and underline for simple formatting.

Can't see this image? You're missing out something great!

Introducing Form Builder v 3.0

Version 3 of the form builder introduces a number of new functions to the Forms Tab.

Rows in the Forms Tab are now selectable. Simply click on a row to select the corresponding form. That form will become your working form; the form which input fields are listed in the Fields Tab. Other actions like viewing a form, editing it, enabling a previously disabled form and grabbing the form’s HTML code snippet or URL will also make that form your working form. Your working form is saved across form builder sessions provided you use the same browser.

Forms Tab of the Form Builder v 3.0

A new Duplicate button in the equally new toolbar now allows you to create a copy of the working form, thereby deprecating the Form Cloning Tool.

We’ve added a “+” button that takes the user straight to the New Form section. This will be most useful to customers with a large number of forms. To avoid cluttering the user interface, the “+” button only shows up when the New Form section is not entirely visible and would require the user to scroll down.

Finally we’ve streamlined the navigation between the Forms and Fields tabs, providing direct access to the fields of any form by double-clicking on the relevant row in the Forms Tab.

Fields Tab of the Form Builder v 3.0

The most obvious change to the Fields Tab is a new toolbar above the list of input fields. Besides the new “+” button, allowing you to scroll down to the new field section, the toolbar allows you to directly access form-level functions in the Fields Tab: you can now view the form you’re working on, edit it, and get its URL or HTML code while in the process of adding fields, without needing to go back and forth between the Fields and Forms tabs.

Please let us know the changes you like and (more importantly) those you don’t like, and feel free to suggest any ideas that would further improve the form builder.

How to Track the Source of Leads

If you use online forms for lead generation, you will want to know the source of form submissions: from which page of your site a form was submitted, which social network or site the visitor came from, or which marketing campaign led the prospect to you.

Where was the form submitted from?

You can track the source of leads received via form submissions with the fs_ctxval context parameter, giving it a unique value for each source or campaign you wish to track. In this article, we show you how. If you need help setting this up, let us know.

Example 1: Form Accessed by Its FormSmarts URL

The simplest way to publish a form online is to allow your customers to directly access the form by its FormSmarts URL. To track the source of form responses, create a unique URL for each source or campaign:

  • https://formsmarts.com/form/lqh?fs_ctxval=Facebook-May-2013
  • https://formsmarts.com/form/lqh?fs_ctxval=Newsletter-May-12-2013
  • https://formsmarts.com/form/lqh?fs_ctxval=ABC+Conference+2013 (tip: create a QR code with this URL and print it on posters, flyers and stickers)

As you would expect, context values are collected by FormSmarts and shown in notification emails, online & PDF reports, exports to Excel and web API callbacks.

Example 2: Form Embedded into Your Site

If you manually inserted the code snippet for the same form into multiple pages of you site, follow instructions in this section to track leads. If you added the form to your site template, skip to the next section (for WordPress sites) or the one after (for other template-based sites).

Edit each web page where you embedded the form and locate the code snippet in the HTML source. Add the context value after lay=1 (or lay=2), as in the code highlighted below:

<iframe width="540" height="481" src="https://formsmarts.com/form/lqh?mode=embed&lay=1&fs_ctxval=Summer+2013+Conference+Registration+Page" scrolling="auto" marginwidth="0" marginheight="0" vspace="0" hspace="0" allowtransparency="true" frameborder="0" style="overflow-x:hidden"><a href="https://formsmarts.com/form/lqh">Can't see the form? Click here</a>.</iframe>

Alternatively, grab a fresh copy of the code snippet from the form builder, edit the code as described, then add it to your site in the usual way.

Example 3: Tracking Leads on a WordPress Site

If you added a form to the template of your WordPress site, you can track the URL of the page a form was submitted from with PHP.

  • In your WordPress template, replace the form’s HTML snippet by the PHP code below
  • Paste the form’s code snipped given by the form builder between the single quotes as shown.
<?php
$snip = ''; // Paste form embedding code between single quotes
$url = get_permalink();
$re = "/[^\w\s,()\[\]*\/:\-.?]+/";
$ctx = urlencode(substr(preg_replace($re, "", $url), 0, 150));
print(str_replace("mode=h5embed", "mode=h5embed&fs_ctxval=".$ctx, $snip));
?>

Example 4: Tracking Leads on Any Site with JavaScript

You can do the same on any other sites with JavaScript:

<script>
var snip = ''; // Paste embed code here
var pth = document.location.pathname;
var re  = /[^\w\s,()\[\]*\/:\-.?]+/g;
var ctx = encodeURIComponent(pth.replace(re, '').substring(0, 150));
document.write(snip.replace("mode=h5embed", "mode=h5embed&fs_ctxval=" + ctx));
</script>

Notes

This feature is included with all Business plans. Context data may not contains non-alphanumeric characters other than “()[]*/:-.? ” and may not exceed 150 characters.

Offering Discounts with PayPal Integration & Introducing Coupon Codes

FormSmarts allows you to offer three types of discounts to your customers on your PayPal forms: fixed amount discounts, percentage discounts and discount codes.

Fixed Amount Discount

  • Syntax: My Discount (-$5 USD)
  • Example form with a fixed amount discount
  • You may offer more than one discount, but not more than there are paid items selected.

Percentage Discount

  • Syntax: Discount Percentage (-25%)
  • Example form featuring a discount rate
  • You may only add one discount rate to a form
  • Percentage discounts are not supported on SuperCart forms
  • If you’re offering a fixed discount on the same form, both may not be selected at the same time

Discount Codes

Last but not least, FormSmarts now supports discount codes. With discount codes, the buyer will only get the fixed amount discount if they enter a valid coupon code.

Buyer enters coupon code to get the discount on PayPal checkout page

  • Try this example with the discount code FSCP-DEMO

To offer discount codes on your forms:

  • Add a text box to your form selecting the data type Letters + Numbers
  • Create the discount code on FormSmarts with the API Console as shown in this video.
  • Promo codes must start with FSCP- and may only contain alphanumeric characters and dash.

How to Have Users Pay Once for Multiple Registrations or Orders

A little known feature of FormSmarts’ Advanced PayPal Integration is SuperCart. This feature allows a user to submit multiple online forms that include a payment and pay once for the total amount at the end, thereby providing the buyer with a better ‘shopping’ experience and reducing the seller’s PayPal fees. Let’s review two typical uses of SuperCart.

Note: This article discusses an early version of SuperCart. Although it content has been updated and is still relevant, please also read our introduction to the SuperCart Shopping Cart.

Online Registration Form Allowing Several Registrants

Use Case 1: Event Registration Form

The first typical use for SuperCart is to create an online form to register attendees for an event. For illustration purposes, I’ve made a registration form for a conference. We want each attendee to be able to choose a different registration package, pick the seminars they would like to attend and optionally add an accommodation package. With SuperCart, a user can register multiple delegates by submitting the registration form for each one, then pay for all of them at once. In the illustration above, we submit the form once to register Pat selecting the standard registration option, then again for Jim, opting this time for a premium registration and adding accommodation. We then proceed to PayPal to pay for both registrations. This short video shows how this works in practice.

Use Case 2: Order Form

Another common use of this feature is to create an order form allowing a buyer to purchase several products or services while being able to customize options for each one. I’ve built an order form demo to allow customers to configure and order goods (greetings cards in this example). Each product can be customized based on the options selected on the order form. With SuperCart, the buyer will be able to order as many products as they like by submitting an order form for each one, then pay for all of them at once.

How to Create a SuperCart Form

While understanding the concepts behind SuperCart may not appear straightforward, building a SuperCart form is easy:

  1. Set the Return URL of the form to the URL of the page the form is embedded into. If you’re using the standalone form, enter the FormSmarts.com URL given by the form builder instead.
  2. In the Form Details screen, set the On Submission option to Integrate with PayPal using SuperCart.

If you haven’t already done so, remember to set up your PayPal account for Advanced PayPal Integration.

When You Should and Shouldn’t Use SuperCart

Set up your PayPal forms with SuperCart whenever you would like to allow a buyer to pay once for multiple form submissions and providing a single form would affect the form’s usability because each registration/order has too many options or you expect someone will submit more two or three registrations/orders. If it’s unlikely buyers will submit more than one form you should use a regular payment with Advanced PayPal Integration instead.

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.