In diesem Kapitel lernen Sie das Content-Management-System von EFS Panel kennen.

• Sie besuchen das Standardpanel sowohl aus der Sicht interessierter Besucher als auch aus der Perspektive eingeloggter Panelisten.
• Im Adminbereich verschaffen Sie sich einen Überblick über die vorhandenen Websites und Sprachversionen und lernen den Website-Editor kennen.
• Sie erstellen selbst eine neue Panelseite.
• Verweise auf Detaildarstellungen in den folgenden Kapiteln geben Ihnen einen Einblick in den Leistungsumfang des CMS.

Die Panel-Website aus Teilnehmersicht

Was sehen interessierte Besucher?

Die Online-Präsenz eines Panels befindet sich üblicherweise unter der URL
http://www.your-domain.com

• Auf der Startseite werden die Besucher begrüßt und das Panel wird vorgestellt.
• Über ein Menü, eine Navigationsleiste oder Links können interessierte Besucher weitere Informationen, beispielsweise zum Panelbetreiber oder zu den Teilnahmeregeln, einsehen.
• Besucher, die am Panel teilnehmen möchten, können ein Registrierungsformular öffnen und sich anmelden.
• Bereits als Panelisten angemeldete Besucher können sich einloggen.

Was sehen eingeloggte Panelisten?

Nach dem Einloggen gelangen die Panelisten in den passwortgeschützten internen Bereich des Panels.

• Auf der persönlichen Homepage werden die Panelisten mit Namen begrüßt. Meist enthält diese Seite eine Liste der Umfragen, an denen die jeweiligen Panelisten gerade teilnehmen können.
• Die Panelisten können auf Informationen zugreifen, die nicht allgemein zugänglich sind, wie beispielsweise News oder Auswertungen von Umfragen.
• Die Panelisten können ihre eigenen Daten (z.B. Adressdaten, Kontostand) einsehen.
• Die Panelisten können selbst aktiv werden und beispielsweise die eigenen Registrierungsdaten ändern, Prämien einlösen oder Freunde werben.

Die Panel-Website bearbeiten

Sich im Adminbereich von EFS Panel orientieren

Der Adminbereich von EFS Panel ist durch einen personenbezogenen Login geschützt. Diesen finden Sie üblicherweise unter der URL http://www.yourdomain.com/www/

Nach dem Einloggen gelangen Sie auf die Startseite, die einen Überblick über das Panel und die laufenden Projekte bietet.

Im oberen Bereich des Bildschirms finden Sie in der Navigationsleiste Links zu den verschiedenen Modulen. Das Content-Management-System (CMS) und weitere Funktionen zur Bearbeitung der Panel-Website(s) befindet sich im Modul Website.

Websites und Sprachversionen

Öffnen Sie das Menü Website. Sie gelangen zur Website-Übersicht. Diese bietet einen Überblick über alle Websites und die jeweils dazugehörenden Sprachversionen:

• Eine Sprachversion ist eine Gruppe von Seiten und Funktionen, die zusammen eine vollständige Panel-Außenansicht in einer Sprache bilden.
• Eine Website ist eine Gruppe von Sprachversionen, die zusammen eine eigenständige Online-Präsenz - d.h. ein in mehrere Sprachen übersetztes Panel - bilden.
  • Eine Website kann beliebig viele Sprachversionen haben. Die Seitenstruktur dieser Sprachversionen ist identisch, aber jede Version hat einen eigenen Satz Templates. Bei der Auswahl der Module und Konfiguration von Prozessen wie beispielsweise der Registrierung besteht ebenfalls erheblicher Spielraum für sprachspezifische Variationen. Des Weiteren können Sie nicht nur die gesamte Website, sondern auch einzelne Sprachversionen beispielsweise für Wartungszwecke offline stellen.
  • Die Sprachversionen verschiedener Websites haben darüber hinaus auch unterschiedliche Seitenstrukturen.

Die Teilnehmer aller Websites und Sprachversionen einer EFS Panel-Installation werden mittels derselben EFS Panel-Administration verwaltet.

Beim Standardpanel ist im Auslieferungszustand nur eine Website („Panel Website“) mit einer Sprachversion („english“) vorhanden.

Der Website-Editor

