In meinem vorherigen Tutorial habe ich euch bereits gezeigt, wie ihr die Grafikbuttons mit CSS-Buttons ersetzt. Ihr könnt die normalen Buttons wie „Antwort absenden“, „Beitragsvorschau“ etc. aber natürlich auch mit explizit formatieren, damit sie nicht mehr wie normale Standardbutton aussehen. Das gleiche habe ich bei meinem Dragon Nest Template auch gemacht.
Standardbutton
Beispiel mit CSS-Formatierung
Formatieren der Buttons
Um die Buttons zu formatieren muss man die global.css des Templates bearbeiten, das verwendet wird. Dies ist im Admin-CP unter „Templates & Styles > Themes > Euer Theme > global.css > Stylesheet bearbeiten: Fortgeschrittene Methode“ möglich.
Dort müssen die folgenden Klassen deklariert werden:
input.button{}
input.button:hover{}
input.button:active{}
Eventuell sind diese auch schon in der global.css angegeben, also sucht einfach mal danach. Ansonsten legt sie einfach neu an. Ihr könnt die Buttons ganz nach eurem Geschmack gestalten. Auch hier kann euch der CSS-Buttongenerator gute Dienste leisten.
Es ist übrigens empfehlenswert cursor:pointer; mit anzugeben in der Dekleration.
