Config Fields

Most scripts have values that ought to change per install: a Facebook Pixel ID, a logo URL, a brand color, a CSS selector for the element to modify. Before config fields, authors hardcoded these — which meant every install needed a code edit.

Config fields are typed slots declared on the script. Installers fill them in on the Config tab. The loader inlines the values at bundle time so your script reads them as plain JavaScript literals (no runtime lookup required).

Open a script in the editor, click the Config tab, and add fields. Each field needs a key (machine-readable, camelCase) and a label(human-readable). Then pick a type.

Seven field types cover ~95% of real-world scripts:

• Text — single-line string. Pixel IDs, URLs, class names.
• Long text — multi-line string. HTML snippets, long copy.
• Number — integer or decimal, with optional min/max.
• Toggle — on/off boolean.
• Color — hex picker + free-text input. #818cf8 style.
• Image URL — URL input with a live preview. Drag-drop uploads land in Vercel Blob.
• Dropdown — pick one of N options you define.

Two ways. Pick whichever reads cleaner for your code:

1. Inline templates (recommended)

Write {{config.KEY}} directly in your script body. The loader replaces each placeholder with the matching value at bundle time — your shipped code contains literal values, not lookups.

// Script body
(function () {
  const logoUrl = {{config.logoUrl}};   // → "https://..."
  const width   = {{config.width}};      // → 120
  const enabled = {{config.enabled}};    // → true
  if (!enabled) return;
  document.querySelector("img.logo").src = logoUrl;
})();

2. Runtime lookup

For cases where you need the full config object — iterating fields dynamically, etc. — every script also has an isolated namespace on window.veloxscriptConfig.scripts:

const cfg = window.veloxscriptConfig.scripts["<your-script-id>"];
console.log(cfg.logoUrl, cfg.width, cfg.enabled);

The Values section of the Config tab shows both snippets with your actual script ID filled in — copy-paste whichever fits.

Fields marked Requiredshow a red asterisk to the installer and won't save without a value. Number fields honor min/max. Select fields accept only values from the declared options list.

Set a Defaultto pre-fill sensible starting values — the installer can override, but doesn't have to. Great for toggles (default on) and colors (default brand color).

On image_url fields the installer has three options:

1. Paste a URL they already host elsewhere (GHL CDN, Imgur, etc.)
2. Click Upload to pick a file
3. Drag-and-drop an image onto the input

Uploads go to Vercel Blob under a workspace-scoped path and return a public URL. 5 MB cap, PNG / JPEG / GIF / WebP / SVG accepted.

The field schema (keys, labels, types) lives on the script. The valuesthe installer picks live on the same script row, so every workspace's install of a given marketplace script has its own independent values. Updating the schema doesn't wipe filled-in values — keys that still exist keep their values; keys removed from the schema get dropped.