Bearbeitet werden die Panelseiten im Website-Editor. Diesen öffnen Sie, indem Sie in der Übersicht den Namen der gewünschten Sprachversion anklicken. Alternativ können Sie auch das Menü Website-Editor öffnen und die gewünschte Website und Sprachversion mittels der Drop-Down-Liste im Kopfbereich auswählen.

Aufbau des Website-Editors

Der Website-Editor hat drei verschiedene Bestandteile:

1. Sprachversion-Info: In diesem Feld finden Sie die Grundinformationen zur Sprachversion. Mittels der Drop-Down-Liste können Sie von einer Sprachversion der Website zur nächsten wechseln. Überprüfen Sie, ob diejenige Version eingestellt ist, die Sie bearbeiten möchten. Wenn Sie den Editor von der Website-Übersicht aus durch Anklicken der Sprachversion öffnen, ist dies automatisch der Fall.
2. Linker Dialog: In diesem Dialog werden je nach Registerkarte die Grundeinstellungen oder die Seiten-, Template- und Include-Strukturen der aktuellen Sprachversion angezeigt.
3. Rechter Dialog: In diesem Dialog befindet sich dereigentliche Bearbeitungsdialog zur ausgewählten Seite bzw. zum Template oder Include.

Baumansicht

In der Baumansicht finden Sie die Seitenstruktur der aktuell geöffneten Sprachversion und verschiedene Werkzeuge zur Bearbeitung.

• Einstellungen: In diesem Dialog werden die Eigenschaften der Sprachversion konfiguriert.
• Seiten: Auf dieser Registerkarte finden Sie die Panelseiten. Die Anordnung im Baum bildet die Seitenstruktur ab:
  • In der Navigationsleiste des Panels werden die Menüpunkte entsprechend der Abfolge der Seiten in der Baumansicht angeordnet. Z.B. Home - Registration - How it works - News
  • Eine Seite, die in der Baumansicht auf der unteren Ebene platziert ist, wird auch in der externen Navigation auf der unteren Ebene angezeigt. Z.B. How it works → FAQ
    
    

• Templates: Die Templates steuern, wie die verschiedenen Daten aus den Modulen und der Panel-Datenbank aufbereitet und auf den Panelseiten ausgegeben werden.

• Includes: Dateien, die z.B. im Main-Template eingebunden werden. Dazu gehört beispielsweise die CSS-Datei, die hauptverantwortlich für das Layout einer Site ist.

Eine neue Panelseite hinzufügen

Die Panelisten Ihres Community-Panels führen persönliche Blogs. Da diese Blogs von zentraler Bedeutung für Ihre Studien ist, möchten Sie potentielle Interessenten darüber informieren und zum detaillierten Nachfragen ermutigen. Der Titel der neuen Seite soll lauten: „Blogging“. Die Seite soll für alle Besucher und Panelisten zugänglich sein und in der Navigationsleiste im Untermenü von „How it works“ platziert werden. Beinhalten soll sie zwei Elemente: Einen Abschnitt mit Erläuterungen, was man auf der Seite tun kann, und ein Formular zum Anfordern der Informationen.

Eine neue Panelseite anlegen

1. Klicken Sie die Registerkarte Seiten an und wählen dann den Button + Seite.
   
   

