Embedding the interactive thumbnail in a website

How to embed the Calaméo self-hosted interactive thumbnail in a website or blog.

Basics

Here is the basic HTML code you can use to embed a Calaméo self-hosted interactive thumbnail (miniCalaméo) in your website or blog:

<object
	id="000283759e97fec0a876c1273588351"
	classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
	codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0"
	width="100%"
	height="100%">
		<param name="base" value="./" />
		<param name="movie" value="mini.swf" />
		<param name="quality" value="high" />
		<param name="allowScriptAccess" value="always" />
		<param name="allowFullScreen" value="true" />
		<embed
			type="application/x-shockwave-flash"
			base="./"
			src="mini.swf"
			flashvars=""
			id="viewer"
			name="viewer"
			quality="high"
			scale="noscale"
			loop="false"
			salign="t"
			allowscriptaccess="always"
			allowfullscreen="true"
			height="100%"
			width="100%" />
</object>
Parameter Type Description
<param name="base" value="..." /> string Path to the self-hosted publication folder where the data folder is located relative to the embedding HTML page.
base="..." string Path to the self-hosted publication folder where the data folder is located relative to the embedding HTML page.
<param name="movie" value="..." /> string Path to the self-hosted publication mini.swf file relative to the embedding HTML page including the flashvars.
src="..." string Path to the self-hosted publication mini.swf file relative to the embedding HTML page.

Variables (flashvars)

Use these variables as query string parameters (&var=value&foo=bar).

Parameter Type Description
clickToUrl string

URL to redirect the user.

clickTarget string Window target to use when the user click on the interactive thumbnail (default: _self).
page integer

First page to display (default: 1).

showArrows integer

Show or hide navigation arrows. Either 0 (hide) or 1 (show).

autoFlip integer

Number of seconds between automatic page flip (default: 0 = none).

Using SWFObject

We strongly encourage you to use the SWFObject script provided in utils.js to embed the Calaméo self-hosted interactive thumbnail to enforce maximum cross-browser compatibility. See the provided mini-example.htm source code for more information.

Information on SWFObject is available at http://code.google.com/p/swfobject/