LogoLogo
Back to studio
  • Formsort documentation
  • โฉQuickstart
    • ๐ŸŸขGet started with Formsort
    • ๐ŸŽCore concepts
    • โ„น๏ธQuestion and content reference
    • ๐Ÿ“•Key terms
    • ๐Ÿž๏ธCreate your first flow
    • ๐Ÿ“–Add content and collect answers
      • ๐ŸคณCapture demographic data
      • โ„น๏ธAdd informational content
      • ๐Ÿ” Review your variable schema
    • ๐ŸŽจCreate a theme
      • Set brand guidelines
    • ๐ŸคนPersonalize your flow
      • ๐ŸŒŸTemplate your variables
      • ๐Ÿง Add conditional logic
      • ๐Ÿ’ซUsing conditional logic with Calculated and API variables
      • ๐Ÿ”šEnd the flow
    • ๐Ÿ”€Set up integrations
    • ๐Ÿš€Go live
      • Auditing your flow for content, functionality, and design
    • ๐Ÿ’ผCommon use cases
      • ๐Ÿ’”Disqualify responders
      • ๐Ÿ—“๏ธAdd a scheduling option
      • ๐Ÿ“„Allow responders to read and accept your company policies
  • ๐Ÿ—๏ธBuilding flows
    • Flows and variants
      • Flow starts
    • Adding content
      • Groups
      • Steps
        • Settings
        • Logic
        • Style
      • Questions
        • General Settings
        • Style
        • Address
        • Comparison
        • Confirmation
        • Date
        • Date & Time
        • Email address
        • File upload
        • Grid choice
        • Iframe
        • Image upload
        • Number
        • Payment
        • Phone number
        • Postal code
        • Question group
        • Region
        • Select
          • Providing choices via API or calculation
        • Signature
        • SSN
        • Text questions
        • Yes/No
      • Content
        • General Settings
        • Statement
        • Image
        • Video
        • Next button
        • Divider
        • Map
      • Endings
      • Using markdown
      • Using variable templating
        • Template formatting functions
      • Copy-pasting form content
      • Content library
    • Conditions and logic
      • Logical operator reference
      • Advanced logic
    • Variables (answers)
      • Variables from questions
      • Externally provided variables
      • Calculated variables
      • API lookups
      • System Library variables
      • Orphaned variables
    • Schemas
      • JSON Schemas
      • Validating flow schemas
    • Redirects
    • Styling and themes
      • CSS Reference
      • Overriding theme styling
      • Custom CSS overrides
      • Content area
      • Animations and transitions
      • Form Layout
      • Typography
        • Adobe Fonts
        • Hosting custom fonts
      • Color variables
      • Dimension variables
      • Question containers
      • Assets
      • Form Buttons
        • Select buttons
      • Inputs and dropdowns
      • Checkmarks
      • Tables
      • Sliders
      • Divider lines
      • Progress bar
      • Comparison cards
    • Variant settings
      • Form behavior for returning responders
      • Group ranking API
    • Publishing and versions
      • Preview window
      • Deploying
      • History
  • ๐Ÿ’พHandling data
    • Philosophy and data retention policy
    • Viewing form answers
    • Responder UUIDs
    • Environments
      • Loading different environments
    • Passing data in
      • URL parameters
      • POST body
      • Embed query parameters
    • Custom validators
    • Form answers and events
      • Analytics events
      • Signed requests
      • Event payload shape
      • Submission frequencies
      • Runtime error reporting
      • Admin API
      • Flow content data format
    • Integration reference
      • Amplitude
        • Amplitude cross domain tracking
      • BigQuery
      • FullStory
      • Google Analytics
        • Updating from Universal Analytics to GA4
      • Google Cloud Storage
      • Google Sheets
      • Google Tag Manager (GTM)
        • JavaScript triggered by flow events
      • Hubspot
      • Jornaya
      • Optimizely
      • PostgreSQL
      • Redshift
      • Rudderstack
      • S3
      • Salesforce
      • Segment
        • Segment Setup
        • Segment cross domain tracking
      • Stripe
      • TrustedForm
      • Webhooks
        • Zapier
  • ๐Ÿ“บGoing live
    • Custom domains
    • Built-in analytics
    • Embedding
      • Web-Embed API
        • React-embed
      • Adding authentication
      • Embedding forms in iOS and Android
      • Setting up a dev environment
    • Split testing
    • Preflight checklist
  • ๐ŸขTeams
    • Accounts
      • Roles and permissions
    • Events subscriptions
    • Workspace domain detection
Powered by GitBook
On this page
  • Customized question labels
  • Content that can be templated
  • Redirect URLs
  • Image URLs

Was this helpful?

  1. Building flows
  2. Adding content

Using variable templating

Personalize your flows by reusing answers you've collected.

PreviousUsing markdownNextTemplate formatting functions

Last updated 7 months ago

Was this helpful?

Customized question labels

It is possible to substitute form answers in question or content labels, redirects, and many other places within a flow.

The syntax used to do this is similar to or , if you're familiar with those.

If I have collected a variable called first_name, I can use it later in the flow by placing the variable within double curly braces:

Hello, {{first_name}}!

If the responder provided Susana as their first name, this label would render as:

Hello, Susana!

If you attempt to render a template when the variable is missing, the variable name will be shown within the flow.

Keep this in mind when designing flows. If you are displaying an answer back to a user on the same step on which you collect it, you should make that content conditional using the operator, so that the user does not see the {{variable}}.

Formsort prevents using variables in steps previous to where they are collected.

Content that can be templated

It's most common to personalize form content visible to the user, but Formsort allows the use of templated variables in a variety of contexts. Two are described below; there are many others.

Redirect URLs

allow the use of templates to create URLs based on the form answers.

For example, you might want to forward along some URL parameters that are present when the flow is loaded, such as utm_source to the place that the responder is ultimately redirected to. To do that,

  1. Use utm_source within a redirect's URL, such as https://example.com/page?utm_source={{utm_source}}

When the user is redirected, the value of the utm_source will be inlined into the URL and

Image URLs

For example, you could load an image based on a user's state:

  1. Collect an answer for the user's state within the flow, calling it something like state_code.

  2. Add an Image content block and set the URL to use the variable you defined, such as https://example.com/images/states/{{state_code}}.png.

Add utm_source as an , so that it is available within the answers.

Similar to redirect URLs, URLs allow the use of templated answers.

๐Ÿ—๏ธ
external answer
image
Mustache
Handlebars
Redirects
Is defined