Configure built-in plugins

Built-in plugins are reviewed with the visualizer and enabled through plugin descriptors. Account settings are preferred when behavior should follow a configurator key everywhere. A host page can append descriptors through window.IconMediaConfig.plugins.

<script>
  window.IconMediaConfig = {
    plugins: [
      {
        id: 'analytics',
        enabled: true,
        required: false,
        order: 20,
        options: {
          dataLayerName: 'YOUR_DATA_LAYER',
        },
      },
    ],
  }
</script>

Available built-ins

ID	Purpose
analytics	Push selected visualizer events to a browser data layer.
dealer-cart	Add a cart link or host-owned cart event to the page header.
promotions	Add a promotion banner after the landing shopping actions.
landing-sections	Render configured carousel or grid content on the landing page.
marketing-campaigns	Register structured, event-triggered campaign modals.

Analytics

{
  id: 'analytics',
  enabled: true,
  options: {
    dataLayerName: 'YOUR_DATA_LAYER',
  },
}

The default data-layer name is dataLayer. The plugin pushes ready, route-change, wheel-viewed, and RFQ-submitted events with an iconVisualizer payload.

Dealer cart

Use a direct link:

{
  id: 'dealer-cart',
  enabled: true,
  options: {
    label: 'Cart',
    href: '/cart',
  },
}

If href is omitted, clicking the action dispatches iconfigurator.cart-click on document:

document.addEventListener('iconfigurator.cart-click', () => {
  window.dispatchEvent(new CustomEvent('YOUR_CART_OPEN_EVENT'))
})

Promotions

{
  id: 'promotions',
  enabled: true,
  options: {
    message: 'Ask about this month’s wheel and tire packages.',
    href: '/promotions',
  },
}

The plugin does nothing when message is empty. Omit href for a noninteractive banner.

Landing sections

Use this built-in for customer-configurable cards without arbitrary HTML, CSS, or JavaScript:

{
  id: 'landing-sections',
  enabled: true,
  options: {
    sections: [
      {
        id: 'dealer-builds',
        placement: 'between-featured-brands-and-new-arrivals',
        order: 10,
        title: 'Dealer builds',
        layout: 'carousel',
        items: [
          {
            id: 'featured-build',
            eyebrow: 'Featured vehicle',
            title: 'See this wheel package',
            description: 'Open a preselected visualizer configuration.',
            media: {
              type: 'image',
              src: 'https://YOUR_DOMAIN/images/featured-build.jpg',
              alt: 'Featured vehicle with aftermarket wheels',
            },
            action: {
              label: 'View build',
              command: 'openVisualizer',
              query: {
                fmk: 'VEHICLE_FMK',
                bodyType: 'BODY_TYPE_ID',
                sizeCategory: 'OE',
                wheel: 'WHEEL_IMAGE_ID',
              },
            },
          },
        ],
      },
    ],
  },
}

Placements are before-featured-brands, between-featured-brands-and-new-arrivals, and after-new-arrivals. Layouts are carousel and grid.

Marketing campaigns

{
  id: 'marketing-campaigns',
  enabled: true,
  options: {
    campaigns: [
      {
        id: 'package-offer',
        trigger: 'wheel:viewed',
        priority: 20,
        frequency: {
          oncePerSession: true,
        },
        creative: {
          layout: 'compact',
          eyebrow: 'Package offer',
          title: 'Complete the look',
          body: 'Ask about a mounted wheel and tire package.',
          actions: [
            {
              label: 'Shop by vehicle',
              command: 'openSearchByVehicle',
            },
            {
              label: 'Keep browsing',
              command: 'dismiss',
              variant: 'secondary',
            },
          ],
        },
      },
    ],
  },
}

Campaigns are structured prompts. The app owns their modal shell, focus behavior, frequency checks, and cleanup.