Formstack Component

Embed an alternative to the UBCMS native forms.

The UBCMS is not an appropriate place for ANY regulated private data, such as bank credit/debit card numbers, government-issued ID numbers, health information or computer passwords.

On this page:

Last reviewed: October 18, 2024

Accessibility
  • Forms must be accessible.
  • Link text should be meaningful.
  • Third party content must be accessible.

> Read more about making this component accessible.

Read more about using forms in the UBCMS, including Formstack, in our Features Library.

Using This Component

This component embeds a Formstack.com form into your page. Add the component to the page. It has one tab.

Use the Default Formstack Code

With this component, you can use the default Formstack embed code but this method does not support turning off jQuery, jQuery UI, or FormStack-derived themes.  

When the component is opened for editing, it will initially display 'Use Formstack's Quick Start embed code.  -- replace this with the default embed code from your Formstack form.  

The UBCMS component will convert the code into a “no jquery” version of the code. The component validates the pasted Formstack code and will alert the author if there are any problems.

Initially a "Form is loading…" message may be displayed, but will disappear as the actual form is loaded from Formstack.

If you use Formstack Workflows use an HTML Snippet

This component works best for Formstack Forms.

Technical Restrictions

  • For the UBCMS, the vendor warns against embedding more than one Formstack form on a page. There is a workaround, but it requires developer level skills.
  • In Formstack, do not use the default Other in a dropdown list with the additional text field - both will be labeled the same id. Instead use a separate and clearly labeled "other" text field.
  • In Formstack, do not use the built in date picker. Instead provide separate day, month, and year fields.
Known Issue - One Form Per Page

> Read more about this Known Issue

Be careful with Formstack options

Do not use the default Other in a dropdown list with the additional text field - both will be labeled the same id. Instead use a separate and clearly labeled "other" text field.

Do not use the built in date picker. Instead provide separate day, month, and year fields.

Configure - Main Settings

When the component is opened for editing, it will initially display 'Use Formstack's Quick Start embed code.' Simply paste in the code from your Formstack form here. There are no further options or settings.

Where Do I Find the Code in Formstack?

This component uses the default version of the JavaScript embed code from your Formstack form, which is provided on their Share tab.

Need to turn off jQuery or jQuery UI?

This component uses the default code from Fromstack.com. If you NEED to use the code with jQuery or jQuery UI turned off, consider embedding your form using the HTML Snippet.

UB Branded forms

Your forms can be styled appropriately for use in the UBCMS using our UB Branded theme.
> Learn more about the UB Branded theme.

Prefilling Fields

Formstack fields can be prepopulated using the InfoLoader, or through variable included in a link to the form.

Errors in UBCMS Author

If there are any problems with the code that was embedded from Formstack, the component will display an error message in the Author environment; e.g. if jQuery is turned OFF in Formstack.com when the code was generated, or if only part of the code was copied.

Best Practice: Preventing Spam & Delivery Errors

While spam can clog your intake, bad agents can also abuse our forms to spam third parties, threatening our reputation and potentially getting our forms blacklisted. While some forms can be protected behind secure pages (where only UB constituents can see them), most of our forms are on public pages, where they are at risk from clumsy behavior and abuse.

These native Formstack features are recommended for high-volume or very sensitive forms:

  • Invisible reCAPTCHA - This additional setting in the 'Form Extras' tab forces untrusted users to complete a challenge before they can submit the form. This helps block robots and discourages human spammers by slowing them down. Google's algorithmns decide who is trustworthy based on their online behavior, and most users will not see the puzzle.
  • Email Validation - This additional setting on the Email field adds a second email box. The user must fill in both fields and they must match. This resists accidental entry of a bad email address. It also reduces email bounces (e.g. from a misdirected confirmatione mail) -- high bounce levels can result in our forms being blacklisted.
  • Skip the Confirmation Email - Generally we encourage confirmations to set expectations and provide a record of their submission, but this feature gives bad agents a tool to enter a third party address, and thus generate spam or even a phishing attack to that third party. Not only is this behavior undesirable, but high bounce levels or spam complaints can result in our forms being blacklisted.

Accessibility Concerns

See an Example

Was This Information Helpful?

(Required)
(Required)
(so we can thank you or request more details)
(Required)
(buffalo.edu addresses only please)
(Required)