Im Folgenden finden Sie zugehöriges HTML-Schnipsel zum Einbetten Ihres PW-Surveys in die eigene Webseite.
Kopieren Sie einen Code für den <head>
Abschnitt und fügen Sie in Ihr Template ein.
<!-- HEAD -->
<link rel="stylesheet" type="text/css" href="pfad-zu/pw-survey/styles/uikit.min.css">
<link rel="stylesheet" type="text/css" href="pfad-zu/pw-survey/styles/main.css">
<!-- /HEAD -->
Kopieren Sie dann den nachfolgenden Code für den <body>
Abschnitt und fügen Sie diesen in Ihr Template vor dem schließenden Body-Tag </body>
ein:
<!-- JS FILES -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="js/uikit.min.js"></script>
<script src="js/uikit-icons.min.js"></script>
<script>
var pwq_config = {
url: 'pw/site/templates/scripts/pw-query.min.js',
queryId: 1015
};
(function() {
var d = document, s = d.createElement('script');
s.src = pwq_config.url;
(d.head || d.body).appendChild(s);
})();
</script>
<noscript>JavaScript must be enabled to use <a href="#">PW-Survey</a>.</noscript>
<!-- /JS FILES -->
Bitte beachten Sie, dass Sie unbedingt den Dateipfad zwischen dem Dokument, in dem Sie das PW-Survey einbinden möchten,
und dem Skript, dass sich in dem Verzeichnis /pw-survey/pw/site/templates/scripts/
befindet, bei der Option
url:
eingeben müssen.
Als nächstes fügen Sie ein <div> Tag mit einem query
id-Attribut irgendwo in Ihr Template ein. Dies sollte der Ort sein, an dem Sie Ihr PW-Survey anzeigen wollen:
<div id="query"></div>
Im Frontend von PW-Survey kommt das Framework UIkit zum Einsatz. Wenn Sie die auf der Demoseite vorhandenen Styles und Effekte beibehalten möchten, fügen Sie zusätzlich folgende CSS-Klassen Ihrem <div> Element hinzu:
<div id="query" class="uk-card uk-card-default uk-animation-scale-up"></div>
Wenn Sie anstelle von UIkit Ihr eigenes CSS für PW-Survey verwenden möchten, können Sie die Einbindung von UIkit-CSS- bzw. dazugehörigen JavaScript-Dateien weglassen.
Für den Einsatz von PW-Survey benötigen Sie außerdem jQuery auf Ihrer Website. Falls Sie noch keine jQuery-Bibliothek verwenden, kopieren Sie sich bitte folgendes Schnipsel und fügen Sie dieses auf der Website ein, auf der Sie Ihr PW-Survey einbinden möchten:
<!-- JS FILES -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
...
Ein vollständiges Beispiel für das Einbinden des PW-Surveys finden Sie in Ihrer /pw-survey/index.php
Datei.
Auf folgenden Seiten finden Sie die Hilfe zur PW-Survey - Installation und Administration