URL dieser Frage
Einzeldiagramme
Einbindung Einzeldiagramme
Nachfolgend finden Sie eine Anleitung für die Einbindung unserer Einzeldiagramme sowie Fragen und Antworten zum Trouble-Shooting.
Für eine möglichst pragmatische Inbetriebnahme der Diagramme spielen Sie die von uns angelieferten Dateien 1:1 auf einen PHP-fähigen Server auf. Danach passen Sie unsere angelieferten Beispiel-URLs an die URLs Ihres Servers an und rufen die Diagramme probehalber in Ihrem Browser auf.
Für die Einbindung des Übersichtsdiagramms kopieren Sie nun den jeweiligen HTML-Code aus dem Browser an die gewünschte Stelle in Ihrem Auftritt. Der Pfad zur SWF-Datei und der Parameter mit der URL des Hauptdiagramms „orginalURL“ muss dabei angepasst werden.
Anschließend kopieren Sie den HTML-Code der Einbindung des Hauptdiagramms aus dem Browser an die gewünschte Ihres Auftrittes. Beachten Sie dabei, dass der Parameter "bl" dynamisch vom Übersichtsdiagramm an das Hauptdiagramm übergeben werden muss. Alle anderen Parameter können Sie einfach mit dem HTML-Code kopieren.
Den Parameter „imagesurl“ müssen Sie ggf. anpassen, lesen Sie dazu die entsprechende Frage weiter unten.
Für die Einbindung des Übersichtsdiagramms kopieren Sie nun den jeweiligen HTML-Code aus dem Browser an die gewünschte Stelle in Ihrem Auftritt. Der Pfad zur SWF-Datei und der Parameter mit der URL des Hauptdiagramms „orginalURL“ muss dabei angepasst werden.
Anschließend kopieren Sie den HTML-Code der Einbindung des Hauptdiagramms aus dem Browser an die gewünschte Ihres Auftrittes. Beachten Sie dabei, dass der Parameter "bl" dynamisch vom Übersichtsdiagramm an das Hauptdiagramm übergeben werden muss. Alle anderen Parameter können Sie einfach mit dem HTML-Code kopieren.
Den Parameter „imagesurl“ müssen Sie ggf. anpassen, lesen Sie dazu die entsprechende Frage weiter unten.
Mit den Einzeldiagrammen der Onlinewerft können Sie als Online-Redaktion einfach und mit minimalem redaktionellem und technischem Aufwand Ergebnisse politischer Wahlen in Ihren Auftritt einbinden. Die Diagramme beziehen die Daten aus einer von uns gepflegten, zentralen Datenquelle. Näheres erfahren Sie unter www.onlinewerft.de/wahlen.
Unsere großen Hauptdiagramme sind aufgrund ihrer Informationsbreite für die Einbindung unmittelbar auf einer Schlagzeilenseite oder auf der „Hauptseite Politik“ grafisch und von ihrem Platzbedarf her zu mächtig.
Die meisten Redaktionen wünschen sich aber auch eine animierte und sich automatisch aktualisierende Anzeige auf eben diesen Seiten. Aus diesem Grund bieten wir die deutlich schlankeren Übersichtsdiagramme an als Teaser, mit denen Sie das große Diagramm redaktionell und grafisch hochwertig anteasern können. Durch Klick auf das Übersichtsdiagramm gelangen die User dann auf eine Extraseite mit dem großen Hauptdiagramm.
Bei Wahlereignissen mit bspw. drei parallel stattfindenden Landtagswahlen haben Sie auf diese Weise außerdem zunächst alle drei Bundesländer gleichberechtigt dargestellt und der User kann durch seinen Klick selbst entscheiden, zu welcher Wahl er zuerst die Details sehen möchte.
Die meisten Redaktionen wünschen sich aber auch eine animierte und sich automatisch aktualisierende Anzeige auf eben diesen Seiten. Aus diesem Grund bieten wir die deutlich schlankeren Übersichtsdiagramme an als Teaser, mit denen Sie das große Diagramm redaktionell und grafisch hochwertig anteasern können. Durch Klick auf das Übersichtsdiagramm gelangen die User dann auf eine Extraseite mit dem großen Hauptdiagramm.
Bei Wahlereignissen mit bspw. drei parallel stattfindenden Landtagswahlen haben Sie auf diese Weise außerdem zunächst alle drei Bundesländer gleichberechtigt dargestellt und der User kann durch seinen Klick selbst entscheiden, zu welcher Wahl er zuerst die Details sehen möchte.
Die Übersichtsdiagramme sind in ihrer Einbindung bewusst noch einfacher gehalten als die Hauptdiagramme, damit Sie sie unkompliziert in Ihren Auftritt einbinden können. Das Diagramm ist wie jedes gewöhnliche Flashelement in den HTML-Code einzubinden und benötigt keine weitergehenden Dateien.
Legen Sie die SWF-Datei wie gewohnt auf Ihrem Server ab oder hinterlegen Sie sie in Ihrem CMS. Anschließend binden Sie sich im HTML-Code an der gewünschten Stelle ein wie gewohnt.
Der SWF-Datei müssen dann lediglich noch drei Parameter in den sog. „Flashvars“ übergeben werden. Unter dem Parameter „ivwAngebotskennung“ übergeben Sie Ihre IVW-Adresse, bspw. „abcde“, wenn Ihre IVW-Adresse http://abcde.ivwbox.de lautet. Unter dem Parameter „ivwCode“ übergeben Sie den Namen des IVW-Pixels, dass pro Userklick in dem Hauptdiagramm (!) an IVW gesendet werden soll.
Das Übersichtsdiagramm selbst sendet konsequenter Weise keine IVW-Pixel, da ein Klicken innerhalb des Diagramms nicht möglich ist. Die IVW-Informationen werden aber vom Übersichtsdiagramm an das Hauptdiagramm weitergegeben.
Im dritten Parameter „orginalURL“ geben Sie die URL an, unter der sich Ihr Hauptdiagramm befindet, bspw. „http://wahlen.ihre-domain-.de/090429_haupt.php“
Die Einbindung des SWFs kann dann beispielsweise so aussehen:
…src=“uebersicht_300.swf?orginalURL= http://wahlen.ihre-domain-.de/090429_haupt.php&ivwAngebotskennung=abcde&ivwCode=wahlflash“
Hinweis: Bitte beachten Sie, dass der Verweis auf die SWF-Datei und entsprechend auf die Übergabe der Parameter bei einer konventionellen Einbindung in den HTML-Code doppelt erfolgen muss, einmal im „src“-Attribut des <embed>-Tags und einmal im „<object>“-Tag.
Eine beispielhafte Einbindung des Diagramms finden Sie unter dem folgenden Link. An diesem HTML-Code können Sie sich orientieren. Wenn Sie hier die Parameter ivwAngebotskennung und ivwCode bereits anpassen, können Sie den erzeugten HTML-Code aus dem Browser direkt für die Einbindung in Ihren Auftritt nutzen.
http://www.onlinewerft.de/html/wahldiagramme_2009/TH_SL_SN_090429_uebersicht_300.php?ivwAngebotskennung=abcde&ivwCode=wahlflash
Legen Sie die SWF-Datei wie gewohnt auf Ihrem Server ab oder hinterlegen Sie sie in Ihrem CMS. Anschließend binden Sie sich im HTML-Code an der gewünschten Stelle ein wie gewohnt.
Der SWF-Datei müssen dann lediglich noch drei Parameter in den sog. „Flashvars“ übergeben werden. Unter dem Parameter „ivwAngebotskennung“ übergeben Sie Ihre IVW-Adresse, bspw. „abcde“, wenn Ihre IVW-Adresse http://abcde.ivwbox.de lautet. Unter dem Parameter „ivwCode“ übergeben Sie den Namen des IVW-Pixels, dass pro Userklick in dem Hauptdiagramm (!) an IVW gesendet werden soll.
Das Übersichtsdiagramm selbst sendet konsequenter Weise keine IVW-Pixel, da ein Klicken innerhalb des Diagramms nicht möglich ist. Die IVW-Informationen werden aber vom Übersichtsdiagramm an das Hauptdiagramm weitergegeben.
Im dritten Parameter „orginalURL“ geben Sie die URL an, unter der sich Ihr Hauptdiagramm befindet, bspw. „http://wahlen.ihre-domain-.de/090429_haupt.php“
Die Einbindung des SWFs kann dann beispielsweise so aussehen:
…src=“uebersicht_300.swf?orginalURL= http://wahlen.ihre-domain-.de/090429_haupt.php&ivwAngebotskennung=abcde&ivwCode=wahlflash“
Hinweis: Bitte beachten Sie, dass der Verweis auf die SWF-Datei und entsprechend auf die Übergabe der Parameter bei einer konventionellen Einbindung in den HTML-Code doppelt erfolgen muss, einmal im „src“-Attribut des <embed>-Tags und einmal im „<object>“-Tag.
Eine beispielhafte Einbindung des Diagramms finden Sie unter dem folgenden Link. An diesem HTML-Code können Sie sich orientieren. Wenn Sie hier die Parameter ivwAngebotskennung und ivwCode bereits anpassen, können Sie den erzeugten HTML-Code aus dem Browser direkt für die Einbindung in Ihren Auftritt nutzen.
http://www.onlinewerft.de/html/wahldiagramme_2009/TH_SL_SN_090429_uebersicht_300.php?ivwAngebotskennung=abcde&ivwCode=wahlflash
Für das Hauptdiagramm liefern wir Ihnen 2009 nur eine SWF-Datei aus statt eine SFW-Datei pro Wahlereignis wie bei vergangenen Wahlen. Diese eine SWF-Datei ist in der Lage, sämtliche von uns angebotenen Wahlereignisse des Wahljahres 2009 abzubilden.
Die einfachste Art der Einbindung des Hauptdiagramms: Kopieren Sie alle von uns angelieferten Dateien auf einen Webspace mit PHP-Verfügbarkeit. Anhand der exemplarischen Links, die Sie von uns erhalten haben, können Sie das Diagramm danach aufrufen:
http://wahlen.ihre-domain.de/090429_haupt.php?bl=TH&f_breite=552&ivwAngebotskennung=abcde&ivwCode=wahlflash
Die Parameter in diesem Link:
„bl“: Übergeben Sie hier das Kürzel des Bundeslandes, das Sie anzeigen wollen.
Hinweis: Beim Klick eines Users auf ein Übersichtsdiagramm wird dieser Parameter automatisch angehängt.
„ivwAngebotskennung“: Übergeben Sie hier Ihre IVW-Adresse, bspw. „abcde“, wenn Ihre IVW-Adresse http://abcde.ivwbox.de lautet
Hinweis: Wenn Sie den Parameter bereits an das Übersichtsdiagramm übergeben haben und ein User darauf klickt, wird dieser automatisch angehängt
„ivwCode“: übergeben Sie hier den Namen des IVW-Pixels, das pro Userklick in dem Hauptdiagramm an IVW gesendet werden soll.
Hinweis: Wenn Sie den Parameter bereits an das Übersichtsdiagramm übergeben haben und ein User darauf klickt, wird dieser automatisch angehängt.
Die einfachste Art der Einbindung des Hauptdiagramms: Kopieren Sie alle von uns angelieferten Dateien auf einen Webspace mit PHP-Verfügbarkeit. Anhand der exemplarischen Links, die Sie von uns erhalten haben, können Sie das Diagramm danach aufrufen:
http://wahlen.ihre-domain.de/090429_haupt.php?bl=TH&f_breite=552&ivwAngebotskennung=abcde&ivwCode=wahlflash
Die Parameter in diesem Link:
„bl“: Übergeben Sie hier das Kürzel des Bundeslandes, das Sie anzeigen wollen.
Hinweis: Beim Klick eines Users auf ein Übersichtsdiagramm wird dieser Parameter automatisch angehängt.
„ivwAngebotskennung“: Übergeben Sie hier Ihre IVW-Adresse, bspw. „abcde“, wenn Ihre IVW-Adresse http://abcde.ivwbox.de lautet
Hinweis: Wenn Sie den Parameter bereits an das Übersichtsdiagramm übergeben haben und ein User darauf klickt, wird dieser automatisch angehängt
„ivwCode“: übergeben Sie hier den Namen des IVW-Pixels, das pro Userklick in dem Hauptdiagramm an IVW gesendet werden soll.
Hinweis: Wenn Sie den Parameter bereits an das Übersichtsdiagramm übergeben haben und ein User darauf klickt, wird dieser automatisch angehängt.
Sie können in der PHP-Datei 090429_haupt.php den HTML-Code eines statischen Layouts um die Flasheinbindung herum bauen. Dies ist sicherlich die aufwändigste Methode der Integration des Diagramms in Ihr Layout.
Falls Sie Kopf und Fuß Ihres Auftrittes als inkludierbare Schnipsel zur Verfügung haben, können Sie natürlich oberhalb des Flashs Ihren Seitenkopf und unterhalb den –Fuß per „include“ einbinden. Dann ist diese Form der Einbindung sehr einfach.
Falls Sie Kopf und Fuß Ihres Auftrittes als inkludierbare Schnipsel zur Verfügung haben, können Sie natürlich oberhalb des Flashs Ihren Seitenkopf und unterhalb den –Fuß per „include“ einbinden. Dann ist diese Form der Einbindung sehr einfach.
Ja, diese Methode ist in den meisten Fällen die einfachste Art der Einbindung. Legen Sie eine Seite über Ihr CMS an wie gewohnt und platzieren auf dieser Seite einen IFrame, in dem Sie wiederum die URL des Hauptdiagramms als „src“ eintragen.
Bsp:
Unter der Seite www.ihre-domain.de/wahl_xyz/ integrieren Sie einen IFrame in der Größe des Flashdiagramms, dessen Inhalt von der URL
http://wahlen.ihre-domain-.de/090429_haupt.php?bl=TH&f_breite=552&ivwAngebotskennung=abcde&ivwCode=wahlflash
geladen wird.
Hinweis: Wenn Sie auch unser Übersichtsdiagramm nutzen und es sich um ein Wahlereignis mit bspw. drei parallel stattfindenden Wahlen handelt, so wird im Parameter „bl“ vom Übersichtsdiagramm übergeben, welches Bundesland der User angeklickt hat. Das Hauptdiagramm startet dann mit diesem Bundesland. Dieser Parameter wird dann vom Übersichtsdiagramm übergeben an
www.ihre-domain.de/wahl_xyz/?bl=TH
Von dieser Seite muss der Parameter dann im „src“ an den IFrame weitergegeben werden. Je nach CMS kann dies eine Schwierigkeit sein.
Bsp:
Unter der Seite www.ihre-domain.de/wahl_xyz/ integrieren Sie einen IFrame in der Größe des Flashdiagramms, dessen Inhalt von der URL
http://wahlen.ihre-domain-.de/090429_haupt.php?bl=TH&f_breite=552&ivwAngebotskennung=abcde&ivwCode=wahlflash
geladen wird.
Hinweis: Wenn Sie auch unser Übersichtsdiagramm nutzen und es sich um ein Wahlereignis mit bspw. drei parallel stattfindenden Wahlen handelt, so wird im Parameter „bl“ vom Übersichtsdiagramm übergeben, welches Bundesland der User angeklickt hat. Das Hauptdiagramm startet dann mit diesem Bundesland. Dieser Parameter wird dann vom Übersichtsdiagramm übergeben an
www.ihre-domain.de/wahl_xyz/?bl=TH
Von dieser Seite muss der Parameter dann im „src“ an den IFrame weitergegeben werden. Je nach CMS kann dies eine Schwierigkeit sein.
Auch das Hauptdiagramm können Sie wie gewohnt als SWF-Datei an beliebiger Stelle in Ihren Auftritt einbinden. Dazu müssen folgende Bedingungen müssen dazu erfüllt sein:
- Der Ordner „images“ muss für das Diagramm auffindbar sein. Lesen Sie dazu die Frage „Wo ist der Ordner ‚images’ abzulegen?“
- Die vom Hauptdiagramm benötigten Parameter müssen in den Flashvars übergeben werden. Lesen die dazu die Frage ‚Wie ist das Hauptdiagramm in Betrieb zu nehmen?’
Beachten Sie dabei die Sonderrolle des Parameters „bl“, der ggf. vom Übersichtsdigramm übergeben wird und deshalb in Ihrem CMS dynamisch an das swf des Hauptdiagramms weitergegeben werden muss
Wenn es sich um ein Wahlereignis mit nur einer Wahl handelt oder wenn Sie unser Übersichts-Diagramm nicht nutzen, können Sie auch den Parameter „bl“ bei der Einbindung des Hauptdiagramms „fest verdrahten“.
In dem Ordner „images“ liegen eine txt-Datei mit einigen globalen Variablen sowie die Hintergrunddatei des Flashdiagramms. In der globals.txt ist u.a. die im Hauptdiagramm angezeigte Überschrift hinterlegt. Lesen Sie hierzu den Abschnitt „Das Diagramm zeigt eine falsche Überschrift“. Außerdem ist im Ordner „images“ das Hintergrundbild des Diagramms hinterlegt. Lesen Sie dazu die Frage „Wie können wir das Hintergrundmotiv austauschen?“
Das Diagramm benötigt die Inhalte des Ordners „images“. Wenn sich dieser Ordner nicht relativ unmittelbar unterhalb des Speicherortes des HTML-Codes aus Sicht des Browsers befindet, übergeben Sie dem Hauptdiagramm den Speicherort des Ordners „images“ über den Parameter „imagesurl“ entweder als relativen Pfad zum HTML oder als absoluten Pfad.
Beispiel A:
Sie haben das Hauptdiagramm eingebunden unter
www.ihre-domain.de/wahl_xyz/
Die SWF Datei liegt unter
www.ihre-domain.de/wahl_xyz/090429_haupt_450.swf
Der Ordner „images“ liegt unter
www.ihre-domain.de/wahl_xyz/images/
Der Parameter „imagesurl“ kann leer bleiben:
src=“…/090429_haupt_450.swf?imagesurl=&bl=TH&…“
Beispiel B:
Sie haben das Hauptdiagramm eingebunden unter
www.ihre-domain.de/wahl_xyz/
Die SWF Datei liegt unter
www.ihre-domain.de/wahl_xyz/swf-files/090429_haupt_450.swf
Der Ordner „images“ liegt unter
www.ihre-domain.de/wahl_xyz/images-files/images/
Übergeben Sie den Speicherort des Ordners „images“ als relativen Pfad zum HTML-CODE (relativ aus Sicht des Browsers) in den Flashvars mit
src=“swf-files/090429_haupt_450.swf?imagesurl=images-files&bl=TH&…“
oder mit führendem Slash relativ zur Domain
src=“swf-files/090429_haupt_450.swf?imagesurl=/wahl_xyz/images-files&bl=TH&…“
Beispiel C:
Sie haben das Hauptdiagramm eingebunden unter
www.ihre-domain.de/wahl_xyz/
Die SWF Datei liegt unter
www.ihre-domain.de/multimedia/090429_haupt_450.swf
Der Ordner „images“ liegt unter
www.eine-ANDERE-domain.de/others/wahlen/
Übergeben Sie den Speicherort des Ordners „images“ in den Flashvars mit
src=“/multimedia/090429_haupt_450.swf?imagesurl=http://www.eine-ANDERE-domain.de/others/wahlen/&bl=TH&…“
Achtung: In diesem Fall müssen Sie unter www.eine-ANDERE-domain.de eine Datei crossdomain.xml, die dem Flash von www.ihre-domain.de erlaubt. Der Inhalt der Dstei muss lauten:
<?xml version="1.0"?>
<cross-domain-policy>
<allow-access-from domain="www.ihre-domain.de" />
</cross-domain-policy>
Beispiel A:
Sie haben das Hauptdiagramm eingebunden unter
www.ihre-domain.de/wahl_xyz/
Die SWF Datei liegt unter
www.ihre-domain.de/wahl_xyz/090429_haupt_450.swf
Der Ordner „images“ liegt unter
www.ihre-domain.de/wahl_xyz/images/
Der Parameter „imagesurl“ kann leer bleiben:
src=“…/090429_haupt_450.swf?imagesurl=&bl=TH&…“
Beispiel B:
Sie haben das Hauptdiagramm eingebunden unter
www.ihre-domain.de/wahl_xyz/
Die SWF Datei liegt unter
www.ihre-domain.de/wahl_xyz/swf-files/090429_haupt_450.swf
Der Ordner „images“ liegt unter
www.ihre-domain.de/wahl_xyz/images-files/images/
Übergeben Sie den Speicherort des Ordners „images“ als relativen Pfad zum HTML-CODE (relativ aus Sicht des Browsers) in den Flashvars mit
src=“swf-files/090429_haupt_450.swf?imagesurl=images-files&bl=TH&…“
oder mit führendem Slash relativ zur Domain
src=“swf-files/090429_haupt_450.swf?imagesurl=/wahl_xyz/images-files&bl=TH&…“
Beispiel C:
Sie haben das Hauptdiagramm eingebunden unter
www.ihre-domain.de/wahl_xyz/
Die SWF Datei liegt unter
www.ihre-domain.de/multimedia/090429_haupt_450.swf
Der Ordner „images“ liegt unter
www.eine-ANDERE-domain.de/others/wahlen/
Übergeben Sie den Speicherort des Ordners „images“ in den Flashvars mit
src=“/multimedia/090429_haupt_450.swf?imagesurl=http://www.eine-ANDERE-domain.de/others/wahlen/&bl=TH&…“
Achtung: In diesem Fall müssen Sie unter www.eine-ANDERE-domain.de eine Datei crossdomain.xml, die dem Flash von www.ihre-domain.de erlaubt. Der Inhalt der Dstei muss lauten:
<?xml version="1.0"?>
<cross-domain-policy>
<allow-access-from domain="www.ihre-domain.de" />
</cross-domain-policy>
Sie können die im Hauptdiagramm angezeigte Überschrift selbst ändern in der Datei „globals.txt“ im Ordner „images“. Der letzte hier eingetragene Wert ist die im Diagramm angezeigte Überschrift. Bitte beachten Sie, dass der Texteintrag URL-encoded werden muss, bspw.: globalHeadline=Landtagswahlen%20am%2030.08.2009
Das Hintergrundmotiv für das Hauptdiagramm liegt im Ordner „images“. Die Datei heißt „bgimg.jpg“ für das Diagramm in 450 Pixeln Breite und „bgimg552.jpg“ für das Diagramm in 552 Pixeln Breite. Sie können diese Datei mit einem beliebigen Motiv überschreiben. Das von uns standardmäßig vorgeschlagene Motiv stammt von fotolia.de. Sie finden es unter fotolia.com und können es dort gegen verschwindend geringes Entgelt erwerben: http://de.fotolia.com/id/11615631.
Sie können das Diagramm nutzen sobald wir es Ihnen ausgeliefert haben. So weit das Diagramm zu diesem Zeitpunkt noch Testdaten anzeigt, werden wir Sie darauf hinweisen. In diesem Fall ist eine Einbindung in Ihren Live-Auftritt natürlich nicht sinnvoll.
Sobald wir in einem Diagramm Testdaten durch echte Daten ersetzt haben, werden Sie hierüber informieren.
Sobald wir in einem Diagramm Testdaten durch echte Daten ersetzt haben, werden Sie hierüber informieren.
Am jeweiligen Wahlabend entfernen wir die letzten Umfragewerte gegen 17:30 Uhr aus dem Diagramm. Ab 18:00 hinterlegen wir Prognosen und Hochrechnungen von Infratest Dimap und Forschungsgruppe Wahlen so weit und so schnell sie uns zur Verfügung stehen.
In der Vergangenheit hatten wir erste Daten stets sehr kurz nach 18 Uhr online, häufig schneller als ARD und ZDF selbst sie online zeigten.
In der Vergangenheit hatten wir erste Daten stets sehr kurz nach 18 Uhr online, häufig schneller als ARD und ZDF selbst sie online zeigten.
Jede Domain, unter der eines unserer Diagramme installiert ist und von der aus unsere zentrale Datenquelle somit abgerufen wird, muss hierzu von uns freigeschaltet sein.
Wahrscheinlich haben Sie die Diagramme unter einer anderen Domain installiert als wir vermutet haben, somit ist die betreffende Domain für den Bezug der Daten nicht freigegeben. Kontaktierten Sie uns bitte, damit wir die richtige Domain für Sie freischalten können.
Wahrscheinlich haben Sie die Diagramme unter einer anderen Domain installiert als wir vermutet haben, somit ist die betreffende Domain für den Bezug der Daten nicht freigegeben. Kontaktierten Sie uns bitte, damit wir die richtige Domain für Sie freischalten können.
