How-To: Flash Panorama Player und WordPress

3. Juli 2009

+++ ENGLISH VERSION: CLICK HERE +++ ENGLISH VERSION: CLICK HERE +++

Im Netz bin ich über Sams Anleitung gestolpert, kam damit zwar klar, aber nicht auf Anhieb. Ich nehme an, dem Durchschnittsnutzer geht es nicht anders. Aus der Motivation heraus entstand dieses How-To, möglichst einfach den Flash Panorama Player in WordPress zu integrieren.

Ein, zwei Anmerkung zu dieser Anleitung.

  1. Ich habe meine Panoramas alle als cylindrisches JPGs vorliegen. Ich denke aber, man kann diese Anleitung auch benutzen, wenn man sein Panoramas als MOV auf dem Server liegen hat, da es beliebig erweiterbar ist.
  2. Ich will meine Panoramas direkt in die Seite einbauen und möglichst viel Kontrolle über das Einbinden haben. Ich möchte dies mit möglichst wenig Klicks und Text bewerkstelligen.
  3. Eine Abwandlung des Skripts, um die Panoramas mittels Fancybox, Lightbox oder Thickbox einzubinden, gebe ich am Ende des Tutorials.
  4. Ich benutze derzeit WordPress 2.7.1 zusammen mit Flash Panorama Player 2.3.1

Was machen und brauchen wir?

  1. Flash Panorama Player (FPP)
  2. WordPress Plugin Enzymes installieren
  3. WordPress Plugin More Fields installieren & einrichten (optional)
  4. Ran ans Panorama-Bloggen
  5. Das Ganze mit FancyBox, Thick- oder LightBox
  6. So sieht es dann aus

FPP-Dateien auf Server laden

1. Flash Panorama Player

Der Flash Panorama Player ist ein sehr schicker, schlanker und flexibler Viewer für Panoramas. Mein Favorit!

Wir werden das Panorama ganz ohne externe XML-Datei einbinden. Dadurch reicht es, die mitgelieferten SWF-Dateien und das Flash Detector Plugin (swfobjects.js) alle zusammen in ein Verzeichnis zu kopieren. In meinem Fall nach wp-content/panorama/. Ich benutze zusätzlich noch das Plugin logoMeter.

2. Enzymes installieren

Einfach runterladen, installieren und aktivieren. Dank Enzymes kann man sehr flexibel auf Inhalte des Blogs zurückgreifen und auch an PHP-Skripte übergeben. Die Idee ist, in die Metafelder den Dateinamen des Panoramas (und ggf. zusätzliche Informationen) einzugeben und diesen dann an ein PHP-Skript zu übergeben. Dieses Skript gibt dann den notwendigen Code zurück, womit das Panorama eingebunden wird.
Dafür im Template-Ordner wp-content/plugins/enzymes/templates des Plugins eine Datei names embedpano.php erstellen.