2. Geben Sie die folgenden Daten ein:

   – Seiten-Bezeichner: Der Seiten-Bezeichner dient zur eindeutigen, sprachunabhängigen Identifikation der Seite im System. Er wird insbesondere in der Adresszeile des Browsers und für interne Links verwendet. Daher sollte er keine Leerzeichen oder Sonderzeichen enthalten. Geben Sie ein: „blogging“.
   – Übergeordnete Seite: Die Seite soll auf der ersten Navigationsebene liegen. Wählen Sie daher den Ordner: „Seiten → How it works“
   – Position: Die Seite soll im Untermenü von „How it works“ „an erster Stelle“ platziert werden.
   – Interner Seitenname: Name der Seite im Strukturbaum. Handelt es sich um eine Website mit mehreren Sprachversion, kann in jeder Version ein anderer Name gewählt werden. Geben Sie ein: „Blogging“.
   – Main-Template: Das Main-Template ist das Rahmentemplate, das die Gesamtstruktur der Seite definiert. Wählen Sie „main_default“.
   – Positionierungstemplate: Dieses Template ermöglicht es, Inhaltselemente anders als standardmäßig vorgegeben zu positionieren. Für die neue Beispielseite ist es nicht erforderlich.
   – HTML-Titel: Titel, der im Browser, in der Navigation und im Breadcrumb verwendet wird. Geben Sie ein: „Blogging“.
   – Zugriffskontrolle: Der Zugriff soll nicht beschränkt werden, alle Besucher und Panelisten sollen Zugang haben. Wählen Sie daher „Öffentlich“.
   – In Navigation aufnehmen: Die neue Seite soll immer in der Navigationsleiste sichtbar sein. Wählen Sie daher „Immer“.
   – Meta-Keywords: In diesem Feld können Sie Stichwörter eingeben, unter denen ein Sucher die Seite in einer Suchmaschine erwarten würde. Das Feld ist nur optional, lassen Sie es daher bei dieser Beispielseite leer.
   – URL-Alias (früher: Seitenname für URL): Optional definierbarer Seitenname, der in der aktuellen Sprachversion zum Konstruieren einer suchmaschinenfreundlichen URL verwendet werden kann. Lassen Sie das Feld leer.
   
   

3. Bestätigen Sie mit Speichern.

4. Die Seite wird angelegt und die Baumansicht aktualisiert. Sie gelangen in den Bearbeitungsdialog der neuen Seite auf die Registerkarte Seitenmodule.

5. Wählen Sie den Vorschau-Modus Offline-Version, um die neue Seite zu sehen.

Inhalt und Funktionselemente einfügen

Im nächsten Schritt füllen Sie die Seite mit Inhalt und Funktionselementen. Der geplante Aufbau ist einfach: Im oberen Teil möchten Sie den Besuchern erklären, was Sie mit dem Formular im unteren Teil tun können. Dazu verwenden Sie das Modul „Überschrift + Text“. Im unteren Teil wird mit dem Modul „Kontaktformular“ ein Formular zum Anfordern von Informationen erzeugt.

1. Klicken Sie auf der Registerkarte Seitenmodule den Button + Seitenmodul an.
2. Geben Sie Folgendes ein:
   
   – Typ: In der Drop-Down-Liste stehen die verschiedenen Module zur Auswahl. Stellen Sie „Inhaltsmodul: Überschrift + Text“ ein.
   – Referenzname für Template: Mit diesem Namen kann das Modul von einem Positionierungstemplate aus angesprochen werden, was aber in diesem Beispiel nicht erforderlich sein wird. Lassen Sie den automatisch vorbelegten Text „module_blogging_1“ unverändert.
   – Seitenmodul Titel: Dies ist der interne Titel des Moduls. Geben Sie im Beispiel ein: „Blogging introduction“.
   – Modul-Template: Die Datenausgabe wird über ein modulspezifisches Template gesteuert. Wählen Sie das Template „cont_headline_text“, das zu diesem Inhaltsmodul gehört.
   – Im Feld „Position“ behalten Sie die Einstellung „an erster Stelle“ bei.
   
   

3. Klicken Sie Speichern an.

4. Nun werden die Einstelloptionen des Moduls „Inhaltsmodul: Überschrift + Text“ eingeblendet. Ergänzen Sie folgende Informationen:
   – Überschrift: Diese Überschrift wird auf der Panelseite als Titel des Abschnitts angezeigt. Geben Sie ein: „Blogging“.
   – Text: Dieses Feld enthält den eigentlichen Text. Geben Sie einen Fülltext ein.
   
   

   Information

   Sie können in den Texteingabefeldern HTML verwenden, beispielsweise um ein Wort fett oder kursiv darzustellen. Zeilenumbrüche werden mit den Tags <br> oder <br /> erzeugt. In Feldern, die mit „Smarty-Code“ markiert sind, können Sie Smarty verwenden.

5. Bestätigen Sie mit Speichern.

6. Wählen Sie den Vorschau-Modus Offline-Version, um die Änderung zu überprüfen.

7. Als nächstes wird der Abschnitt mit dem Kontaktformular erstellt. Wechseln Sie zurück auf die Registerkarte Seitenmodule.

