HTML code to load Unity content
Manual     Reference     Scripting   
Unity Manual > Web Player Deployment > HTML code to load Unity content

HTML code to load Unity content

Desktop

Unity content is loaded in the browser by the Unity Web Player plugin. HTML code usually does not communicate with this plugin directly but through the help of a script called UnityObject. Its primary task is to make Unity content embedding a very simple task by shielding the user from various browser and platform specific issues. It also enables easy Web Player installation.

The HTML file generated by Unity when building a web player contains all the commonly required functionality. In most cases you don't have to modify the HTML file at all. The rest of the document explains the inner workings of this file.

The UnityObject script has to be loaded before it can be used. This is done at the top of the <head> section.

<script type="text/javascript">
<!--
var unityObjectUrl = "http://webplayer.unity3d.com/download_webplayer-3.x/3.0/uo/UnityObject.js";
if (document.location.protocol == 'https:')
	unityObjectUrl.replace("http://", "https://ssl-");
document.write('<script type="text/javascript" src="' + unityObjectUrl + '"></script>');
-->
</script>

The global unityObject variable can now be used to perform various Unity related tasks. The most important one is to embed Unity content. This is performed by invoking the embedUnity method that accepts several parameters. The first one specifies the id of the HTML element that will be replaced by Unity content. It could be any HTML element with <div> being the most common. Think of it as a temporary placeholder where Unity should be placed. The second parameter specifies the path to the web player data file to be displayed. The next two parameters specify the width and height of the display for the web player content. The values provided can be pixel values (e.g. 600, "450") or percentage values (e.g. "50%", "100%").

unityObject.embedUnity("unityPlayer", "WebPlayer.unity3d", 600, 450);

Finally, the HTML placeholder is placed inside the <body> section. It could be as simple as <div id="unityPlayer" />. However for maximum compatibility it's best to place some warning message in case the browser doesn't support JavaScript and the placeholder isn't replaced by UnityObject.

<div id="unityPlayer">
	<div class="missing">
		<a href="http://unity3d.com/webplayer/" title="Unity Web Player. Install now!">
			<img alt="Unity Web Player. Install now!" src="http://webplayer.unity3d.com/installation/getunity.png" width="193" height="63" />
		</a>
	</div>
</div>

Page last updated: 2012-02-27