If you are already using Google Analytics to measure your website traffic and the effectiveness of your marketing, you probably want to make sure that your FormAssembly forms are also included in your tracking.

FormAssembly offers several ways to publish a web form. The most convenient one, is to simply let FormAssembly host it for you, since it just works out-of-the-box. However, since the form is not technically residing on your website, it’s won’t be included in your traffic report.

To fix this follow these 3 easy steps:

Setup the Tracking Code

1. Open your form in the Form Builder and add the ‘GA Tracking Code’ element, from the ‘Add Content’ menu

2. With the tracking code now present in your web form, you need to configure it with the desired Google Analytics profile ID (visit your Google Analytics account dashboard to obtain this value).

Click the Google Account ID field [1], click ‘options’ [2], then ‘advanced options’ [3] and under ‘default value’ [4] enter the ID [5].

3. Save your form and you’re almost good to go…

Enable Cross-Domain Tracking

So far, we’ve made sure that traffic to your web form will be reported in the desired Google Analytics profile, however, there is one more thing you need to do to make sure that the Google Analytics session carries on to your form and all tracking information is correctly measured.

For every page that includes a direct link to your form, or uses an iframe to display your form, add the following code:

<script type="text/javascript" src="//tfaforms.com/js/ga_crossdomain_tracking.js"></script>

This little piece of javascript code insures that cross-domain tracking is correctly configured.

As a reminder, these instructions only apply if FormAssembly is hosting the form for you. If you published the form using the copy&paste method (or the publishing REST API) and tracking is otherwise already set up on your site, you don’t need to do anything.

If you’re unsure about the instructions above or have any questions, don’t hesitate to contact us. We’re always happy to help.

Last week turned up some frightening feedback on Twitter.

Negative feedback happens. Sometimes we can’t do much about it, besides issuing a refund or recommending a better suited alternative. We never, however, bury our heads in the sand and pretend that the user “just doesn’t get it.” If there’s one thing we ought to do right – 100% of the time – it’s to allow people to quickly and easily create a web form.

Worse than this negative feedback would have been no feedback at all. Our frustrated customer, Maya, could have just left without a word. Instead, she gave us a way to engage.

Luckily, I happened to spot her tweet right away. I took a deep breath, gathered my thoughts and then replied. Maya graciously agreed to give us a second chance – and later suggested (as a savvy marketer) that we record our conversation and tell the story.

We routinely do usability tests and investigate support requests to better understand how different types of people approach our form building tool. People have different expectations, shaped by their prior experiences with software, and it’s our job to accommodate that. I was pretty sure that if I could help her get started, she would have no trouble moving forward on her own. And if not, at least I would learn something about our product on the way.

We set up a web meeting, during which Maya first explained what she was trying to achieve and then, very helpfully, walked me through her thought process as she interacted with the application. We then proceeded to talk about the features she needed as I demonstrated how to set them up in her form.

The next morning – Maya updated her feedback.

“Awesome customer service experience with @formassembly. Giving the 121 training and the product 2 thumbs up.”

I wish we had more time to help out every customer that way. A happy customer and a public endorsement is great. Getting another insight into the mind of a customer – thanks to an improvised usability test – makes it really invaluable.

The bottom line is that our customers invest more than just their money. They also invest their time and attention, and we are mindful to not waste it. If you’ve tried our service and had a less than stellar experience, please do let us know – chances are we can make it work for you – or find a way to make our product better.

This is the fourth and last installment in our series highlighting the most important changes in the new Form Builder.

As we improve on the previous iteration of our form building tool, we’re changing a few more things that our existing users might find confusing at first. Here’s a run down that should help you get re-situated quickly:

1. The Form Name

We’re now making a distinction between the form name and the form title. The form title is optional and, when set, displayed at the top of the form, while the form name is used throughout the application – and visible to the form owner only.

This change allows you to choose more meaningful names for internal use, independently of what is visible on the form.

To edit the form name, go to “Properties” and “Form Name” [1].

2. Conditional Questions

If you edit an existing form in the new Form Builder, do not be alarmed if your conditional elements are visible in the design area. This is normal. Hidden form elements are now displayed so you can edit them easily. To see your form as your respondents will see it, use the “Preview” option in the “View” menu.

In the design area, conditional elements are shown as semi-transparent, with a ‘conditional’ tag on the side.

3. Grid and Inline Sections

To simplify our interface a bit, we removed the “Grid” and “Inline” section types from the previous Form Builder. You can now use groups or fieldsets to achieve the same result.