Das Skript bindet das Panorama wie unter SWFObject im Tutorial von FPP (tutorials/parameters.html#SWFObject) beschrieben ein. Zusätzlich nutzt es noch die Embedded XML file-Methode wie im Tutorial (tutorials/parameters.html#Embedded_XML_file) erklärt.
Hier der Code, den ihr für eure Seite noch anpassen müsst (Pfadangaben) und womit es auch ganz einfach sein sollte, zusätzliche Parameter einzubinden (Panorama-Größe, XML-Aufrufe):

<?php
// Put Every Variable in a Separated Field To Access Them Like This: $field_vars['pano-filename']
$field_vars = $this->elaborate("pano-filename => .pano-filename" );
// If You Are Using More Than One Meta Field, Use Code Like This
// $field_vars = $this->elaborate("pano-filename => .pano-filename \n pano-width => .pano-width \n pano-height => .pano-height" );

// Define (URL-) PATH to FPP Files
$fpp_path = 'http://DOMAIN.com/path/to/fpp/files';

// Define Size Of Embedded Panorama
$width = 610; // Or: $width = $field_vars['pano-width'];
$height = 400;

// Build Embedded XML String
$xml_string = '<?xml version = \'1.0\'?>';
$xml_string .= '<panorama>';
$xml_string .= '<parameters>';
$xml_string .= 'layer_1=' . $fpp_path . '/logoMeter.swf;'; // Load Plugins
$xml_string .= 'layer_3=' . $fpp_path . '/limits.swf;';
$xml_string .= 'layer_4=' . $fpp_path . '/autorotator.swf;';
$xml_string .= 'layer_5=' . $fpp_path . '/cylConverter.swf;';
$xml_string .= 'layer_8=' . $fpp_path . '/menuFullscreen.swf;';
$xml_string .= 'panoType=cylinder;';
$xml_string .= 'panoName=' . substr($field_vars['pano-filename'], 0, strrpos($field_vars['pano-filename'], '.')) . ';'; // Strip The File Extension
$xml_string .= 'loaderStreamed=1;';
$xml_string .= 'loaderBandwidth=100;';
$xml_string .= '</parameters>';
$xml_string .= '<cylconverter>'; // Set Plugin Parameters
$xml_string .= 'autoLimits=1;';
$xml_string .= 'strictBorders=0;';
$xml_string .= '</cylconverter>';
$xml_string .= '<logoMeter>'; // Set Plugin Parameters
$xml_string .= 'size=200x40;';
$xml_string .= 'radius=5;';
$xml_string .= 'bgColor=0xb0b0b0;';
$xml_string .= 'borderColor=0x303030;';
$xml_string .= 'meterSize=180x6;';
$xml_string .= 'meterPos=9:8;';
$xml_string .= 'meterColor=0xffffff;';
$xml_string .= 'textPos=9:17;';
$xml_string .= 'textSize=180x20;';
$xml_string .= 'textColor=0xCffffff;';
$xml_string .= 'textLoaded=Panorama wird geladen...;';
$xml_string .= 'font=Verdana;';
$xml_string .= 'fontsize=12;';
$xml_string .= 'delay=1000;';
$xml_string .= 'alpha=0.8;';
$xml_string .= 'postCommand=text2.alpha%3D1,600;';
$xml_string .= '</logoMeter>';
$xml_string .= '</panorama>';

// Get Timestamp As Unique DIV-ID
// Necessary If You Include More Than One Panorama On Your Website
$micro_time = microtime();
$flash_id = 'flashcontent' . substr($micro_time, 0, strrpos($micro_time, ' '));

// Echo Everything

echo '<script type="text/javascript" src="' . $fpp_path . '/swfobject.js"></script>' . "\n";
echo '<div id="' . $flash_id . '">Diese Seite ben&ouml;tigt <a href="http://www.adobe.com/go/getflashplayer/">Adobe Flash Player</a> und einen Browser mit aktiviertem JavaScript.</div>' . "\n";
echo '<script type="text/javascript">' . "\n";
echo 'var so = new SWFObject("' . $fpp_path . '/show_pano.swf", "mypano", "' . $width . '", "' . $height . '", "6.0.65", "#FFFFFF");' . "\n";
echo 'so.addParam("allowFullScreen","true");' . "\n";
echo 'so.addParam("allowScriptAccess","sameDomain");' . "\n";
echo 'so.addVariable("movie", "' . $fpp_path . '/pano.swf");' . "\n";
echo 'so.addVariable("redirect", window.location);' . "\n";
echo 'so.addVariable("xml_text", "' . $xml_string . '");' . "\n";
echo 'so.write("' . $flash_id . '");' . "\n";
echo '</script>' . "\n";

?>

Hier gibt es das Skript auch als Download: Embed Panorama Script

Das also unter wp-content/plugins/enzymes/templates/embedpano.php speichern. Nutzen werden wir es im übernächsten Schritt.

Kurze Erläuterung: Der XML-Aufruf muss in einer Zeile stehen und Einträge mit Semikolon abgetrennt werden. Um es übersichtlicher zu halten, hab ich das wie oben eingebunden. Der Pfad zum Panorama wird in der Variable $field_vars[‚pano-filename‘] stehen. Zum Einbinden mit cylConverter brauchen wir jedoch den Namen ohne die Dateiendung, daher der substr-Filter des Dateinamens.
Beliebig andere Metafelder können bspw. wie folgt eingebunden werden:

$field_vars = $this->elaborate("pano-filename => .pano-filename \n pano-thumbnail => .pano-thumbnail" );

Um dem Objekt einen eindeutigen Namen zu geben, benutze ich die ID des Beitrags: $this->post->ID. Um den DIV-Container für das Panorama eindeutig zu bezeichnen, benutze ich die microtime-Funktion. Somit kann man mehrere Panoramas in einen Beitrag einfügen.

Einstellungen von More Fields

3. More Fields installieren & einrichten

Das Plugin More Fields sorgt lediglich für eine bequemere Nutzung der Spezialfelder eines Beitrags (Meta Felder). Wir gehen wie folgt vor:

  1. More Fields runterladen, installieren und aktivieren.
  2. Unter Einstellungen > More Fields eine neue Box anlegen: Add new Box!:
    Box Title ist Embed Panorama
    Position ist right.
    Dann mit Speichern bestätigen.
  3. Im Anschluss ein neues Feld innerhalb der Box anlegen: Add new field!:
    Als Key vergebe ich pano-filename,
    Title ist Path to Pano File,
    Slug bleibt leer und
    als Type wähle ich Text.
    Noch auf Save klicken zum Bestätigen.

Dieser Schritt ist optional, man kann auch einfach beim Schreiben eines Beitrags, unten auf Spezialfelder klicken, dann auf Neu anlegen und als Name pano-filename vergeben.

Man kann natürlich beliebig viele Felder in der Box anlegen. Zum Beispiele eine, die die Größe definiert.

Panorama hochladen & Pfad kopieren

4. Ran ans Panorama-Bloggen

Eine neue Seite oder einen neuen Beitrag erstellen und wie gewohnt das Bild/Panorama einfügen. Hier jedoch das Panorama hochladen und den Pfad zum Bild in die Zwischenablage kopieren. Zu finden ist der unter Link-URL -> Datei-URL. Den Vorgang mit Änderungen speichern abschließen. Die Informationen zu Titel und Beschreibung auszufüllen ist optional, macht aber für die bessere zukünftige Verwaltung durchaus Sinn.

Den kopierten Pfad zum Panorama jetzt in die Box, die wir mit More Fields erstellt haben, einfügen. Alternativ das Spezialfeld pano-filename nutzen.

Das Einbetten in den Beitrag geht nun ganz einfach mit:
Panorama bloggen!

{[ .-/embedpano.php ]}

Das war es schon. Der Inhalt des Meta-Felds mit dem Namen pano-filename wird innerhalb des Template-PHP-Skripts ausgelesen und beim Bauen des SWF-Objekts entsprechend eingebunden.
How easy is that?

5. Das Ganze mit FancyBox

Das funktioniert auch. Ich hab dafür das Plugin FancyBox for WordPress installiert. Dann im PHP-Skript den Inhalt in einen DIV-Container werfen, der unsichtbar ist und eine eindeutige ID hat: <div id="pano" style="display: none;">...</div>. Dann beim Bloggen einen Aufruf ähnlich diesem bauen:

<a id="inline" class="fancybox" href="#pano"><img src="http://DOMAIN.com/path/to/pano-thumbnail.jpg" /></a>
{[ .-/embedpano.php ]}

Oben ist der Link und das Panorama wird als Inline-Element mit FancyBox eingebunden. Analog funktioniert das auch mit Lightbox.

6. So sieht es dann aus

Diese Seite benötigt Adobe Flash Player und einen Browser mit aktiviertem JavaScript.

How-To: Flash Panorama Player and WordPress

Surfing the web, I was looking for an easy integration of Flash Panorama Player into WordPress. I found Sams posts. But it was hard to understand, what and why he was doing certain things. I think, other users got the same experience. This was the motivation for writing this How-To.

One or two remarks on this How-To:

  1. I have saved all my panoramas as cylindric JPGs and this tutorial describes how to use JPGs. But I think you can still use it, if you have MOV-files on your server due to the easy adaption of the script
  2. I want to post my panorama pretty straight and easy, but still having the maximum of control. If possible, I want to have a one-click-integration without inserting tons of text.
  3. A modification of the script, to use it with FancyBox, LightBox or ThickBox is given at the end of the How-To.
  4. Currently, I am using WordPress 2.7.1 and Flash Panorama Player 2.3.1

What do we make and what do we need?

  1. Flash Panorama Player (FPP)
  2. Install WordPress Plugin Enzymes
  3. Install and set up WordPress Plugin More Fields (optional)
  4. Blog your panorama
  5. Use FancyBox, Thick- or LightBox
  6. That’s how it looks like

Put FPP-files to server

1. Flash Panorama Player

The Flash Panorama Player is a very fancy, light and flexible viewer engine for panoramas. My favorite one!

We are going to include the panorama without an external XML-file. So you only need to put the SWF-files of FPP and the Flash Detector Plugin (swfobjects.js) on your web server. I saved them in a folder called wp-content/panorama/. Additionally, I am using the plugin logoMeter.

2. Install Enzymes

Simply download, install und activate the plugin. Using enzymes you can easily access to content of your blog post and use them inside PHP-scripts. The idea is to put the filename of your panorama (and more information) into the meta fields of your post and pass these values to the PHP-script. The script processes and builds the required code for the flash player integration.
Therefor, create a new PHP-file inside of wp-content/plugins/enzymes/templates and call it embedpano.php.

The script embeds the panorama using SWFObject with Flash version detector plugin as described in the FPP tutorial (tutorials/parameters.html#SWFObject). Further, it is using the Embedded XML file-methode as described (tutorials/parameters.html#Embedded_XML_file).
Here is the code, which you have to adapt (path settings) and which you can use to include more parameter like size of your panorama or additionally plugins:

<?php
// Put Every Variable in a Separated Field To Access Them Like This: $field_vars['pano-filename']
$field_vars = $this->elaborate("pano-filename => .pano-filename" );
// If You Are Using More Than One Meta Field, Use Code Like This
// $field_vars = $this->elaborate("pano-filename => .pano-filename \n pano-width => .pano-width \n pano-height => .pano-height" );

// Define (URL-) PATH to FPP Files
$fpp_path = 'http://DOMAIN.com/path/to/fpp/files';

// Define Size Of Embedded Panorama
$width = 610; // Or: $width = $field_vars['pano-width'];
$height = 400;

// Build Embedded XML String
$xml_string = '<?xml version = \'1.0\'?>';
$xml_string .= '<panorama>';
$xml_string .= '<parameters>';
$xml_string .= 'layer_1=' . $fpp_path . '/logoMeter.swf;'; // Load Plugins
$xml_string .= 'layer_3=' . $fpp_path . '/limits.swf;';
$xml_string .= 'layer_4=' . $fpp_path . '/autorotator.swf;';
$xml_string .= 'layer_5=' . $fpp_path . '/cylConverter.swf;';
$xml_string .= 'layer_8=' . $fpp_path . '/menuFullscreen.swf;';
$xml_string .= 'panoType=cylinder;';
$xml_string .= 'panoName=' . substr($field_vars['pano-filename'], 0, strrpos($field_vars['pano-filename'], '.')) . ';'; // Strip The File Extension
$xml_string .= 'loaderStreamed=1;';
$xml_string .= 'loaderBandwidth=100;';
$xml_string .= '</parameters>';
$xml_string .= '<cylconverter>'; // Set Plugin Parameters
$xml_string .= 'autoLimits=1;';
$xml_string .= 'strictBorders=0;';
$xml_string .= '</cylconverter>';
$xml_string .= '<logoMeter>'; // Set Plugin Parameters
$xml_string .= 'size=200x40;';
$xml_string .= 'radius=5;';
$xml_string .= 'bgColor=0xb0b0b0;';
$xml_string .= 'borderColor=0x303030;';
$xml_string .= 'meterSize=180x6;';
$xml_string .= 'meterPos=9:8;';
$xml_string .= 'meterColor=0xffffff;';
$xml_string .= 'textPos=9:17;';
$xml_string .= 'textSize=180x20;';
$xml_string .= 'textColor=0xCffffff;';
$xml_string .= 'textLoaded=Panorama wird geladen...;';
$xml_string .= 'font=Verdana;';
$xml_string .= 'fontsize=12;';
$xml_string .= 'delay=1000;';
$xml_string .= 'alpha=0.8;';
$xml_string .= 'postCommand=text2.alpha%3D1,600;';
$xml_string .= '</logoMeter>';
$xml_string .= '</panorama>';

// Get Timestamp As Unique DIV-ID
// Necessary If You Include More Than One Panorama On Your Website
$micro_time = microtime();
$flash_id = 'flashcontent' . substr($micro_time, 0, strrpos($micro_time, ' '));

// Echo Everything

echo '<script type="text/javascript" src="' . $fpp_path . '/swfobject.js"></script>' . "\n";
echo '<div id="' . $flash_id . '">Diese Seite ben&ouml;tigt <a href="http://www.adobe.com/go/getflashplayer/">Adobe Flash Player</a> und einen Browser mit aktiviertem JavaScript.</div>' . "\n";
echo '<script type="text/javascript">' . "\n";
echo 'var so = new SWFObject("' . $fpp_path . '/show_pano.swf", "mypano", "' . $width . '", "' . $height . '", "6.0.65", "#FFFFFF");' . "\n";
echo 'so.addParam("allowFullScreen","true");' . "\n";
echo 'so.addParam("allowScriptAccess","sameDomain");' . "\n";
echo 'so.addVariable("movie", "' . $fpp_path . '/pano.swf");' . "\n";
echo 'so.addVariable("redirect", window.location);' . "\n";
echo 'so.addVariable("xml_text", "' . $xml_string . '");' . "\n";
echo 'so.write("' . $flash_id . '");' . "\n";
echo '</script>' . "\n";

?>

Get the script here: Embed Panorama Script

Save that to your file in wp-content/plugins/enzymes/templates/embedpano.php. We will call the script later.
Some short words about the script: The XML-call does not contain any line feed, all text should be formatted in a single line replacing all significant line feeds to „;“. Using the code above we are formating it gratifying to the eye. The path to the panorama file is stored in $field_vars[‚pano-filename‘]. Using cylConverter, we need the filename without extension. That is why I am using the substr call.
Any other meta fields can be included like this;

$field_vars = $this->elaborate("pano-filename => .pano-filename \n pano-thumbnail => .pano-thumbnail" );

To give the SWF object an ID, I am using the post ID: $this->post->ID. To give the DIV-container an unique identifier, I am using the microtime-function. Therewith, it is possible to include more than one panorama per post.

Settings of More Fields

3. Install More Fields

Using the plugin More Fields is a comfortable way to use the meta fields of your post. You can set it up as following:

  1. Download, install and activate More Fields.
  2. In Settings > More Fields choose: Add new Box!, whereas
    Box Title is Embed Panorama
    Position is right.
    Click on Save to confirm.
  3. Next, add a new field inside the box: Add new field!:
    For the Key identifier I am using pano-filename,
    Title is Path to Pano File,
    Slug stays blank and
    Type is Text.
    Click on Save to confirm.

As already mentioned, this step is optional. You can also add a meta field when writing a post: Click on Custom Fields, then Add Custom Field and use pano-filename for the Name.
You can add as many fields as you want, e.g. one for the size the panorama should have.

Upload panorama

4. Blog your panorama

Add a new post or page and upload your panorama. After uploading, make sure to copy the File-URL, fill in the title and description if you want.

Now paste the copied path to the Path to Pano File in the Embed Pano box. Or you can use a custom field named pano-filename.

Embedding the panorama is pretty easy, just paste this code into your post:

Panorama bloggen!
{[ .-/embedpano.php ]}

That’s it!. The content of the meta field pano-filename is read inside the Template-PHP-scripts and is included while building the SWF-object.
How easy is that?

5. FancyBox

Which is pretty easy to do. I am using the plugin FancyBox for WordPress.
Now simply put the output of your PHP-script into a DIV-container, which is invisible and which has a unique ID: <div id="pano" style="display: none;">...</div>. Writing your post, you should call the panorama like this:

<a id="inline" class="fancybox" href="#pano"><img src="http://DOMAIN.com/path/to/pano-thumbnail.jpg" /></a>
{[ .-/embedpano.php ]}

First line is a link to an inline-element which uses FancyBox. The second line embeds the invisible panorama. Embedding Light- or ThickBox should work pretty similar.

6. That’s how it looks like

Diese Seite benötigt Adobe Flash Player und einen Browser mit aktiviertem JavaScript.

micha | Newsblog | Kommentare | Trackback | Tags: , , Zum Seitenbeginn springen

20 Kommentare zu “How-To: Flash Panorama Player und WordPress”

  1. 01

    I tried your method in my above site which has wordpress 2.8, but it is working partiaaly, I mean though, i have flash player installed and javascript enabled. I am getting that alt message text, where could i have gone wrong, any help please.

    KVS Setty am 6. Juli 2009 um 10:04
    Zum Seitenbeginn springen
  2. 02

    Can you post a link to your post where you tried to integrate your pano?

    But you are right, I am using WordPress 2.7. I am still waiting for v.2.8.1 before upgrading..

    micha am 6. Juli 2009 um 10:18
    Zum Seitenbeginn springen
  3. 03

    Vielen Dank,
    werde ich mal ausprobieren!

    Thomas am 10. Juli 2009 um 14:06
    Zum Seitenbeginn springen
  4. 04

    Thanks for the how-to, Sams post was really too „short“.

    I am having troubles with passing xml options for hotspot plugin of flashpanorama player. The plugin requires use of quotation marks within the parameters, like the onStart parameter of tag:

    $xml_string .= “;
    $xml_string .= “;
    … etc

    I also tried adding semicolon between the parameters within tag, but did not help – it rather looks like a problem with quotation marks.

    Any idea?
    Milan

    Milan Knizek am 15. Juli 2009 um 07:40
    Zum Seitenbeginn springen
  5. 05

    Aah, pasting the code did not work out well. Here is a link to pastebin:

    http://pastebin.com/m2954dde9

    Milan Knizek am 15. Juli 2009 um 07:43
    Zum Seitenbeginn springen
  6. 06

    @Milan: Copy and paste of the posted code doesn’t work.. WordPress changes some characters.
    That’s why I posted a download link to the script. There, the formating should be fine and ready to use!

    micha am 15. Juli 2009 um 10:28
    Zum Seitenbeginn springen
  7. 07

    @micha: that’s misunderstanding – I have used the download link and basically the integration works.

    In case of the hotspot plugin, the xml parameter is variable = ( variable = some_setting ).

    Have a look at http://pastebin.com/m17362f02, e.g. the onStart parameter.

    No mater what I do, once I add the full hotspot plugin definition, the flashpanorama wont start. I guess it is because the quotation marks inside the xml_string definition, or problem with the semicolons.

    If I remove the lines 42 to 143 (i.e. the whole hotspot thing), it works fine.

    You can check out a test page here:
    http://www.milan-knizek.net/cms/panorama/test2/

    Thanks,
    Milan

    Milan Knizek am 15. Juli 2009 um 14:22
    Zum Seitenbeginn springen
  8. 08

    Okay, now I understand. You are right, probably a problem with the quotation marks..

    Have a look how I insert the xml version definition which is also embedded in quotation marks. Try to use escape characters (backslash):
    \‘
    or
    \“

    I have never used the HotSpot plugin, but maybe I will try it later that night.

    micha am 15. Juli 2009 um 15:40
    Zum Seitenbeginn springen
  9. 09

    Hm, using quotation marks looks okay, no need to escape.

    I have further tried to replace them with escaped single quotes and add semicolon almost everywhere, but still no go:

    http://pastebin.com/m502fd883

    P.S. This code is displayed in http://www.milan-knizek.net/cms/panorama/test2/

    I have googled a bit and found that xml_text directive could be a bit buggy. So I tried to use the old fpp.xml (working separately) file and added so.addVariable with xml_file reference to embedpano.php template, but the pano still does not display within wordpress http://www.milan-knizek.net/cms/panorama/test3/

    Milan Knizek am 15. Juli 2009 um 20:14
    Zum Seitenbeginn springen
  10. 10

    I checked your html-code..
    The described JavaScript method tries to replace the div-container named „flashcontent*“ with the panorama code.. But I can’t find the specific div-container on your site.. Looking in http://pastebin.com/m502fd883, I can see in line 155 and 156 that you don’t echo the necessary code. Try to output these 2 lines and give it a try.

    micha am 15. Juli 2009 um 20:41
    Zum Seitenbeginn springen
  11. 11

    You are right, it should be there. However, even after uncommenting the two echos, it does not work. The flashplayer loads, but the window remains blank.

    BTW, a working pano as per your example above is at http://www.milan-knizek.net/cms/panorama/

    I will try further to carefully check the xml syntax about hotspots and let you know if I succeed.

    thanks for help!
    Milan

    Milan Knizek am 16. Juli 2009 um 08:33
    Zum Seitenbeginn springen
  12. 12

    Gut!

    Mediaplayer am 30. Juli 2009 um 13:07
    Zum Seitenbeginn springen
  13. 13

    I have been trying to implement this code all night and I can not get it to work. The div is not replaced with the flash code. All I ever see is the text and link to click and download flash.
    Any help would be hugely appreciated.

    Thanks!

    Drew am 30. September 2009 um 08:06
    Zum Seitenbeginn springen
  14. 14

    @Drew:
    Could you provide a link, where I can check your code?

    Do you have Javascript enabled in your browser?

    micha am 30. September 2009 um 08:44
    Zum Seitenbeginn springen
  15. 15

    Sure thing.

    The testing page is found at http://www.wanderersapprentice.com/pano-testing.html

    Javascript is fully enabled. I can get FPP to work with Kimli Embed but not with your method. I’d much prefer to use yours if we can get it to work.

    Thanks for your help.
    Drew

    Drew am 30. September 2009 um 15:47
    Zum Seitenbeginn springen
  16. 16

    I checked your site. It tells me: „ReferenceError: Can’t find variable: SWFObject“

    So I explored your HTML-Code. You need to append a semicolon „;“ after the „so.write“-command in the javascript. It should look like this:
    so.write(„flashcontent0.10760700“);

    Hope that helps..

    micha am 30. September 2009 um 16:23
    Zum Seitenbeginn springen
  17. 17

    Micha,

    Thanks for your help but that semicolon didn’t quite do it. I am getting the same thing, no flash content. Same link as above.

    Drew

    Drew am 30. September 2009 um 20:56
    Zum Seitenbeginn springen
  18. 18

    The ReferenceError is caused by your „swfobject.js“..
    I found that you are using a newer version of „swfobject.js“ (v2.1). I’m using v1.5. I tried your code with my version, than at least the flash player is loaded. But unfortunately it fails loading your images.

    I haven’t used cubic panorama images by now, so I’m note sure about writing an apropriate XML file. Your one looks good, but you should use full paths, when specifing filenames.

    Maybe that helps for now.

    If I’ll have a chance to check the XML and get it to work, I let you know.

    micha am 30. September 2009 um 22:47
    Zum Seitenbeginn springen
  19. 19

    That did it. Thanks Micha. I’m not worried about the XML. I’ve made so many changes that I can go back and get the xml to work just fine. Thanks for your help.

    Best,
    Drew

    Drew am 30. September 2009 um 22:57
    Zum Seitenbeginn springen
  20. 20

    WordPress Themes

    How-To: Flash Panorama Player und WordPress « designest.de – Fotograf Leipzig

    Wordpress Themes am 9. Oktober 2014 um 00:26
    Zum Seitenbeginn springen

Kommentar schreiben

  •  
  •  
  •  

Verfolge neue Kommentare zu diesem Beitrag mit diesem Kommentar-Feed.

design est!

Zufallsbilder

Zitronen und PeperoniF/Stop Festival 2009: Von hier aus, wohin?Dächer des Piazza dell’anfiteatro, LuccaNew York City: Hochhaus am Ground ZeroCity Tunnel Leipzig: Besichtigung #1San Francisco: Happy HourMeine erste L-ScherbeParis: Musée du Louvre #2Werk2: Eröffnung Halle D - SK Tiger (Me And The White Tiger)Kiss-O-MeterTuner SeeWien: Österreichische Nationalbibliothek
Alle Bilder im Fotoblog