8. Klicken Sie erneut + Seitenmodul an.

9. Geben Sie Folgendes ein:
   
   – Typ: „Funktionsmodul: Kontaktformular“
   – Referenzname für Template: „module_blogging_2“.
   – Seitenmodul Titel: „Blogging questions“.
   – Modul-Template: „func_contact_form“.
   – Position: „nach Blogging_introduction“.
   
   

10. Bestätigen Sie mit Speichern.

11. Nun werden die Einstelloptionen des Moduls „Funktionsmodul: Kontaktformular“ eingeblendet. Ergänzen Sie folgende Informationen:
    
    – Mail-Absender: Die E-Mail-Adresse, unter der die Kontaktmail versendet werden soll. Sie können entweder eine fest definierte E-Mail-Adresse verwenden. Achten Sie dann darauf, dass es sich um einen wirklich existierenden Mailaccount auf einem korrekt konfigurierten Mailserver handelt: Andernfalls besteht die Möglichkeit, dass die E-Mails fälschlich als Spam klassifiziert werden. Alternativ können Sie mit dem Platzhalter #u_email# die E-Mail-Adresse des Panelisten bzw. die im Kontaktformular eingegebene E-Mail-Adresse einfügen.
    – Meldung nach erfolgreicher Änderung: Diese Meldung wird ausgegeben, nachdem die Kontaktmail erfolgreich versandt wurde. Geben Sie ein: „Thank you. You will receive an answer as soon as possible.“
    
    

12. Geben Sie als Feedback- Thema „Blogging“ ein. Dazu gehört die Adresse der Person, die Anfragen zu diesem Thema beantwortet, im Beispiel „panelcommunity@example.com“.

13. Bestätigen Sie mit Speichern.

14. Geben Sie als weiteres Thema „Bonus points for blogging“ und eine dazugehörende Adresse ein.

15. Bestätigen Sie erneut mit Speichern.

16. Wählen Sie den Vorschau-Modus Offline-Version, um die fertige Seite zu überprüfen.

Die neue Panelseite veröffentlichen

Die neue Seite ist noch nicht öffentlich sichtbar: Sie haben bis jetzt lediglich mit einer Arbeitsversion gearbeitet. Dies können Sie leicht an den Status-Icons der Baumansicht erkennen:

• Graues Status-Icon: Die Seite ist unveröffentlicht
• Grünes Status-Icon: Die Seite ist öffentlich und up-to-date.
• Blaues Status-Icon: Die Seite ist online, allerdings ist sie in der internen Arbeitsfassung inzwischen verändert worden.

1. Um die Seite „Blogging“ online zu stellen, klicken Sie Seite veröffentlichen an.
2. Klicken Sie die Registerkarte Vorschau Online Version an oder öffnen Sie die Panel-Website direkt, um die Änderung im Live-Betrieb zu überprüfen.

Der Aufbau einer Panel-Site

Der Aufbau der Panelseiten mit Hilfe von Modulen und Templates ist das Thema dieses Kapitels.

• Zuerst wird erläutert, wie die Inhalte und Funktionen, die Sie im Contentbereich einer Panelseite finden, mit Modulen zusammengesetzt werden.
• Danach wird erklärt, wie die allgemeine Struktur der Panelseiten durch das Zusammenwirken verschiedener Templates zustande kommt.

Der Contentbereich der Panelseiten

Der Contentbereich einer Panelseite ist derjenige Teil, der den eigentlichen Seiteninhalt enthält: Informationstexte, Formulare, Funktionen. Dieser Bereich ist von Seite zu Seite unterschiedlich, während andere Teile wie beispielsweise Kopfteil und Menü weitgehend konstant bleiben.

In der Einführung haben Sie bereits praktisch ausprobiert, wie im neuen CMS der Contentbereich einer Panelseite gefüllt wird: Sie wählen Module aus, welche die gewünschten Inhalte und Funktionen zur Verfügung stellen, und fügen diese Module auf der Seite zusammen.

Mit Modulen zusammengesetzter Contentbereich einer Panelseite:

Die Struktur der Panelseiten

Beim Surfen durch die Außenansicht des Panels werden Sie feststellen, dass der mit Modulen definierte Contentbereich sich zwar von Seite zu Seite ändert, viele andere Bestandteile der Panelseiten bleiben jedoch konstant:

