Waves: How To Embed Into Your Website


A Live Waves Embed

Introduction


*iframe embeds are only available on the Pro tier
Publishing a Waves visualization to your website or blog is super easy and requires almost no coding effort. Any bucket that you own has the option to be shared by embed. When enabled, a simple iframe embed HTML element is generated that you can copy and paste into your website or blog. This allows you to wrap whatever design, branding, or tools you want around your real-time Waves visualization. As data is streamed into your dashboard, every viewer will see it update in real-time just as you do when you are inside of your Initial State account. 

Step 1: Share by Embed


To generate an iframe element, click on the "settings" link for the desired bucket in the bucket shelf, go to the Sharing tab, check the "Share by Embed" checkbox, and copy the iframe element text.  

Step 2: Embed into your Website 


Once you have enabled embed sharing, your Waves visualization is ready to go live on your website. Simply paste the iframe HTML element into your website or blog, replace the word tiles with waves in the iframe text, set the width and height, and your visualization is live to the world. It is that easy.  

Example embed code (used at the top of this support article):
<iframe src="https://www.initialstate.com/embed/#/waves/evDSAVgZafivA32zckpdCCfxOwhJOWSl" width=800 height=600></iframe>

Notice that waves is specified in the code above (.../#/waves/...).

Feedback and Knowledge Base