---

Embedding(Old)

Check out our NEW API DOCUMENT for Clara.io embedding.

You can embed the Clara.io page into a webpage through two methods, this page describes the standard iframe embed method. If you want to create interactive webpages uses Clara.io, please refer to the Interactive Experiences documentation page.

This is the simple way to embed a scene. Simply go to File / Sharing / Get Embed Code and copy the code from the “Embed WebGL” field. You can change the height and width of the iframe to suit. The embedded scene will be allowed to go full screen if the iframe attribute allowfullscreen is set.

Available options:

• renderer={webgl|thumbnail} Choose what version of the scene you wish to embed
• timeline={true|false} Display the timeline if there is animation in the scene
• autoplay={true|false} Automatically start any animation playing
• tools={true|false} Display the navigation tools (pan, zoom, rotate, home)
• header={true|false} Display the header bar with scene title, full screen button and edit button
• hideLogo={false|true} Display the Clara.io logo in the bottom right corner (requires a Professional membership to disable)
• bgColor={String} A hex color for the scene background, eg: ‘0xff0000’

Example:

<iframe src="https://clara.io/embed/c67b5288-7325-4a2f-a7aa-c1e8d74ebe44?renderer=webgl&timeline=true&autoplay=false&bgColor=0xffffff&tools=false" width="400" height="300" allowfullscreen></iframe>

####Sharing
The Embedding function can also be achieved through the Scene Sharing process.
For information about Sharing, refer to our Sharing documentation.

---