Implementing PieceMaker 2 in Blogger

Piecemaker V2 is an open source Flash ActionScript 3 image rotator.It‘s free for nearly any use - including commercial.

Its the perfect way to dynamically display your images, videos and .swf files on any post or page.The Piecemaker is a Flash-based 3D Image Rotator.


Steps to Add it to Blogger:

1.Login to the Blogger account.

2.Go to the Post/Page you want to add Piecemaker 2 and then go to Edit HTML tab .

3.Now copy the code from below and paste it there.

<script src="" type="text/javascript">
<div id="flashcontent">
You need to <a href="" target="_blank">Upgrade your Flash Player</a> to version 10 or newer.</div>

<script type="text/javascript">
var flashvars = {};
flashvars.xmlSource = "";
flashvars.cssSource = "";
flashvars.imageSource = "";
var attributes = {};
attributes.wmode = "transparent";
var params = {};
params.allowscriptaccess = "always";
params.allownetworking = "all";
swfobject.embedSWF("", "flashcontent", "960", "610", "10", "", flashvars, attributes, params, null);

4.Now for adding anything into Piecemaker 2 you have to edit the XML file included at the top ,which contains code of this kind

<Image Source="" Title="Sky"/>
<Image Source="" Title="Cloud">
<Image Source="" Title="Clouds"/>
<Image Source="" Title="Green"/>
<Image Source="" Title="Landscape"/>
<Image Source="" Title="Water"/>
<Video Source="" Title="Video Example" Width="910" Height="365" Autoplay="true">
<Image Source="" />
<Flash Source="" Title="Loaded SWF File">
<Image Source="" />
<Settings ImageWidth="900" ImageHeight="360" LoaderColor="0x333333" InnerSideColor="0x222222" SideShadowAlpha="0.8" DropShadowAlpha="0.7" DropShadowDistance="25" DropShadowScale="0.95" DropShadowBlurX="40" DropShadowBlurY="4" MenuDistanceX="20" MenuDistanceY="50" MenuColor1="0x999999" MenuColor2="0x333333" MenuColor3="0xFFFFFF" ControlSize="100" ControlDistance="20" ControlColor1="0x222222" ControlColor2="0xFFFFFF" ControlAlpha="0.8" ControlAlphaOver="0.95" ControlsX="450" ControlsY="280 " ControlsAlign="center" TooltipHeight="30" TooltipColor="0x222222" TooltipTextY="5" TooltipTextStyle="P-Italic" TooltipTextColor="0xFFFFFF" TooltipMarginLeft="5" TooltipMarginRight="7" TooltipTextSharpness="50" TooltipTextThickness="-100" InfoWidth="400" InfoBackground="0xFFFFFF" InfoBackgroundAlpha="0.95" InfoMargin="15" InfoSharpness="0" InfoThickness="0" Autoplay="10" FieldOfView="45"/>
<Transition Pieces="9" Time="1.2" Transition="easeInOutBack" Delay="0.1" DepthOffset="300" CubeDistance="30"/>
<Transition Pieces="15" Time="3" Transition="easeInOutElastic" Delay="0.03" DepthOffset="200" CubeDistance="10"/>
<Transition Pieces="5" Time="1.3" Transition="easeInOutCubic" Delay="0.1" DepthOffset="500" CubeDistance="50"/>
<Transition Pieces="9" Time="1.25" Transition="easeInOutBack" Delay="0.1" DepthOffset="900" CubeDistance="5"/>
<Transition Pieces="20" Time="1.1" Transition="easeInOutElastic" Delay="0.03" DepthOffset="200" CubeDistance="10"/>
<Transition Pieces="12" Time="2" Transition="easeInOutCubic" Delay="0.03" DepthOffset="200" CubeDistance="10"/>

All these codes are of self explanatory nature and really easily to understand  

5.Now save the Post/Page and see the magic.

Note: Please Host all the files on free hosting service like DropBox  or Blogpsot itself !



Post a Comment

© 2009 Blogger Tips 2013 | Powered by Blogger