Hallo liebe Expertinnen und Experten!

Ich habe eine Frage bezüglich der Willkommensseite und leider keine Antwort gefunden. Ist es möglich, den Weiter-Button unten auf der Willkommensseite weiter nach oben zu verschieben und größer zu machen? Er ist leider recht versteckt und meiner Meinung nach schwer zu "finden", siehe Anhang.

Vielen Dank schon einmal!

Hallo,
anscheinend ist es wohl so, dass die Studienbeschreibung und/oder der Willkommenstext so lang sind, das der Teilnehmer scrollen muss, um den "Weiter"-Button zu sehen.
Mit Recht nimmst Du wohl an, dass keiner sich den Text wirklich durchliest, und daher den Button nicht findet.
Farblich ist er doch recht gut hervorgehoben (wobei ich nicht weiß, ob Ihr ein eigenes Theme benutzt). In "fruity" hat er eben die Farbe der Variante, die man in den Designvorlage-Optionen gewählt hat.

Gut, um den Button auf der Willkommensseite an eine andere Stelle zu rücken, genügt zunächst einmal (im erweiterten Theme)
diese Zeile der "firstpage.twig"
{{ include('./subviews/navigation/navigator.twig') }}
an eine andere Stelle zu verschieben, z.B. unter den Language Changer.

Wenn der Button nun auch noch eine andere Größe oder Farbe bekommen soll, muss man anstelle dieses "includes" den Code der "navigator.twig" dorthin kopieren.
Ich habe hier einmal folgende Änderungen eingebaut
1.  <div class="{{ aSurveyInfo.class.navigatorbuttonl }} col-xs-4 col-xs-offset-4" {{ aSurveyInfo.attr.navigatorbuttonl }}> anstelle col-xs-6
2. <button {{ aSurveyInfo.attr.navigatorbuttonnext }} accesskey="n" class=" {{ aNavigator.disabled }} {{ aSurveyInfo.class.navigatorbuttonnext }} btn btn-lg btn-block btn-danger " > anstelle von  btn btn-lg btn-default 

Genaueres darüber kannst Du hier nachlesen
[url] getbootstrap.com/docs/3.4/css/#buttons [/url]

Dann gibt es so etwas
(Störe Dich nicht am Text und der Kopfzeile; dies stammt aus einem anderen Beitrag zum Forum. Ich habe es nur schnell angepasst, dass der Button oben ist)
 

Joffm

Hallo! Danke für die schnelle Antwort, das hilft mir weiter. Nur eine kleine (etwas peinliche) Frage: Wie komme ich denn zum erweiterten Theme? Ich habe leider unter Design-Vorlage Optionen nur "Einfache Optionen" zur Verfügung.

Vielen Dank!

Anmerkung: Ich habe es gefunden. Wir benutzen aber in unserem Institut alle das gleiche Template. Ich würde die Änderung natürlich gerne nur bei mir anpassen, um den anderen das Layout nicht zu versauen. Gibt es keine Möglichkeit, das nur bei meiner Umfrage anzupassen?

Du kannst natürlich ganz einfach einen bootstrap-Button in den Text einbauen.
 

Z.B.
<button class="btn btn-lg btn-danger btn-block" type="submit">Weiter</button>

Ich hoffe, Du hast ein bisschen in bootstrap hineingeschnuppert. "css / Grid System" und "css / Buttons".
Dann kannst Du ihn nach Deinen Wünschen layouten.

Joffm

Hallo Joffm, danke für die Antwort. Ich verstehe nur nicht, wie der Button dann zur nächsten Seite weiterleitet. Der "Link" beim weiterklicken von der Willkommensseite zur ersten Seite der Umfrage verändert sich ja nicht, deswegen kann ich ja auch keinen Link einbauen? Könntest du mir da nochmal helfen? Vielen Dank!
Das Layout ist an sich nicht so wichtig, sondern dass der Button einfach besser und damit weiter oben sichtbar ist, weil wir einfach befürchten, dass die Leute ihn übersehen und die Umfrage eher schließen, wenn sie ihn suchen müssen... 

Hast Du es ausprobiert?

Erklärung: der Button ist vom Typ "Submit".
Es gibt drei Typen von Buttons wie hier erklärt wird.
[url] www.w3schools.com/TAGs/att_button_type.asp [/url]

1. "button": Der macht nix, gar nix, solange man ihm nichts sagt, z.B. einen javascript-Event "onClick" anhängt.
2. "reset": Dieser Button löscht alle eingegebenen Daten im Formular.
3. "submit": Dieser schickt die Daten des Formulars an den Server, und zwar an die Seite, die in der Form angegeben ist.

Wenn Du Dir den Quellcode der Seite einmal im Browser aufrufst, siehst Du irgendwo so etwas

