SchuelerVZ Theme

In meinem Artikel "SchuelerVZ gestalten" habe ich geschrieben, wie man bei SchuelerVz die Farben verändern und die Werbung entfernen kann indem man sich Stylish als Add-On für Firefox installiert. In diesem Artikel zeige ich, wie einfach man sich sein eigenes Design gestalten kann.

Alles was man dazu braucht ist Firefox, etwas Zeit und Geduld.

Zu Beginn müssen wir eine neue Styledatei erstellen, dazu gehen wir auf SchuelerVZ.net, klicken dann unten rechts auf das Stylish-Icon und wählen "Stil erstellen --> für SchuelerVZ.net" aus.

Dann öffnet sich ein neues Fenster und wir können loslegen.

Als Titel geben wir "SchuelerVZ Monstertheme" ein und dann geht es weiter. Damit wir überhaupt wissen, welche Einstellungen wir ändern müssen brauchen wir erstmal das orginal Stylesheet von SchuelerVZ, das kann man sich unter http://static.pe.schuelervz.net/20081217-0/Css/Default.css ansehen und rauskopieren.

Kopieren wir es uns also in das Fenster von Stylish (zwischen die zwei geschweiften Klammern!!) und schon können wir anfangen den Stil zu gestalten.

Wir beginnen mit dem Hintergrund, der ist jetzt weiß und ich will ihn in meinem Grau, dazu müssen wir natürlich wissen, welchen Hex-Code unser Garu hat. Das können wir über dieses Toll rausfinden: http://wellstyled.com/tools/colorscheme2/index-en.html

Ich suche mir also eine schöne Farbe aus und kopiere mir den Code.

Diesen Code schreibe ich jetzt in das Stylishfenster hinter die Eigenschaft von Body anstatt von #fff

Jetzt klicke ich auf "Speichern" und schau mir auf der Seite SchuelerVZ.net an, was ich geändert habe.

Wie man sieht hat sich nichts geändert, hinter jeden Wert und jede Eigenschaft, die man ändert muss man !important schreiben, damit sie wirksam wird. Es muss also stehen: body {backgorund: #353535 !important;...

Nach diesem Prinzip musst du das gesammte Stylesheet durchgehen und dann hast du hoffentlich ei SchuelerVZ, dass genau an deine Wünsche angepasst ist.

Wenn du z.B. noch die Werbung entfernen willst, dann musst du die Conatiner, die Werbung enthalten mit den Eigenschaften display:none und position: absolute versehen. Am besten kannst du dein eigenes Design basteln, wenn du CSS beherrschst. CSS kannst du z.B. hier lernen: http://de.html.net/tutorials/css/