Neues Design! Dank den brillanten Tutorials von Copy Paste Love!




Ich hatte mir ja vorgenommen an meinem Design zu arbeiten, einen eigenen Stil herauszuarbeiten und die Seite etwas einheitlicher gestalten. Das ist doch schneller passiert als ich dachte. Eigentlich wollte ich anfangs nur meinen Hintergrund ändern... Doch irgendwie bin ich dann in dem Meer aus Html und CSS Codes versunken. Und BUMM es ist passiert. 

Naja und da ich das Gepuzzle auf eine gewisse Art liebe, habe ich auch noch eine wirklich geniale Seite gefunden die ich jedem nahelegen kann. Egal ob absolute Anfänger die eigentlich nichts mit Html und CSS anfangen können, oder Leute die schon etwas Ahnung haben. Die Seite Copy Paste Love ist das genialste was ich bisher gesehen habe. Unter dem Namen Copy Paste Love verbergen sich mehrere Autoren die wirklich brauchbare und detaillierte Tutorials schreiben. Von kleineren Schönheitskorrekturen bis zu ausgefallenen Ideen, hier habe ich alles Mögliche gefunden. Ich würde am liebsten alles einbauen. Auf der Seite finden sich auch einige Freebies, ganze Blogdesigns oder hübsche Header.
 
  
  • Im Grunde habe ich erstmal den Blog und die Sidebar im Vorlageneditor etwas verbreitert.
  • Dann habe ich die verwendeten Schriftarten nochmal überarbeitet und mich für etwas dezentere, angenehmere Schriftarten entschieden.
  • Mein erstellter Hintergrund ließ sich per Vorlageneditor leider nicht kacheln, dank Copy Paste Love und etwas Coding kein Problem.
  • Im Anschluss noch das Farbschema und die Schriftfarben angepasst.
  • Zudem habe ich dann noch ein paar überflüssige Links (Attribution und PostAtom-Dingends) entfernt. 
  • Etwas zeitraubender war die Umformatierung des Datums  im Code. Zuerst das Datum per Html umformatiert und mit CSS direkt am Blog ausgerichtet und das Fähnchen verpasst. Perfekt.
  • Die "Ältere Posts/Neuere Posts" Links habe ich umgeschrieben und kleine Herzchen hinzugefügt.
  • Im Layout habe ich ein paar Widgets (Beliebte Posts, Labelcloud, Bloglist) hinzugefügt.
  • Das "Über mich" Widget habe ich entfernt und durch eine Grafik ersetzt und verlinkt.
  • Darunter habe ich ein paar hübsche Social Media Buttons eingefügt und verlinkt. Die passende Facebook Seite folgt noch.
  • Anfangs habe ich auch alle Sidebartitel im Code entfernt, sie jedoch hinterher wieder eingefügt. 
  • Desweiteren wollte ich meine Bilder mit jquery schützen, doch im Anschluss funktionierten meine Bildlinks nicht mehr. Da ich keine direkte Lösung fand - wieder verworfen.
Was noch folgen wird:
  • BlogConnect und BlogLovin Button wird noch erstellt und hinzugefügt.
  • Facebook Fanpage wird noch erstellt und verlinkt.
  • Eine neue Headergrafik werde ich in Zukunft noch erstellen, das wird jedoch mehr Zeit in Anspruch nehmen da ich erst noch die passenden Bilder aufnehmen muss.
  • Und aus irgendeinem Grund möchte ich meine Signatur erneuern. Sie passt nicht mehr wirklich. 


Die meisten Tutorials waren problemlos auf mein Design anwendbar und Schritt für Schritt erklärt. Ich kann den Blog absolut weiter empfehlen. 
Das einzige Problem was manchmal auftreten kann ist das man eine bestimmte Stelle im Code finden muss. Dafür gibt es aber die brillante Suchfunktion des Html Editors. Diesen ruft man mit Strg + F auf. Nur ist es mir selbst ab und an mal passiert das ich, ohne es zu merken, die Suchfunktion des Browsers benutzt habe, die natürlich nichts findet. Das merkt man kaum. Wie man das vermeidet? Der Cursor (das blinkende I) muss sich innerhalb des Codes befinden bevor man Strg + F drückt. Also einmal in den Code klicken und dann kann's los gehen. Hier der passende Beitrag von Copy Paste Love.

Wenn der Header fertig ist, stelle ich nochmal mein altes und neues Design gegenüber.

Keine Kommentare :

Kommentar veröffentlichen