Skip to main content

How to use Chameleon with iFrames

Understand how to build and deploy Chameleon Experiences that travel across iFrames.

Tiago Mota avatar
Written by Tiago Mota
Updated over 2 weeks ago

If your application contains iFrames, you might be concerned about whether you'll be able to deploy Chameleon Experiences across those. Don't worry, we've got you covered, Chameleon allows you to build Experiences on any iFrames you might have in your application. You will just need to implement Chameleon separately within your iFrames.

There are, however, some aspects you'll need to consider before going in and building your Experiences. You will need to:

  • Determine whether your iFrames share the same subdomain as the top-level page.

  • Ensure the iFrame does not use the sandbox attribute.


If your iFrames share the same subdomain as the top-level page, you'll need to:

You can do this in a similar fashion as what you did to install Chameleon in the first place, using whatever installation method you decided to go for.


If Chameleon is initialized in both the parent and iframe environments, and the same UID is used for identification, functionality should work seamlessly—even across different subdomains.


Once everything is set up, you can go in and build your Chameleon Experiences. You will notice that you're now able to select elements within those iFrames.

🤝 We recommend that you always live-test your Experiences, by publishing them only to yourself before publishing them live to end-users. Particularly with iFrames, this will allow you to identify any flaws that could've happened during the installation process.


Know more

Did this answer your question?