Scenes can be embedded into a page without any javascript by using the Data Api.
By adding data attributes to your html elements, the embedding javascript will initialize the player. Simply add the “clara” class to the element, and add the id of the scene with data-clara.
This still requires that you specify the Lightning JS code snippet in your web page tough.
<div class="clara" data-clara="{uuid}" style="height: 400px; background: #fff;" ></div>It is best if you give the div an explicit height, although it is not required. The default background color of the scene can be set by applying a ‘background-color’ css property to the element.
Some options control the setup of the player.
data-header (Boolean), default: true
Shows the header inside the player
data-loading-img (String), default: null
An href to an image to display while the player is loading. Explicitly set to an empty string to disable loading an image. If not set, the latest thumbnail image of the scene is displayed.
data-timeline (Boolean), default: true
Shows the timeline (will not display if there is no animation)
data-tools (Boolean), default: true
Display the navigation tools
A full example:
<div class="clara" data-clara="{uuid}" data-header="false" data-loading-img="/img/splash.jpg"></div>