From the “Add Content” / “Section” menu, add a group or fieldset. Click the “Options” icon to access the sidebar and navigate to the “Presentation” panel [3]. There you can choose how elements in the section should be laid out: “inline” and “grid” would give you the same behavior as the old grid and inline sections.

4. Commonly Used Elements

What was previously called “Commonly Used Elements”, or “Predefined Elements”, are now listed in the “Add Content” menu, under the “More…” category. From there, you can access any predefined element that you’ve previously created.

To create a new predefined element, build it first in the Form Builder, select it in the preview area, and, in the sidebar, click the “Add to Predefined Content” option.

That’s all for today. We hope that these short blog posts helped you get up and running more quickly with our new Form Builder.

We still have to cover a number of brand new features, so subscribe to our RSS feed or follow us on Twitter to be notified when the next post is published.

In the meantime, click here to play with the form builder.

The folks over at CapsuleCRM have certainly been making a big splash recently! Since they’ve rebranded from Javelin and gotten on Google Apps, we’ve had a surge of interest from users in how to hook their FormAssembly web forms into CapsuleCRM for all the CRM goodness you could want.

Like many CRM tools, Capsule provides you with a pretty generic Web-to-Lead form – so let’s see how we can replace it with a FormAssembly form and still get your leads sent to CapsuleCRM.

1. Let’s grab a CapsuleCRM Form Key: Log into your CapsuleCRM account, go to Settings – Integration and Website Contact Form Integration. Make a note of the Form Key value – we’ll need it later. You can disregard the remaining instructions on that page.

2. Open the CapsuleCRM Contact Form template in our Form Builder. You may remove fields you don’t need, or just click save and head to the Connectors tab to finalize the setup. Click “configure” next to “HTTP Connector”

3. In the connector setup screen, enter the Form Key (from step 1.), set the “run mode” to “interactive” at the top of the screen, and save.

There is no step 4!  Your FormAssembly web form is now integrated with CapsuleCRM.  Any new lead submissions that come into your FormAssembly form will automatically be sent into your CapsuleCRM account as new leads.

Note: Integration with CapsuleCRM requires a FormAssembly Professional account.

We’re continuing our exploration of the additions and changes in our new Form Builder.

We’ve seen how to do the basic editing and how to edit field properties. We’re now going to look at how you can reorganize your web form by deleting, copying or moving form elements.

The Outline

If you’re familiar with the older version of our form building tool, you might remember that those three operations could be done with the Outline.

The outline is still here, and still a great way to work through long forms. You can use it to reorder form fields with drag&drop, or to quickly jump to any part of the form.

It’s no longer visible by default though, since all tasks that used to require the outline can now be done directly in the preview area. To show the outline [2], go to the “view” menu [1] and click “outline”.

TIP: Your preference is automatically saved, so next time you open a form, the outline will be visible.

Copying & Deleting

The copy option [3] is now available in the sidebar – which can be accessed by selecting a form element and clicking the blue “options” icon. In some browsers, you can also use a right click in the preview to bring up a contextual menu with the “copy” option.

The delete option is available in the sidebar and on the floating toolbar.

Moving Elements

The sidebar [3] offers two additional options to move the selected form element up or down. You can also simply drag&drop from the preview to any new location in your form. Check out the screencast below for a quick demonstration.

Play “Moving Form Elements” Screencast (52s)

If you are wondering how to place fields side-by-side, we’ll cover that and more in the next post. Subscribe to our RSS feed or follow us on Twitter to be notified when it is published.

In the meantime, click here to play with the form builder.

This is our second post in our series highlighting changes in our new Form Builder. If you are familiar with our previous Form Builder and eager to orient yourself in this new tool, please read on.

Today, we’ll show how to access and edit every property for fields and sections.

A single click on any form element in the preview will place the element in “edit mode”, revealing the floating toolbar [1].

In this mode, as we previously covered, you can edit the text directly and set the ‘required’ validation rule. For any other feature, click the ‘options’ button [2] to reveal the sidebar [3].

TIP: If you find yourself needing the sidebar often, you may want to check the “keep the sidebar open” box [4]. This will save you the extra click on the “options” button.

In the sidebar, you’ll find all possible configuration options for edited elements: validation rules, conditional rules, calculations, etc.. A click on each category will expand the relevant property panel [5].

Some of the less common options are hidden unless you check the “show advanced features” option [4]. Again, once you’re comfortable finding your way through the many features offered by the Form Builder, checking the “keep the sidebar open” and “show advanced features” boxes will be a big time-saver as you work on your forms.

Click here to continue to “Part 3 – Reorganizing your form”, or try the form builder right away.