Benutzerdefiniertes CSS

Mit einem Theme können Personen ohne Programmierkenntnisse durch eine einfache Konfiguration Abstimmungen, Umfragen und Fotowettbewerbe im eigenen Design erstellen. Über das Kontextmenü der Themes können zudem eigene CSS (Cascading Style Sheets) Definitionen angelegt werden. Damit können Elemente Deiner PollUnit ausgewählt und deren Präsentation gesteuert werden – ganz individuell, ganz nach Deinen Bedürfnissen.

Diese Funktionalität richtet sich an Personen mit Erfahrungen in HTML und CSS. Sagt Dir das nichts, solltest Du Dich von einem Experten beraten lassen.

Buttons anpassen

Folgendes Beispiel zeigt wie Du mit Hilfe von nur wenigen Zeilen Code die Darstellung aller Buttons anpassen kannst. Die Button-Elemente werden selektiert, zu einer Pillenform abgerundet und erhalten eine schattenartige Kontur.

.btn {
  border-radius: 9999px;
  border-bottom: 4px solid black;
}

Eigene Inhalte und CSS pro Sprache

Die Möglichkeiten von CSS gehen aber noch viel weiter. Das nächste Beispiel zeigt wie Inhalte lokalisiert, also pro Sprache, geändert werden können. Hier wird der Button zum hinzufügen von neuen Optionen bzw. Bildern selektiert, angepasst und dann mit neuem Inhalt gefüllt.

#ccss-userActionBox .btn {
  text-indent: -9999px;
  line-height: 0;
}

#ccss-userActionBox .btn::after {
  text-indent: 0;
  display: block;
  line-height: initial;
}

html[lang=en] #ccss-userActionBox .btn::after {
  content: 'Localized button text';
}

html[lang=de] #ccss-userActionBox .btn::after {
  content: 'Lokalisierter Buttontext';
}

Eigene Schriftarten

Du kannst per CSS auch Deine eigenen Schriftarten / Fonts verwenden. Hierbei solltest Du darauf achten, dass Dein Server »pollunit.com« in den CORS Headers erlaubt.

@font-face {
  font-family: 'Amatic';
  font-style: normal;
  font-weight: 200;
  src: url(https:/myhost.com/amatic.woff);
}

h1 {
  font-family: 'Amatic' !important;
  font-weight: 200;
}