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="http://dl.dropbox.com/u/27675057/piecemaker2/piecemaker/web/scripts/swfobject/swfobject.js" type="text/javascript">
</script>
<div id="flashcontent">
You need to <a href="http://www.adobe.com/products/flashplayer/" target="_blank">Upgrade your Flash Player</a> to version 10 or newer.</div>
<script type="text/javascript">
var flashvars = {};
flashvars.xmlSource = "http://dl.dropbox.com/u/27675057/piecemaker.xml";
flashvars.cssSource = "http://dl.dropbox.com/u/27675057/piecemaker2/piecemaker/web/piecemaker.css";
flashvars.imageSource = "";
var attributes = {};
attributes.wmode = "transparent";
var params = {};
params.allowscriptaccess = "always";
params.allownetworking = "all";
swfobject.embedSWF("http://dl.dropbox.com/u/27675057/piecemaker2/piecemaker/web/piecemaker.swf", "flashcontent", "960", "610", "10", "http://dl.dropbox.com/u/27675057/Piecemaker/expressInstall.swf", flashvars, attributes, params, null);
</script>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
<Piecemaker>
<Contents>
<Image Source="http://dl.dropbox.com/u/27675057/pic/15.jpg" Title="Sky"/>
<Image Source="http://dl.dropbox.com/u/27675057/pic/21.jpg" Title="Cloud">
</Image>
<Image Source="http://dl.dropbox.com/u/27675057/pic/22.jpg" Title="Clouds"/>
<Image Source="http://dl.dropbox.com/u/27675057/pic/22_2.jpg" Title="Green"/>
<Image Source="http://dl.dropbox.com/u/27675057/pic/24.jpg" Title="Landscape"/>
<Image Source="http://dl.dropbox.com/u/27675057/pic/62.jpg" Title="Water"/>
<Video Source="http://dl.dropbox.com/u/13256471/piecemaker_2/contents/video.mp4" Title="Video Example" Width="910" Height="365" Autoplay="true">
<Image Source="http://dl.dropbox.com/u/13256471/piecemaker_2/contents/video-preview.jpg" />
</Video>
<Flash Source="http://dl.dropbox.com/u/27675057/piecemaker2/piecemaker/web/contents/flash.swf" Title="Loaded SWF File">
<Image Source="http://dl.dropbox.com/u/27675057/piecemaker2/piecemaker/web/contents/flash-preview.png" />
</Flash>
</Contents>
<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"/>
<Transitions>
<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"/>
</Transitions>
</Piecemaker>All these codes are of self explanatory nature and really easily to understand
5.Now save the Post/Page and see the magic.
Find me on
how i can change photos to piecemaker 1? i ll upload the photos to dropbox then what?
how i can connect them?
check my blog please
acropolisamiboutiquehotel.blogspot.com and tell me how to fix it, thank you for your time :D
Hi there, see when you upload anything to Dropbox make sure you copy it into Public folder .Now right click on the Photo and click on "Dropbox" and then Click on "Copy Public link" now just see the 4th step of this tutorial and change the address of the image with the one u just copied.
For a more Graphically solution visit this link
can i add piecemaker to facebook page?
@Abdul Khaliq
Yes ,but only to the Custom FBML tabs
How can i change the size of the slide show images?
I got It,
Thanks a lot for this post!
really great! :-)
Piecemaker is centeralign in html,
I want this piecemaker with no left and right margin!
please help me!
@Abdul Khaliq
Please can you give a demo link ,I can help you better then
@Prayag Verma
Thanks for your reply!
I don't have link yet,
piecemaker is centered, i want this with no left or right margin!
Thanks!
@Abdul Khaliq
Enclose the swf file (In line 1 ) in between a div and give it a inline style like this:
style="left:50% !important;"
I would be much easier for me to help you if you gave the link where you have implemented this plugin
what format videos it playes, does it play WMV Videos
@Have A Nice Day FriendI suppose it is supported
Hello,
1. step is ok. But i can't understand 2 step. Where should i paste second code after edit it?
Please help me. :(
Go to the Post or page you want to add the code to , Paste it in the Edit HTML tab of the Post Editor
If you want to add it below the header, then add a HTML/JavaScript Gadget in Layouts and paste the code into it
hi first of all!
i would like to ask you , how can i add a link on pictures?
This is how syntax for adding link to pictures looks like (referring to the XML file )
<Image Source="contents/piecemaker2.png" Title=Lots of new Features>
<Text>
<h1>Some headline</h1><p>This is some HTML formatted text</p>
</Text>
<Hyperlink URL="http://www.modularweb.net" Target="_blank"/>
</Image>
where do we have to paste the XML file?
In the Line 9 of Step 3 ,you will see the XML file address
If you are referring how to make a XML file , just copy all the contents of Step 4 and Paste into a Text file. Now in the File menu ,click the Save As option and in the Name field, name it followed by .xml
Hi Okamis
You can directly use the code in the steps , will fix the link too
Hello,
In Piecemaker, we have controls "play", "stop", "info" and "link" which appear on rollover. I want to change these text (to my native language).
After great efforts I found that these words are in "piecemaker.swf" file. I decompiled the swf and changed the color of the images (just to see whether it still works). But it didn't work.
So, how can I change these texts?
Thanks in advance.