Skip to main content

Documentation Index

Fetch the complete documentation index at: https://usegately.com/docs/llms.txt

Use this file to discover all available pages before exploring further.

Gately Forms lets you create powerful forms without writing backend code. Collect submissions, handle file uploads, and process payments all in one place.

​
Features

Drag & Drop Builder

Visual form builder with live preview

File Uploads

Accept images, documents, and videos

Payment Collection

Integrate Stripe for payments

Conditional Logic

Show/hide fields based on responses

​
Creating Forms

​
Via Dashboard

  1. Navigate to Forms in your dashboard
  2. Click Create Form
  3. Use the drag-and-drop builder to add fields
  4. Configure form settings
  5. Publish and embed

​
Field Types

TypeDescription
TextSingle-line text input
TextareaMulti-line text input
EmailEmail with validation
NumberNumeric input
PhonePhone number input
SelectDropdown selection
Multi-selectMultiple choice selection
CheckboxSingle checkbox
RadioRadio button group
DateDate picker
TimeTime picker
FileFile upload
PaymentStripe payment field
RatingStar rating
SignatureDigital signature

​
Embedding Forms

​
Script Embed

<div id="gately-form"></div>
<script>
  Gately.embedForm('form_id', {
    container: '#gately-form',
    onSubmit: (data) => {
      console.log('Form submitted:', data)
    },
    onError: (error) => {
      console.error('Form error:', error)
    }
  })
</script>

​
React Component

import { FormEmbed } from '@gately/sdk'

function ContactPage() {
  return (
    <FormEmbed 
      formId="form_id"
      onSubmit={(data) => console.log(data)}
      onError={(error) => console.error(error)}
    />
  )
}

​
iFrame Embed

<iframe 
  src="https://forms.usegately.com/f/form_id"
  width="100%"
  height="600"
  frameborder="0"
></iframe>

​
Form Settings

​
General Settings

SettingDescription
TitleForm title (displayed to users)
DescriptionForm description/instructions
Submit Button TextCustom submit button label
Success MessageMessage shown after submission
Redirect URLURL to redirect after submission

​
Notifications

Configure email notifications for new submissions:
  • Send to form owner
  • Send to custom email addresses
  • Send confirmation to submitter

​
Styling

Customize form appearance: 
Gately.embedForm('form_id', {
  container: '#form',
  styles: {
    fontFamily: 'Inter, sans-serif',
    primaryColor: '#F97316',
    borderRadius: '8px',
    backgroundColor: '#ffffff'
  }
})

​
Submissions

​
Viewing Submissions

  1. Go to Forms > [Your Form] > Submissions
  2. View all submissions in a table
  3. Click to view individual submission details
  4. Export to CSV or JSON

​
API Access

# List submissions
curl -X GET "https://api.usegately.com/api/v1/forms/{form_id}/submissions" \
  -H "Authorization: Bearer YOUR_API_KEY" \
  -H "X-Project-ID: your-project-id"

# Get single submission
curl -X GET "https://api.usegately.com/api/v1/forms/{form_id}/submissions/{submission_id}" \
  -H "Authorization: Bearer YOUR_API_KEY" \
  -H "X-Project-ID: your-project-id"

​
SDK Submission

const response = await gately.submitForm('form_id', {
  name: 'John Doe',
  email: 'john@example.com',
  message: 'Hello!'
})

console.log('Submission ID:', response.submission_id)

​
File Uploads

​
Configuration

Enable file uploads in form settings:
SettingDescription
Allowed TypesFile extensions (e.g., jpg, pdf)
Max SizeMaximum file size in MB
Max FilesMaximum number of files

​
Handling Uploads

// Files are automatically uploaded and URLs returned
const response = await gately.submitForm('form_id', {
  name: 'John Doe',
  resume: fileInput.files[0] // File object
})

console.log('File URL:', response.files.resume)

​
Payment Forms

Collect payments with Stripe integration:

​
Setup

  1. Connect your Stripe account in Settings > Integrations
  2. Add a Payment field to your form
  3. Configure amount (fixed or variable)
  4. Publish the form

​
Payment Field Options

OptionDescription
Fixed AmountSet a specific price
Variable AmountLet users enter amount
CurrencyUSD, EUR, GBP, etc.
DescriptionPayment description

​
Handling Payments

Gately.embedForm('form_id', {
  container: '#form',
  onPaymentSuccess: (payment) => {
    console.log('Payment successful:', payment.id)
  },
  onPaymentError: (error) => {
    console.error('Payment failed:', error)
  }
})

​
Conditional Logic

Show or hide fields based on other responses: 
{
  "field": "company_size",
  "conditions": [
    {
      "field": "is_business",
      "operator": "equals",
      "value": true
    }
  ]
}

​
Operators

OperatorDescription
equalsExact match
not_equalsNot equal
containsContains substring
greater_thanNumeric comparison
less_thanNumeric comparison
is_emptyField is empty
is_not_emptyField has value

​
Webhooks

Trigger webhooks on form submissions:
  1. Go to Forms > [Your Form] > Webhooks
  2. Add webhook URL
  3. Select events to trigger
  4. Configure headers (optional)
{
  "event": "form.submitted",
  "form_id": "form_123",
  "submission_id": "sub_456",
  "data": {
    "name": "John Doe",
    "email": "john@example.com"
  },
  "submitted_at": "2024-01-15T10:00:00Z"
}

​
Integrations

Connect forms to external services:
  • Zapier: Automate workflows
  • Google Sheets: Sync submissions
  • Slack: Get notifications
  • Mailchimp: Add to email lists
  • Webhooks: Custom integrations