<!-- Start of the main Form-->
<form id="limesurvey" name="limesurvey" autocomplete="off" class="survey-form-container form" action="/lime3/index.php/268349" method="post">

D.h. in dem Moment, in dem man auf einen Button vom Typ "submit" klickt, werden die Daten als mit der Methode POST an die Seite, die in "action" genannt ist, geschickt.
POST ist eine Methode, die die Daten unsichtbar übermittelt, im Gegensatz zu GET.
GET kennst Du sicherlich, wenn Du im Handbuch einmal über "url-Felder", "start-url", "end-url" gelesen hast.
Das sind die Daten, die an die url mittels "?" und "&" angehängt werden, also sichtbar sind.

Desweiteren würde dann eine leichte Einführung in php zu empfehlen.

Und als Letztes.
Ich hatte ja schon einmal gesagt, wenn auf der Seite so viel steht, dass der Button "gesucht" werden muss, ist sie einfach schlecht designed.
Lies einmal dieses pdf , was Dennis Sewberath (war hier früher ebenfalls sehr aktiv) sagt.
 

Statt alles auf die erste Seite zu packen, was ja keiner lesen will und wird, stückele es in Häppchen auf (Seiten vom Typ "Textanzeige") oder füge einfach einen Link mit weiteren Informationen ein "für den interessierten Leser"

Joffm

Hallo Joffm,

danke für deine Geduld. Ich habe nicht viel Text (s. Screenshot). Jedoch fände ich es einfach schöner, wenn der Weiter Button vor den Kontaktdaten stehen würde, statt ganz unten in der Ecke, zumal LimeSurvey ja noch diese Informationen einfügt, wenn die Umfrage anonym ist und der Button dann noch weiter nach unten rutscht.
Ich habe dein Skript eingefügt und der Button erscheint auch. Wenn man ihn anklickt geht es aber nicht weiter, sondern ich werde wieder auf die Willkommensseite geleitet. 
Bitte entschuldige, es ist schwer für mich, weil ich vorher noch nichts mit HTML und CSS am Hut hatte, aber vielleicht finde ich auch jemanden in meinem Umfeld, der oder die sich damit auskennt!

Viele Grüße

Hallo,
ich habe gerade bemerkt, dass das Theme, welches ich für das Beispiel benutzt habe, noch ein bisschen aufgebohrt war.
In einem Standard-Theme geht es also so nicht.

Aber schauen wir einmal.

Joffm

 

Aber dann eben so.
Etwas "Von hinten durch die Brust ins Auge"

Wir nehmen einen "normalen" Button (type="button")
Einen "großen" (btn-lg) in der Farbe "primary".
Jetzt kommt der Trick. Beim Klick auf den Button wird eine Funktion aufgerufen (ichhabe sie hier "doWeiter()" genannt.
<button type="button" class="btn btn-lg btn-primary" onclick="doWeiter()">Weiter</button>

Diese Funktion wird nun definiert  Sieht nicht besonders aus, ist es auch nicht.
Diese Funktion simuliert nur den Klick auf den originalen "Weiter"-Button.

Außerdem willst Du diesen ja wohl nicht auch noch anzeigen.
Daher verstecken wir ihn mit
Beachte: Dieser Button bringt keine Fehlermeldung, wenn die Datenschutz-Box nicht angeklickt wurde. Es geht dann einfach nicht weiter.
Aber ich glaube, bei Dir ist sowieso keine, oder?

 

Joffm

Nur, weil es bisher noch nicht geschrieben wurde:
Solche script, werden jn den Text einefügt (hier also der "Willkommenstext"), und zwar im "Quellcode-Modus".

Und dann ist beim zweiten script das abschließende
</script>
nicht mitkopiert worden.
Dass muss noch dazu.

Jetzt kommt noch ein Pferdefuß.
Wenn Du keine Rechte hast, solche scripte einzufügen (sieht man daran, dass es mehr oder weniger wieder verschwindet beim "Speichern"), musst Du mit dem admin sprechen.

Sonst habe ich keine Idee mehr dazu.

Joffm

Hallo Joffm!

Danke nochmal für die Antwort! Ich habe es jetzt doch wie du es im ersten Beitrag vorgeschlagen hast direkt in der Layoutvorlage verschoben. Jetzt ist der Button zumindest über dem "Dies ist eine anonyme Umfrage"-Kasten! Ich werde nochmal mit meinen Kolleginnen und Kollegen sprechen und im Notfall nochmal deine letzte Variante ausprobieren um zu schauen, was mir besser gefällt! So hat es jetzt aber erstmal geklappt und der Weiterbutton klebt nicht als letztes ganz unten auf der Seite! Vielen Dank für die ausführliche Hilfe!