Appearance
Wait for Icon Visualizer readiness
Icon Visualizer dispatches iconfigurator.ready on document after initialization and initial plugin lifecycle work are complete.
Register listeners before loading the embed script:
html
<script>
document.addEventListener('iconfigurator.ready', (event) => {
const api = event.detail
console.log('Icon Visualizer is ready', api.getSnapshot())
})
document.addEventListener('iconfigurator.failed', (event) => {
console.error('Icon Visualizer failed to start', event.detail.error)
})
</script>
<div id="icf_page"></div>
<script src="https://iconfigurators.app/src/embed.cfm?ky=CONFIGURATOR_KEY"></script>Await the global API
After window.iConfigurator exists, ready() resolves to the same host API carried by the ready event:
js
const api = await window.iConfigurator.ready()
console.log(api.status)ready() resolves only after successful startup. If the app fails, the promise rejects and iconfigurator.failed is dispatched.
Avoid polling
Do not poll indefinitely for window.iConfigurator. Code that can execute before the embed should listen for iconfigurator.ready. Code loaded after the global exists can call ready().
The product event app:ready is available inside plugins. Host pages use the document event or global promise shown above.