Skip to main content
A Connector maps facts Filecheck derives about a file (page count, dimensions, area) onto your product page’s own controls (quantity, width, height, size). The merchant authors it in the admin (Library → Connectors); you pass it to the Element, which writes the values into the DOM on every status update. No host wiring is required. Typical uses: set quantity from page count (a multi-page PDF means N prints), or fill width/height inputs from artwork dimensions (canvas, banner, sticker), with unit conversion.

​
Apply a connector

Pass the config inline. The Element resolves each binding and writes it to the first matching control, dispatching input and change so your framework reacts: 
const intake = fc.elements.create('intake', {
  workflowId: 'wf_…',
  connector: {
    title: 'Canvas size sync',
    bindings: [
      { source: 'pageCount', control: 'quantity' },
      { source: 'width',  control: 'width',  convertTo: 'cm', decimals: 1 },
      { source: 'height', control: 'height', convertTo: 'cm', decimals: 1 },
      { source: 'area',   control: 'area',   convertTo: 'cm', round: 'ceil' },
    ],
  },
});
At runtime: 
intake.setConnector(connectorConfig); // re-applies against the last facts
intake.applyNow();                     // force a re-apply, e.g. after a DOM swap

​
Binding shape

​
source
'pageCount' | 'fileCount' | 'width' | 'height' | 'area'
required
​
control
'quantity' | 'width' | 'height' | 'area'
Auto-fills the built-in preset selectors for common Shopify / WooCommerce / PrestaShop / Magento themes.
​
customSelector
string
A CSS selector tried first, for theme-specific markup.
​
convertFrom / convertTo
'mm' | 'cm' | 'in' | 'pt' | number
Dimensional sources are millimetres. For area, the factor is squared automatically.
​
decimals
number
​
round
'round' | 'floor' | 'ceil'
Plugin authors usually don’t build bindings by hand. The connector arrives as JSON from your backend (fetched from Filecheck); pass it straight through as the connector option, or resolve it server-side with connectorId.
When a theme uses non-standard markup, the merchant adds a customSelector in the admin. The plugin stays theme-agnostic.