LogoLogo
Back to studio
  • 🧠Core Concepts
    • Introduction to Formsort
    • Formsort quickstart guides
      • Add content and collect answers
      • Capture demographic data
      • Add informational content
      • Template your variables
      • Add conditional logic
      • Using conditional logic with Calculated and API variables
      • Add a scheduling option
      • End the flow
      • Review your variable schema
      • Set up integrations
    • How data works in Formsort
      • Responder UUIDs
    • Understanding flows
    • Versioning in Formsort (Deploying)
      • Variant revisions
      • Managing revisions
  • ✨Creating Flows
    • Building a new flow
      • Groups
      • Steps
      • Copy-pasting form content
  • Adding questions and content
    • Questions
      • Select
      • Text
      • Address
      • Comparison
      • Confirmation
      • Date
      • Date & time
      • Email address
      • File upload
      • Grid choice
      • Iframe
      • Image upload
      • Number
      • Payment
      • Phone number
      • Postal code
      • Question group
      • Region
      • Signature
      • SSN
      • Yes/No
    • Content
      • Statement
      • Image
      • Next button
      • Video
      • Divider
      • Map
  • Controlling the flow with conditions and logic
    • Advanced logic
  • Variable templating
  • Redirects and endings
  • Field validation
  • Flow and variant management
  • Content library
  • 🧬JSON Form Definition
  • JSON schemas
  • Validating flow schemas
  • Events subscriptions
  • Flow content data format
  • 🎨Styling
    • Customizing appearance
      • Content area & form layout
      • Buttons
      • Typography
      • UI states
      • Color and dimension variables
      • Question containers
      • Inputs and dropdowns
      • Checkmarks
      • Tables
      • Sliders
      • Divider lines
      • Progress bar
      • Comparison cards
      • Animations and transitions
  • CSS & Advanced Styling
    • Custom CSS overrides
    • Step styling
    • CSS reference
  • 🔁Form Behavior Settings
    • Variant settings
      • Form behavior for returning users
      • Group ranking API
    • Navigation sidebar
  • ⚙️Response Data Collection & Management
    • Schema (variables)
      • Variables from questions
      • Externally provided variables
      • Calculated variables
      • API lookups
      • System Library variables
      • Orphaned variables
  • Saving & retrieving responses
  • Importing Data
    • URL parameters
    • POST body
    • Embed query parameters
  • 📊Analytics and Attribution
    • Built-in analytics
    • Split testing
  • 🚀Publishing and Deployment
    • Live preview overview
    • Environments
      • Loading different environments
    • Embedding
      • Web-embed API
        • React-embed
      • Adding authentication
      • Embedding forms in iOS and Android
      • Setting up a dev environment
    • Pre-deployment checklist
  • 📁Workspace Management
    • Accounts
      • Roles and permissions
    • Custom domains
    • Workspace domain detection
  • 🛠️Formsort Admin API
    • Admin API
  • 🔌Integrations
    • Form answers and events
      • Analytics events
      • Signed requests
      • Event payload shape
      • Submission frequencies
      • Runtime error reporting
    • 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
Powered by GitBook
On this page
  • Allowing images taken by a camera
  • Setting up a bucket
  • Creating a filename pattern
  • Specifying file types allowed
  • Allowing multiple answers
  • Restricting image upload size

Was this helpful?

  1. Adding questions and content
  2. Questions

Image upload

An image uploaded from the user, optionally via the camera

PreviousIframeNextNumber

Last updated 22 hours ago

Was this helpful?

This question type is used in cases where you would like the user to take a picture of a document, ID card or themselves.

If you would like the responder to be able to upload files as opposed to take images, you can use the content type. If you would like the responder to sign a document, you can use the content type.

If you don't want the responder to be held up by an image upload question, make sure to have the question be .

Allowing images taken by a camera

By enabling Allow camera option in the settings menu with the question selected, you can give the responder the option to upload their image by taking a photo on their supported devices. The default camera on mobile devices is the front camera and you can mirror the image taken (depending on whether you expect your subjects to be people or documents) by enabling the Mirror image? option.

Setting up a bucket

In order to have the responder upload an image, you need to set up a or to specify where the file will be stored. For detailed instructions on setting up a file integration in Formsort, you can go to thisand this page for

Creating a filename pattern

You can opt to define a naming pattern for the images that your responders upload by enabling Filename pattern in the question settings.

You can any relevant variable you would like to be included in the name of the file into the field. For example, if you type in {{first_name}} into the field, the value of the first_name variable will be used as the filename at upload.

Formsort offers three custom variables for these types of file upload components, built right into the settings of the component itself: sessionUuid, randomUuid, and currentTimeUTC. These variables can also be templated into the filename pattern field to create dynamic filenames.

  • sessionUuid: a uuid that is created once, when the form is loaded.

  • randomUuid: a uuid that is created at and re-run at each upload instance.

  • currentTimeUTC: a timestamp that is created at and re-run at each upload instance.

You can use several of these variables at once, if required, and one pattern we suggest is {{currentTimeUTC}}_{{responder_uuid}}. This ensures uniqueness via the timestamp, while still tying the file to a particular user via the responder_uuid System Library variable.

Note that these extensions will be added automatically. You should also set a fallback naming convention in case the variable is not defined by typing it into the Filename pattern fallback field. Values here cannot use templated variables.

Specifying file types allowed

You should whitelist MIME types when generating signed upload URLs.

Allowing multiple answers

Enabling allow multiple uploads lets the respondent upload more than one image as an answer to a question.

Restricting image upload size

You can enable a size restriction for a responder's upload. The minimum value must be greater than 0. If the restriction is not met, the responder will be shown an error and be prevented from moving forward in the flow.

Visit the section for details on built-in variables that provide information about the responder's environment and context.

You can whitelist by adding them to the Allowed MIME types field. If none are set, all MIME types will be allowed.

System Library variables
MIME (Multipurpose Internet Mail Extension) types
file
signature
S3 bucket
GCS bucket
page for s3
GCS.
template
optional