• Der Rahmenbereich sieht immer gleich aus.
• Navigationsleiste und Loginbereich ändern ihr Aussehen beim Einloggen, sehen aber auf allen externen Seiten gleich aus, und auf allen internen Seiten ebenfalls.

Technisch umgesetzt wird dies mit Hilfe des Template-Konzepts: Die Panelseiten werden in logische Bestandteile zerlegt, die jeweils von verschiedenen Dateien (Templates) erzeugt werden. Die allgemeine Struktur der Panelseiten wird im Main-Template definiert. In diesem Template werden die Bestandteile über Platzhalter eingefügt. Erst beim Ausliefern der Seiten an den Browser des Betrachters ersetzt die Smarty-Template-Engine die Platzhalter dynamisch durch die von den jeweiligen Templates gelieferten Daten.

Vorteile des Template-Konzepts

Der wichtigste Vorteil des Template-Konzepts besteht darin, dass die Umsetzung einer Änderung beispielsweise in der Navigationsleiste nur eine einmalige Änderung im Quellcode des entsprechenden Templates erfordert. Würde man das Panel stattdessen so aufbauen, dass jede Einzelseite (z.B. Startseite, „About us“-Seite, Persönliche Homepage der Panelisten) jeweils den kompletten HTML-Code enthält, so müsste eine Änderung beispielsweise in der Navigationsleiste an jeder einzelnen Seite vorgenommen werden. Dies ist zeitaufwendig und fehlerträchtig.

Des Weiteren ist es bei Seitenaufbau mittels mehrerer Templates möglich, Statusabhängigkeiten zu realisieren. Beispielsweise können Navigationsleiste, Loginbereich und Contentbereich für nicht angemeldete Surfer anders aussehen als für eingeloggte Panelisten.

Beispiel: Die Struktur der „Contact us“-Seite

Eine normale Panelseite enthält beim Standardpanel die folgenden Elemente, die jeweils in eigenen Templates definiert werden:

1. Navigation: Welche Menüs in der Navigation angezeigt werden, ist abhängig davon, ob der Betrachter eingeloggt ist oder nicht.
2. Meldungen
3. Login: Abhängig davon, ob der Betrachter eingeloggt ist oder nicht, enthält dieser Bereich unterschiedliche Funktionen, die wiederum aus zwei unterschiedlichen Templates stammen.
4. Contentbereich: Wird für jede einzelne Seite mit Hilfe von Inhalts- und Funktionsmodulen gefüllt. Wie die von den Modulen gelieferten Daten ausgegeben werden, wird wiederum über modulspezifische Templates definiert. Die Abbildung zeigt den Inhalt der Seite „About us“.
5. Subnavigation

Für die allgemeine Struktur der Seite und für das Einfügen der verschiedenen Einzelbestandteile in den Gesamtkontext ist das Main-Template verantwortlich.

Eine Panel-Seite planen

Das Aufsetzen einer neuen Panel-Site erfordert umfangreiche Vorbereitung und Planung:

• Es ist festzulegen, welche Seiten benötigt werden und wie die Seitenstruktur aussehen soll.
• Üblicherweise haben Panel-Sites ein speziell für sie entwickeltes Layout.
• Ein Panel kann mehrere Websites haben, die wiederum verschiedene Sprachversionen haben. Je nachdem, wie groß die Unterschiede zwischen den Websites und Sprachversionen sind, erfordert dies zusätzliche Planung.

Im Folgenden finden Sie Hinweise und Anregungen für die Planung.

Seitenstruktur planen

Die folgenden Überlegungen helfen Ihnen, einen Plan der Seitenstruktur zu entwickeln.

Welche Website(s) und Sprachversionen sind geplant?

• Planen Sie lediglich eine Website, oder sollen mehrere Websites aufgesetzt werden?
• Für jede geplante Website ist festzulegen, ob sie eine oder mehrere Sprachversionen haben soll.

Wenn Sie mehrere Sprachversionen oder gar mehrere Websites mit jeweils mehreren Sprachversionen planen, empfiehlt es sich, die folgenden Anregungen für jede Website einzeln durchzugehen.

