====== Klick zu externer Website aufzeichnen ======

Eine externe Website ist mittels HTML schnell verlinkt und HTML-Code lässt sich nahezu überall in SoSci Survey verwenden (z.B. Fragetexte, Items, Textbausteine im Darstellungsmodus "HTML-Code").

<code html>
<a href="https://www.soscisurvey.de/">SoSci Survey Homepage</a>
</code>

Und falls der Link in einem neuen Browserfenster oder Browsertab öffnen soll, ist dafür nur ein zusätzlicher Parameter erforderlich:

<code html>
<a href="https://www.soscisurvey.de/" target="_blank">SoSci Survey Homepage</a>
</code>

In einigen Erhebungsdesigns dienen die Hyperlinks aber nicht nur zur Information für die Teilnehmer, sondern ihre Verwendung ist zugleich eine abhängige Variable (AV). Das heißt: Der Forscher muss wissen, ob ein Hyperlink angeklickt wurde oder nicht.

Diese Anleitung beschreibt zwei mögliche Lösungen:

  * Die erste Lösung setze die Verwendung von [[:de:create:javascript|JavaScript]] voraus, wobei JavaScript bei fast allen Teilnehmern aktiviert ist.
  * Die andere Lösung arbeitet mit Knöpfen (Buttons) anstatt mit "normalen" Links. Wenn man den Fragebogen mit dem Klick auf den Link verlassen möchte, funktioniert diese Lösung selbst dann, wenn der Teilnehmer JavaScript deaktiviert hat.

**Wichtig:** Der Link kann nicht auf der "letzten Seite" des Fragebogens stehen, denn wenn dieser erreicht wird, ist das Interview abgeschlossen und es können keine Daten mehr gespeichert werden. Aber Sie können natürlich eine zusätzliche Fragebogen-Seite direkt vor der "letzten Seite" einfügen und auf dieser die Inhalte der letzten Seite (nochmals) als Textbaustein einfügen. Den "Weiter"-Knopf können Sie dann entweder mittels JavaScript-Befehl ''[[:de:create:soscitools|SoSciTools.submitButtonsHide()]]'' ausblenden oder mittels PHP-Befehl ''[[:de:create:functions:buttonhide]]'', wenn Sie nicht zur nächsten Seite im Fragebogen fortfahren möchten. Aber Vorsicht, aber das ''SoSciTools.submitPage()'' funktioniert bei der zweiten Variante nicht mehr (s. unten).


===== Vorbereitungen =====

In beiden Fällen wird eine [[:de:create:questions:internal|interne Variable]] benötigt, um den Klick im Datensatz zu speichern. Die nachfolgende Anleitung geht davon aus, dass die interne Variable die Kennung'' IV01_01'' hat (die zugehörige Frage entsprechend die Kennung ''IV01''). Selbstverständlich können Sie die interne Variable in jeder beliebigen Rubrik anlegen und die entsprechende Kennung verwenden, die Code-Beispiele müssen dann entsprechend angepasst werden.

Es sollte auch geklärt werden, ob der Fragebogen im Hintergrund geöffnet bleibt (JavaScript-Variante) oder ob der Teilnehmer den Fragebogen mit dem Klick auf den Link verlassen soll (Knopf-Variante).


===== Klick mittels JavaScript aufzeichnen =====

Um den Klick mittels JavaScript aufzuzeichnen, muss man beim Klick auf den Link ein JavaScript-Ereignis (Event) auslösen, welches die Daten schreibt und ggf. auch an den Befragungsserver schickt.

Dafür bekommt der Link zunächst eine eindeutige HTML-Kennung, im folgenden Beispiel ''"link01"''.

<code html>
<a href="https://www.soscisurvey.de/" id="link01" target="_blank">SoSci Survey Homepage</a>
</code>

Der folgende HTML-Code bindet eine anonyme Funktion an den Klick auf den Link. Diese Funktion schreibt den Wert ''2'' in die interne Variable. Außerdem sorgt der JavaScript-Code dafür, dass die Variable den Wert ''1'' erhält, wenn JavaScript aktiviert ist. Oberhalb des HTML-Codes wird noch ein klein wenig PHP-Code auf der Fragebogen-Seite eingefügt. Dieser belegt die interne Variable mit dem Wert -1 vor (wenn dieser im Datensatz steht, war JavaScript deaktiviert) und bindet sie in die Fragebogen-Seite ein.

<code php>
preset('IV01_01', -1);
question('IV01');
</code>

<code javascript>
<!-- Hier der eigentliche Link -->
<a href="https://www.soscisurvey.de/" id="link01" target="_blank">SoSci Survey Homepage</a>
<!-- Und hier das JavaScript für die Speicherung -->
<script type="text/javascript">
<!--
document.getElementById("IV01_01").value = "1";
SoSciTools.attachEvent(document.getElementById("link01"), "click", function() {
  document.getElementById("IV01_01").value = "2";
});
// -->
</script>
</code>

