Sylinchen's Blog

Sep 7, 2011 12:16 PM


Abschnitt 1.
Als erstes müssen wir uns für unsere Animeliste eine Style ID erstellen.
Hierzu geht ihr auf oben auf Profile --> Panel - Edit --> My List Style--> Advanced Style CSS Editor und erstellt euch eine Style ID.
Habt ihr euch nun eine Style ID erstellt, geht ihr nochmals oben auf My List Style und wählt dieses mal Change My List Style aus.
Nun solltet ihr eure erstellte Style ID für eine der beiden Listen auswählen.
Geht nun wieder zurück auf euren Advanced Style CSS Editor und wählt eure erstellte Style ID aus. Den Code der schon in eurer Style ID vorhanden ist könnt ihr einfach aus dem Editor löschen.


Abschnitt 2.
Als nächstes ladet ihr euch meine vorerstellte Animeliste runter, falls ihr dies noch nicht getan habt: Downloade mich!
Entpackt die Zip Datei auf euren Rechner, ihr solltet 2 Ordner (mit vielen Grafikdateien) und 2 zusätzliche Dateien auf euren Rechner finden:
animelist
mangalist
css.txt
logopsd.psd

Die PSD-Datei ist für euch erstmal nicht von Bedeutung und wird ausschließlich für Teil 2 meines Tutorials benötigt.

Ladet einen der beiden Ordner auf euren Webspace (je nachdem ob ihr eure Anime oder Mangaliste verändern wollt). Solltet ihr noch keinen Webspace besitzen, könnt ihr euch natürlich bei einem kostenlosen Anbieter Anmelden wie zum Beispiel tinypic.com.

Hinweis: Falls ihr Photobucket.com nehmt, werdert ihr Probleme mit der bg.png bekommen, da diese Datei zu groß für Photobucket ist und der Anbieter dieses Bild somit resized/verkleinert. Daher empfehle ich euch für diese Datei auf jeden Fall tinypic oder imagehack.us zu nehmen.


Abschnitt 3.
Als letztes öffnen wir nun die css.txt zum Beispiel mit den normalen Windows Editor. Ich selber benutze PSPad.

Ihr solltet nun diesen lustigen Code sehen, in dem viele Beispiel URLs drinnen sind (z.B.: http://www.deineurl.de/animelist/bg.png):

Passt nun einfach den Pfad/die URLs zu euren Bildern an (ingesamt 16 Verlinkungen).
Zum Beispiel: http://www.deineurl.de/animelist/ende.png in http://www.tinypic.com/animelist/ende.png

Wenn ihr euch natürlich für die Mangaliste entschieden habt, verändert ihr auch noch das "animelist" in "mangalist" --> http://www.tinypic.com/mangalist/ende.png

Da ihr mehrere Logos hochgeladen habt, könnt ihr da auch ein anderes auswählen. Zum Beispiel anstatt http://www.deineurl.de/animelist/logo.png einfach http://www.deineurl.de/animelist/logo3.png hineinschreiben, schon habt ihr ein anderes Logo.

Nachdem ihr nun die ganzen Pfade editiert habt, kopiert ihr euch den Code und fügt ihn nun in eure Style ID (wo ihr vorher den Code rausgelöscht habt) ein und klickt auf den Button Update CSS.

Habt ihr alles richtig gemacht und MAL laggt nicht mal wieder, seid ihr nun fertig und eure Liste sollte ca. so (je nachdem welches Logo und Liste) aussehen: Klick mich!

Hinweis: Wenn ihr das Problem haben solltet, nach dem Editieren eures Styles eure aktuellen Änderungen nicht im Editor zu sehen dann ladet den Editor einfach neu, dann sind sie sichtbar. Geht nicht einfach im aktuellen Feld weiter, sonst gehen die Änderungen verloren!


Wenn ihr sonst noch Fragen habt schreibt mir einfach Hier


Weiter zum zweiten Teil -->
Posted by Sylinchen | Sep 7, 2011 12:16 PM | Add a comment
It’s time to ditch the text file.
Keep track of your anime easily by creating your own list.
Sign Up Login