Welche Seiten werden benötigt?

• Welche Seiten sollte die neue Website haben? Welche Seiten werden bereits beim Launch notwendig benötigt?
• Welche Seiten sollen für alle Besucher zugänglich sein, welche nur für eingeloggte Panelisten?
• Welche Seiten sind für zentrale Prozesse wie Rekrutierung und Incentivierung erforderlich? Prüfen Sie insbesondere, ob die Prozesse Ihres Panels zusätzliche Funktionsseiten über den Lieferumfang des Standardpanels hinaus erfordern. Wenn Sie beispielsweise sowohl das Standardaufnahmeverfahren mit Registrierung über die Website als auch gezielte Rekrutierung mit Zugangscodes unterstützen möchten, benötigen Sie unter Umständen eine zweite Registrierungsseite.

• Wenn die Website, die Sie bearbeiten, mehrere Sprachversionen hat, werden bestimmte Seiten nur in einer Sprachversion benötigt? Beachten Sie, dass die Seitenstruktur einer Website in allen Sprachversionen identisch ist und keine größeren Abweichungen erlaubt.

Aufbau der Navigation

• Wie sollen die Panelisten auf der Website navigieren: Über Menüs? Über Links?
• Werden ein oder mehrere Menüs benötigt?
• Welche Seiten sollen jeweils im eingeloggten und im ausgeloggten Zustand im Menü sichtbar sein?
• In welcher Reihenfolge sollen die Seiten im Menü erscheinen?
• Soll das Menü eine zweite Ebene haben, auf der Unterseiten angezeigt werden? Welche Seiten sollen auf der ersten, welche auf der zweiten Ebene erscheinen?

Inhalte und Funktionen der einzelnen Seiten

• Welche Inhalte und Funktionen soll die neue Seite enthalten? Mit welchen Seitenmodulen können die gewünschten Funktionen realisiert werden? Reichen die vorhandenen Funktionen aus oder muss ein Template modifiziert oder neu erstellt werden, um eine Funktion zu realisieren?
• Sollen alle Besucher, nur eingeloggte Panelisten oder nur bestimmte Panelgruppen Zugang zu einer Seite oder zu einem bestimmten Seitenabschnitt erhalten?
• Wenn die Website, die Sie bearbeiten, mehrere Sprachversionen hat, soll die Seite in verschiedenen Sprachversionen unterschiedlich konfiguriert werden oder verschiedene Inhalte und Funktionen enthalten?

Layout entwerfen

Üblicherweise werden Sie ein eigenes Design für Ihr Panel entwerfen und realisieren oder jemanden mit der Realisierung beauftragen. Tivian bietet die individuelle Gestaltung der Panel-Außenansicht selbstverständlich auch an. Die folgenden Anregungen helfen Ihnen oder Ihrem Designer bei der Umsetzung.

• Aus welchen Bestandteilen wird eine Seite Ihres Panels zusammengesetzt?
  • Welche Seitenbestandteile müssen notwendig auf allen Panelseiten vorhanden sein? Zum Beispiel sollte das Menü auf allen Seiten vorhanden sein. Auch ein Bereich zum Einblenden von Fehlermeldungen muss auf allen Seiten eingeplant werden.
  • Welche Seitenbestandteile sollen im ausgeloggten, welche im eingeloggten Zustand auf jeden Fall angezeigt werden? Beispielsweise wird das Login-Formular im ausgeloggten Zustand meist auf allen Panelseiten angezeigt.
  • Gibt es Seitenbestandteile, die nur auf einigen ausgewählten Seiten eingefügt werden sollen? Beispielsweise wird beim Standardpanel der Quick Poll nur auf den „Home“ und „My home“-Seiten angezeigt.
• Sind alle erforderlichen Seitenbestandteile beim Standardpanel bereits vorhanden oder müssen neue Templates geplant und angelegt werden?
• Sollen der öffentlich zugängliche Bereich und der interne Bereich der Panelisten unterschiedliche oder zumindest teilweise voneinander abweichende Layouts haben?
• Wenn Sie eine Website mit mehreren Sprachversionen oder mehrere Websites aufbauen, soll sich das Layout der verschiedenen Websites und Sprachversionen unterscheiden?