How to Integrate Retool with Printful

First, generate your Printful API token. Log into your Printful dashboard and navigate to Settings → Stores, then select the store you want to connect. Look for the API section and click Generate Token. Alternatively, for an account-level token that covers all stores, go to your Printful account Settings → API. Copy the generated API token — it's a long alphanumeric string. Keep this secure; it grants full API access to your Printful account. Now go to the Resources tab in your Retool instance and click Add Resource. Select REST API from the resource type list. Name the resource 'Printful API'. In the Base URL field, enter https://api.printful.com. This is Printful's API v1 base URL — all endpoint paths will be appended to this. For authentication, Printful uses Bearer token authentication. In the Authentication section, select Bearer Token from the dropdown and enter your Printful API token in the Token field. For better security, store your token as a Retool configuration variable first: navigate to Settings → Configuration Variables, create a variable named PRINTFUL_API_TOKEN marked as Secret, then use {{ retoolContext.configVars.PRINTFUL_API_TOKEN }} in the Bearer Token field. Click Save Changes to create the resource.

Create your first query to fetch orders from Printful. In your app's Code panel, click + to add a new query. Name it getOrders and select the Printful API resource. Set Method to GET. In the Path field, enter /orders. Add URL parameters to filter the results: - key = status, value = {{ dropdown_status.value || '' }} (filter by order status) - key = limit, value = 100 - key = offset, value = {{ (pagination.page - 1) * 100 || 0 }} - key = store_id, value = {{ dropdown_store.value || '' }} (if you have multiple stores) Printful order statuses include: draft, failed, pending, canceled, inprocess, onhold, partial, fulfilled. Create a second query named getOrderById that fetches full details for a selected order. Set Method to GET, Path to /orders/{{ table_orders.selectedRow.id }}. Run this on table row selection (set it to trigger from table_orders' row click event). Create a third query named getStores (GET, /stores) to populate a store filter dropdown. Run this on page load. Bind the result to a Dropdown component so operations staff can filter by specific connected storefront. For tracking information, Printful includes shipment data nested inside the order object. The order detail response includes a shipments array with carrier, tracking_number, and tracking_url fields.

1// JavaScript transformer — flatten Printful orders for Table display
2const orders = data.result || [];
3return orders.map(order => ({
4  id: order.id,
5  external_id: order.external_id || 'N/A',
6  status: order.status,
7  status_label: {
8    draft: 'Draft',
9    pending: 'Pending',
10    inprocess: 'In Production',
11    onhold: 'On Hold',
12    partial: 'Partially Shipped',
13    fulfilled: 'Fulfilled',
14    canceled: 'Canceled',
15    failed: 'Failed'
16  }[order.status] || order.status,
17  recipient: order.recipient
18    ? `${order.recipient.name || 'N/A'} (${order.recipient.country_code || ''})`
19    : 'N/A',
20  item_count: Array.isArray(order.items) ? order.items.length : 0,
21  created: order.created
22    ? new Date(order.created * 1000).toLocaleDateString('en-US', {
23        year: 'numeric', month: 'short', day: 'numeric'
24      })
25    : 'N/A',
26  retail_costs: order.retail_costs
27    ? `$${parseFloat(order.retail_costs.total || 0).toFixed(2)}`
28    : 'N/A',
29  tracking: order.shipments?.[0]?.tracking_number || 'Not shipped'
30}));

When operations staff click an order in the main table, they should see full item details — which products, quantities, print files, and shipping tracking. Build this detail view using the getOrderById query. Configure getOrderById to run whenever table_orders.selectedRow changes. In the Code panel, find getOrderById and set it to trigger on the selectedRow change event, or use Run on event handler from the table's row selection setting. Bind the item details to a second Table component named table_items. Set its Data property to {{ getOrderById.data.result.items }}. Configure columns to show name, quantity, retail_price, and status. For shipping tracking, add a Link component that opens the tracking URL in a new tab: use {{ getOrderById.data.result.shipments?.[0]?.tracking_url }} as the href value. Add a TextInput next to it showing the tracking number: {{ getOrderById.data.result.shipments?.[0]?.tracking_number }}. Add stat card components at the top of the detail panel showing: production status, number of items, retail total, and fulfillment date (if available). Use Retool's Stat component or custom Container + Text components for these. Create a query named cancelOrder (DELETE, /orders/{{ table_orders.selectedRow.id }}) and add a Cancel Order button with a confirmation modal. Only show this button when order status is 'draft' or 'pending' — use component visibility conditions to hide it for in-production or fulfilled orders. For complex POD operations integrations spanning multiple platforms, RapidDev's team can help build a unified fulfillment panel that combines Printful data with Shopify, Etsy, and WooCommerce order data.