Klickt man nun auf den Link an, wird der Wert 2 zunächst im Eingabefeld der internen Variable gespeichert. Im Datensatz ist er damit noch nicht. Dafür gibt es nun 3 Möglichkeiten:

  - Sie können in den Eigenschaften der internen Variable (selbige dafür links in der Navigation anklicken) für die //Datenübermittlung// einstellen "Daten periodisch im Hintergrund übermitteln".
  - Sie können darauf warten, dass der Teilnehmer zum Fragebogen zurückkehrt und auf "Weiter" klickt. Je nach Design kann das riskant sein.
  - Sie können beim Klick auf den Link automatisch zur folgenden Seite im Fragebogen wechseln. Dafür muss der Befehl ''SoSciTools.submitPage()'' ergänzt werden. Dies funktioniert aber nicht in Verbindung mit dem oben erwähnten PHP-Befehl ''buttonHide()''.

<code javascript>
document.getElementById("IV01_01").value = "1";
SoSciTools.attachEvent(document.getElementById("links01"), "click", function() {
  document.getElementById("IV01_01").value = "2";
  SoSciTools.submitPage();
});
</code>

Prinzipiell kann mittels JavaScript auch gespeichert werden, wie oft der Link angeklickt wurde oder wie lange der Teilnehmer auf der externen Seite verweilte, bevor er zum Fragebogen zurückkehrte -- wobei man hier nie weiß, ob er auf dem Weg nicht noch schnell seine E-Mails geprüft hat.


===== Klick mittels Sprung zu einer Seite aufzeichnen =====

Diese Lösung benötigt eine zusätzliche Seite im Fragebogen -- und zwar eine Seite, die im normalen Ablauf nicht sichtbar wird. Mit seinem Klick auf den Link-Button springt der Teilnehmer zu der Extraseite, dafür kommt die PHP-Funktion ''[[:de:create:functions::buttontopage]]'' zum Einsatz. Auf der Extraseite wird der Klick registriert und der Teilnehmer zur eigentlichen Zielseite umgeleitet.

Wenn der Link ohnehin auf der "letzten Seite" oder genauer, auf einer zusätzlichen vorgeschalteten Abschiedsseite des Fragebogens steht, dann bietet es sich an, den Fragebogen mit Klick auf den Link zu verlassen.

Prinzipiell wäre es bei dieser Konstellation auch möglich, den Fragebogen nach dem Klick fortzusetzen. Allerdings wird das Öffnen eines neuen Fensters mittels JavaScipt, was dafür notwendig wäre, von vielen Browsern blockiert. Deshalb wird hier nur die zuverlässige Variante dargestellt, bei welcher der Teilnehmer den Fragebogen mit dem Klick auf den Link verlässt.

Dafür werden tatsächlich 2 vorgeschaltete Seiten benötigt, und zumindest eine davon benötigt eine [[:de:glossary#seitenkennung|Seitenkennung]], im Beispiel "link01":

  * Die vorgeschaltete Abschiedsseite (benötigt keine Kennung) mit ''buttonToPage()''
  * Die Seite mit der Umleitung mit einer Seitenkennung z.B. "link01"
  * Und dann erst folgt die "letzte Seite" mit der automatisch voreingestellten Kennung "end"

Auf der vorgeschalteten Abschiedsseite wird nun mittels [[:de:create:placeholders|Platzhalter]] oder einfach mittels Befehl ''[[:de:create:functions:html]]'' der Knopf eingebunden und dafür der Weiter-Knopf deaktiviert.

<code php>
$htmlButton = buttonToPage('link01', 'Infoseite zu SoSci Survey');
html('<p>Wenn Sie mehr über diese phantastische Software erfahren möchten, besuchen Sie die '.$htmlButton.'</p>');

// Kein normaler "Weiter"-Knopf
buttonHide();

// Interne Variable initialisieren (Code 1)
put('IV01_01', 1);
</code>

Mittels CSS kann man den Knopf formatieren oder ihm sogar das Erscheinungsbild eine "normalen" Links geben.

Auf der Extraseite "link01" sorgt nun der Befehl ''[[:de:create:functions:redirect]]'' dafür, dass der Teilnehmer direkt zur gewünschten Seite umgeleitet wird. Und ''[[:de:create:functions:put]]'' speichert 

<code php>
put('IV01_01', 2);
redirect('https://www.soscisurvey.de/');
</code>


==== Erscheinungsbild wie ein Link ====

Der folgende PHP-Code für die erste vorgeschaltete Seite (jene mit ''buttonToPage()'') verwendet anstatt einer String-Verknüpfung den Platzhalter ''%link01%'', der nicht nur in ''html()'', sondern auch in jedem beliebigen Textbaustein platziert werden kann.

Außerdem weist der vierte Parameter in ''buttonToPage()'' dem Knopf eine CSS-Klasse (hier z.B. "likelink") zu, die mit ein wenig CSS-Code wie ein "normaler" Link formatiert wird. Der CSS-Code wird mittels ''[[:de:create:functions:pagecss|pageCSS()]]'' auf der Seite eingebunden.

<code php>
buttonToPage('link01', 'Infoseite zu SoSci Survey', '%link01%', 'likelink');
html('<p>Wenn Sie mehr über diese phantastische Software erfahren möchten, besuchen Sie die %link01%.</p>');
 
// Formatieren des Knopfes
pageCSS('
button.likelink {
  background-color: transparent;
  border: 0 none;
  padding: 0;
  color: #FF9900;
  text-decoration: underline;
}
');

// Kein normaler "Weiter"-Knopf
buttonHide();
 
// Interne Variable initialisieren (Code 1)
put('DF07_01', 1);
</code>