Airtable

Introduction

The Orshot Airtable integration uses Airtable's Scripting extension to generate dynamic images directly from your table data. This integration allows you to create images using your existing Airtable records as data sources, perfect for automating image generation based on database content.

Video Tutorial

Actions Available

• Direct Image Generation: Generate images from Airtable records using Studio templates
• Table Data Integration: Use column values as template modifications
• Attachment Storage: Store generated images directly in Airtable attachment fields
• Batch Processing: Generate multiple images from multiple records
• Custom Scripting: Full JavaScript control over image generation logic
• Template Selection: Choose from available Studio templates within the script

How to Use

1. Create Table Structure

1. Create two columns in your Airtable table:
   • Orshot Image (Type: Attachment) - This stores the generated image
   • Orshot Generate (Type: Button) - This triggers image generation

2. Install Scripting Extension

1. Click on the "Extensions" tab in your Airtable base
2. Search for "Scripting" and install the extension
3. Once enabled, you'll see a scripting interface

3. Add the Script

1. Copy the provided script code (see below)
2. Paste it into the Scripting extension
3. Update the <TABLE_NAME> with your actual table name
4. Update the <OUTPUT_COLUMN_NAME> with "Orshot Image"
5. Replace os-sjPyrek4eygmq with your actual Orshot API key

4. Configure Template and Modifications

1. Set the templateId to your desired Studio template ID (e.g., 25)
2. Customize the modifications object to map your table columns:

   "canvasBackgroundColor": record.getCellValue('canvasBackgroundColor'),
   "main-headline": record.getCellValue('main-headline'),
   "sub-headline": record.getCellValue('sub-headline'),
   "app-screenshot": record.getCellValue('app-screenshot'),
   "cta-text": record.getCellValue('cta-text')

5. Generate Images

1. Save the script in the Scripting extension
2. Click the "Orshot Generate" button in any table row
3. The script will run and generate an image based on that record's data
4. The generated image will be stored in the "Orshot Image" column

Sample Script Code

const table = base.getTable("<TABLE_NAME>");
const record = await input.recordAsync("Pick a record", table);
const requestData = {
  templateId: 25,
  modifications: {
    canvasBackgroundColor: record.getCellValue("canvasBackgroundColor"),
    "main-headline": record.getCellValue("main-headline"),
    "sub-headline": record.getCellValue("sub-headline"),
    "app-screenshot": record.getCellValue("app-screenshot"),
    "cta-text": record.getCellValue("cta-text"),
  },
  response: {
    type: "url",
    format: "png",
    scale: 1,
  },
};
 
const response = await fetch("https://api.orshot.com/v1/studio/render", {
  method: "POST",
  body: JSON.stringify(requestData),
  headers: {
    "Content-Type": "application/json",
    Authorization: "Bearer <YOUR_API_KEY>",
  },
});
 
const responseData = await response.json();
await table.updateRecordAsync(record.id, {
  "<OUTPUT_COLUMN_NAME>": [{ url: responseData.data.content }],
});

Need Help?

• Contact support at hi@orshot.com or use chat button in your Orshot dashboard for assistance