Skip to content

Embed Icon Visualizer

Add the mount element followed by the Icon-hosted embed script. Replace CONFIGURATOR_KEY with the key assigned to the account.

html
<div id="icf_page"></div>
<script src="https://iconfigurators.app/src/embed.cfm?ky=CONFIGURATOR_KEY"></script>

The embed script loads the configured Icon Visualizer experience into #icf_page.

Script placement

Place the snippet where the configurator should appear. If a plugin must register before startup, load that plugin before embed.cfm:

html
<script src="https://YOUR_DOMAIN/assets/dealer-experience.plugin.js"></script>
<div id="icf_page"></div>
<script src="https://iconfigurators.app/src/embed.cfm?ky=CONFIGURATOR_KEY"></script>

Do not mark a required preboot plugin script as async. An asynchronous script can finish after the visualizer has already passed its startup hooks.

Page requirements

  • Include only one Icon Visualizer instance on a page.
  • Use the standard icf_page mount ID with the hosted embed.
  • Load host configuration and preboot plugins before embed.cfm.
  • Use HTTPS for plugin and media assets.
  • Do not place credentials or private data in browser configuration.

Next step

Configure built-ins or diagnostics through host configuration, then wait for readiness before calling host APIs.

Icon Visualizer developer documentation