1// JavaScript transformer — format order items for detail table
2const order = data.result || {};
3const items = order.items || [];
4return items.map(item => ({
5  name: item.name || item.variant_name || 'Unknown Product',
6  quantity: item.quantity || 1,
7  sku: item.sku || 'N/A',
8  retail_price: item.retail_price
9    ? `$${parseFloat(item.retail_price).toFixed(2)}`
10    : 'N/A',
11  status: item.status || 'pending',
12  product_id: item.product?.product_id || 'N/A',
13  variant_id: item.product?.variant_id || 'N/A',
14  files: Array.isArray(item.files)
15    ? item.files.map(f => f.type).join(', ')
16    : 'None'
17}));

Create a shipping cost estimation tool so customer service staff can quickly answer shipping questions. This requires a POST request to Printful's shipping rates endpoint. Add form components to your app: a TextInput for recipient country code (e.g., 'US'), a TextInput for postal code, a Select for state/region (for US orders), and a product variant selector populated from your sync products. Create a query named estimateShipping. Set Method to POST. Path = /shipping/rates. Set Body type to JSON. The request body must include a recipient address object and items array: The items array needs the sync_variant_id for each product and the quantity. Populate the product selector from a getProducts query (GET, /sync/products) that runs on page load. After running estimateShipping, the response includes a result array of shipping options. Each option has a name (carrier/service), rate (cost in USD), minDeliveryDays, and maxDeliveryDays. Bind these to a Table component showing all available options sorted by rate. Add a 'Copy Rate' button column that copies the selected rate to the clipboard — useful for customer service staff quoting shipping costs over email or chat.

1{
2  "recipient": {
3    "country_code": "{{ textInput_country.value }}",
4    "state_code": "{{ textInput_state.value || '' }}",
5    "zip": "{{ textInput_zip.value }}",
6    "city": "{{ textInput_city.value || '' }}"
7  },
8  "items": [
9    {
10      "quantity": {{ numberInput_qty.value || 1 }},
11      "variant_id": {{ select_variant.value }}
12    }
13  ],
14  "currency": "USD",
15  "locale": "en_US"
16}

Build a product catalog monitoring panel that shows all synced products across your connected stores and flags any with configuration issues — missing print files, unlinked variants, or pricing gaps. Create a query named getSyncProducts (GET, /sync/products) with URL parameter limit = 100. This returns all synchronized products from your connected storefronts. Create a follow-up query named getSyncProductDetail (GET, /sync/products/{{ table_products.selectedRow.id }}) that loads full variant details when a product row is clicked. Create a JavaScript transformer that analyzes each product's sync health: Bind the health analysis to the products table with color-coded indicators: green checkmark for healthy products, yellow warning for incomplete configurations, red alert for broken sync. Add a summary banner showing total products, healthy count, and products needing attention. Use a Retool Stats component or custom container to display these at the top of the catalog panel. For products needing attention, add an action button that links directly to Printful's product editor using the external_id: {{ 'https://www.printful.com/dashboard/products/' + table_products.selectedRow.id }}. This gives operations staff a one-click path to fix configuration issues without manually searching in Printful's dashboard.

1// JavaScript transformer — catalog health analysis
2const products = data.result || [];
3return products.map(product => {
4  const variants = product.sync_variants || [];
5  const unlinkedVariants = variants.filter(v => !v.synced).length;
6  const missingFiles = variants.filter(v =>
7    !v.files || v.files.length === 0
8  ).length;
9
10  let health = 'Healthy';
11  let health_code = 'good';
12  if (unlinkedVariants > 0 || missingFiles > 0) {
13    health = `${unlinkedVariants} unlinked, ${missingFiles} missing files`;
14    health_code = 'warning';
15  }
16  if (variants.length === 0) {
17    health = 'No variants';
18    health_code = 'error';
19  }
20
21  return {
22    id: product.id,
23    external_id: product.external_id,
24    name: product.name || 'Unnamed',
25    store_id: product.store_id,
26    variant_count: variants.length,
27    synced_variants: variants.filter(v => v.synced).length,
28    health,
29    health_code,
30    thumbnail_url: product.thumbnail_url || ''
31  };
32});