Documentation menu

Embed guide

Publish schematic and collection experiences in a storefront with no-code configuration for users and precise iframe contracts for developers.

Overview

Embeds expose public schematic and collection experiences through the sales frontend. Users configure visibility, collections, and theme assignments in the dashboard. Developers place the iframe, handle sizing, and optionally react to cart or quote events.

No-code setup

Use the dashboard to prepare the customer-facing experience before handing the embed to a developer.

Make the schematic public before using it in a customer-facing embed.
Create a collection when customers need to browse several related schematics.
Assign an embed theme to the schematic, collection, or company default.
Test add-to-cart or quote behavior before handing the snippet to a storefront developer.

Iframe implementation

Use the public embed route for the iframe. Collection embeds now carry the locale and active schematic in the path so the first render can bootstrap the selected schematic directly.

html

<iframe
  src="https://app.partgrid.ai/embed/en/collection/COLLECTION_UUID/schematic/SCHEMATIC_UUID?currency=USD"
  title="PartGrid parts catalog"
  style="width: 100%; min-height: 720px; border: 0;"
  loading="lazy"
></iframe>

Deep links

Public collection embeds select the current schematic through the route path. Query parameters are reserved for market settings and optional focused selections.

Name: /embed/{locale}/collection/{collection_uuid}/schematic/{schematic_uuid}
Type: path
Description: Canonical collection embed route for a selected schematic.

Name: currency
Type: string
Description: Currency code used for price enrichment and cart payloads, for example USD, EUR, JPY, or VND.

Name: schematicHotspot
Type: uuid
Description: Optional canonical selected schematic-number UUID.

Name: schematicPart
Type: uuid
Description: Optional selected part UUID when a part-level selection is available.

Name: schematicPartNumber
Type: string
Description: Readable fallback accepted by embeds before rewriting to stable UUID params.

Name	Type	Description
/embed/{locale}/collection/{collection_uuid}/schematic/{schematic_uuid}	path	Canonical collection embed route for a selected schematic.
currency	string	Currency code used for price enrichment and cart payloads, for example USD, EUR, JPY, or VND.
schematicHotspot	uuid	Optional canonical selected schematic-number UUID.
schematicPart	uuid	Optional selected part UUID when a part-level selection is available.
schematicPartNumber	string	Readable fallback accepted by embeds before rewriting to stable UUID params.

Theme runtime

Public and preview customization responses include theme tokens and an embed runtime. The preferred React contract is the embed_runtime.cssVariables map, which applies canonical --pf-* variables across panels, controls, hotspots, part cards, and quote/cart surfaces. Use the dedicated embed theming guide when you need assignment rules, automatic styling behavior, or runtime testing.