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
  • Using template functions
  • Chaining template functions
  • Available functions
  • capitalize
  • ceil
  • default "some-text"
  • floor
  • get
  • label
  • lowercase
  • round
  • uppercase
  • usd

Was this helpful?

  1. Building flows
  2. Adding content
  3. Using variable templating

Template formatting functions

Format answers before using them in templated strings.

PreviousUsing variable templatingNextCopy-pasting form content

Last updated 1 year ago

Was this helpful?

Using template functions

Sometimes, your answer will need formatting before it can be used in a template.

For example, you might have an API that returns an answer called product_price as a number, using an .

If we used product_price directly, it wouldn't look good for some answers, since we're used to seeing money formatted using commas.

Price: {{product_price}}.

When the product_price is Would render as:

Price: 1499.95

To address this, you can use template functions. Template functions come after the answer variable, and are separated using the pipe character (|). Here, we use the usd function to show the price as US dollars:

Price: {{product_price | usd}}.

Would render as:

Price: $1,499.95

Much better.

Chaining template functions

Template functions can be chained togetherβ€”just separate subsequent template functions with the | character. Continuing the above example, we could round the value before displaying it as usd so that we have a nice round price.

Price: {{product_price | round | usd}}.

Both functions are applied, and we get:

Price: $1,500

Available functions

capitalize

Capitalizes a string (upper case the first letter).

ceil

Rounds up a number to the nearest integer.

default "some-text"

Sets default text if the templated variable is undefined, instead of the default, which is to show the variable name in curly brackets.

For example, if I have a template like Allergies: {{allergies | default "none"}} then Allergies: none will be shown if the variable is not defined. If defined, the variable wil render like it would normally.

The default text shown will not set the answer value for the variable.

It's possible to use the empty string ("") as the default if you would like nothing to be displayed.

floor

Rounds down a number to the nearest integer.

get

The key is specified as the second parameter:

You live in the city of {{user_address | get "city"}}.

label

returns the choice label, rather than the value

lowercase

lowercases a string.

round

Rounds a number to the nearest integer, up or down.

uppercase

UPPERCASES a string.

usd

Displays a string as US dollars.

Not seeing what you need?

Or, if you think your use case would be generally useful, drop us a note in the chat!

Gets a value from an object (such as an answer), at a specific key.

Consider defining a that formats your answer into what you need.

πŸ—οΈ
API answer
Address
calculated answer