How to integrate flShow Carousel into your Jimdo site

(Business and Pro only*)

Step 1: Get the Carousel

Go to http://www.flshow.net/carousel_download.php and download one of the provided templates. I started with the one named "Carousel on white/any color background".

 

Modify the xml file to put you images in it, set links, and some of the many options as you like.

To edit the xml file you must use a plain text editor (e.g., Notepad on Windows, TextEdit on Mac, vi on Linux).

Useful info on configuring Carousel can be found at:

http://www.flshow.net/dokuwiki/doku.php?id=carousel:home

Specifically, a list of all options is available at:

http://www.flshow.net/dokuwiki/doku.php?id=carousel:options

and details on who to include images and add links can be found here:

http://www.flshow.net/dokuwiki/doku.php?id=carousel:photos_and_links

Step 2: Upload your files

Now you have to upload on your site all images, the Carousel.swf file.

 

Create an hidden page and put all your images in it one by one. Right click (ctrl+click on Mac) on each to get its url (some browser has a "copy url" feature with others you have to look at image "properties" or something similar).

My 5 images have been given the following urls:

http://flshow.jimdo.com/s/cc_images/cache_2080549251.jpg

http://flshow.jimdo.com/s/cc_images/cache_2080558051.jpg

http://flshow.jimdo.com/s/cc_images/cache_2080565551.jpg

http://flshow.jimdo.com/s/cc_images/cache_2080569251.jpg

http://flshow.jimdo.com/s/cc_images/cache_2080572951.jpg

(Notice that i stripped down a part following the question mark).

 

If you cut and past any of these urls into your browser address bar you'll see the image file (and nothing else). Perform this check to be sure that you've got the right urls.

 

Notice that you may wish to control image size: use + and - buttons that Jimdo show right below the uploaded image.

 

Now upload the Carousel.swf file as "flashmovie". Notice that you have to enable flashmovie button in Settings > Tools > Additional Modules.

It shows errors (because the xml file is still missing). On the first red line it show its own url, copy it carefully. In my case it is:

http://flshow.jimdo.com/s/swf/2973934551.swf

(Alternatively you can find this url in the page source code - search for swf - inside a js code, pay attention to escaped /).

Again copy and paste this url in your browser bar to ensure it is correct.

Step 3: The xml file

Now edit your xml file to let it uses the url of your uploaded images.

Uupload this file in the hidden page using the "File download" Jimdo button. Right click on the lik to get the file url. Mine:

http://flshow.jimdo.com/app/download/3182951251/default.xml

 

Notice that you need Jimdo Business or Pro in order to obtain a static url to your xml file*.

 

You can take a look at my xml file if you want. In it you'll also find some example of links:

one to a page inside this Jimdo site, one to flshow.net, one to a Google query for my name in a new blank page, one to a javascript call, and the last one to my homepage.

Step 4: Place the Carousel

No go in the page where you want your Carousel to appear.

Add a "Widget/HTML" with the following text:

 

<div style="width: 600px; height: 300px; border: 1px solid #CCCCCC">

  <object width="100%" height="100%" type="application/x-shockwave-flash" data="http://flshow.jimdo.com/s/swf/2973934551.swf">

    <param name="movie" value="http://flshow.jimdo.com/s/swf/2973934551.swf" />

    <param name="bgcolor" value="#FFFFFF" />

    <param name="wmode" value="opaque" />

    <param name="flashvars" value="xmlfile=http://flshow.jimdo.com/app/download/3182951251/default.xml" />

         This slideshow requires Adobe Flash Player 9.0

   </object>

</div>

 

Blue text must be replaced with your swf and xml file respectively.

To set width and height change the red text.

The border of the container div, as well as the background color of thee Carousel are can also be customized (green text). Notice that also in the xml file you have to specify a background color, this should be equal to the bgcolor value specified here (unless you want to create some bizarre effect).

The gray message is shown if the user don't have Flash Player; it can be customized.

 

* Jimdo Free does not provide static urls for uploaded files. This is a reasonable policy introduced to avoid abuses of the free service but it makes it impossible to configure Carousel for Jimdo Free users.