Wofür nutze ich den Menüpunkt „CSS“?

Jeder Fragebogen, den Sie im Umfrage-Tool LamaPoll anlegen, beinhaltet den Menüpunkt „CSS“. Sie finden den Bereich direkt unterhalb der Fragebogen-Navigation und zwischen den Menüpunkten „Design“, „Farben“ und „Validierung“ (siehe Abbildung 1).

CSS steht dabei für „Cascading Style Sheets“ – eine Programmiersprache, die Ihnen Design-Anpassungen innerhalb elektronischer Dokumente ermöglicht. Um die gewünschte Design-Änderung auszuführen, brauchen Sie konkrete CSS-Anweisungen. So lassen sich beispielsweise mit CSS-Befehlen Farben verändern, Weiter-Buttons entfernen, Abstände anpassen oder auch Texte zentrieren. Eine Übersicht, mit allen relevanten Codes für Ihre LamaPoll-Umfrage, finden Sie hier: Design-Funktionen CSS-Befehle

CSS-Befehle einbinden – so geht’s

CSS-Befehle werden, wie in Abbildung 1 gezeigt, über den entsprechenden Menüpunkt eingebunden. Nach einem Klick öffnet sich ein Fenster, in das Sie den Befehl Ihrer Wahl eingeben oder kopieren und anschließend abspeichern (siehe Abbildung 2).

Befehle, die Sie auf diese Weise einbinden, gelten automatisch für die komplette Umfrage. Wollen Sie beispielsweise Text rechtsbündig ausrichten (siehe Abbildung 4), werden sämtliche Texte rechtsbündig dargestellt.

Es gibt jedoch auch die Möglichkeit, CSS-Befehle auf ganz bestimmte Fragen zu beschränken. Dazu benötigen Sie zusätzlich zum CSS-Befehl die ID der betreffenden Fragen. Diese Fragen-ID finden Sie bei jedem Element nach einem Klick auf das Bleistift-Symbol (siehe Abbildung 3).

Was Sie außerdem noch bei der Verwendung von CSS-Codes für einzelne Fragen beachten müssen, zeigen wir Ihnen hier: Einzelne Fragen individuell mit CSS-Codes anpassen

Beispiele für nützliche CSS-Befehle

• Texte rechtsbündig ausrichten: Dieser Befehl richtet sämtliche Inhalte rechtsbündig aus.

.poll{ text-align:right!important; }

• Spalten einer Matrixfrage einfärben: Die Farbcodes der jeweiligen Spalte können individuell angepasst werden.

.matrix-question .choice-cell:nth-child(2) {
background:#7ce696
}

.matrix-question .col-head:nth-child(2) {
background:#7ce696 !important
}

.matrix-question .choice-cell:nth-child(3) {
background:#d5ebdb
}

.matrix-question .col-head:nth-child(3) {
background:#d5ebdb !important
}

.matrix-question .choice-cell:nth-child(4) {
background:#cee6f2
}

.matrix-question .col-head:nth-child(4) {
background:#cee6f2 !important
}

.matrix-question .choice-cell:nth-child(5) {
background:#e6cd8e
}

.matrix-question .col-head:nth-child(5) {
background:#e6cd8e !important
}

.matrix-question .choice-cell:nth-child(6) {
background:#f76f6f
}

.matrix-question .col-head:nth-child(6) {
background:#f76f6f !important
}

• Bestimmte Fragen zentrieren: Für diesen Befehl benötigen Sie die ID der Frage, die Sie zentrieren wollen. Klicken Sie dazu auf „Bearbeiten“ bzw. auf das Bleistift-Symbol. Die ID befindet sich direkt in der Überschrift. Kopieren Sie die Ziffern und ersetzen damit den Part „Nummer/ID“ des CSS-Codes.

.poll #question_NUMMER/ID .choice-question{ text-align:center }