10 September 2015

HTML / CSS Tricks auf Einwortsatz




Hallo Leute, 
da ich jetzt ein/zwei mal darauf angesprochen wurde, wie ich denn das Layout für Einwortsatz mit dem Vorlagen-Designer so hin bekommen habe, möchte ich euch hier meine verwendeten HTML / CSS Tricks zeigen. Zunächst einmal muss ich sagen, dass ich eigentlich ein großer Freund von Blogger bin. Das Dashboard vereinfacht die Nutzung ungemein und ermöglicht somit jedem das schreiben seines eigenen Blogs. Auch die Statistiken sind ganz interessant. Lediglich bei den Designs und Vorlagen gibt es meiner Meinung nach noch Mankos, wobei man diese oftmals mit ein paar HTML/CSS Kniffen umgehen kann. Immerhin sind sie ja so freundlich uns bieten "HTML bearbeiten" unter den Vorlagen an. 


Transparenter Blogtitel, der Header
Den Einwortsatz Titel hatte ich bereits erstellt und als web optimiertes png abgespeichert. Header upload. Im Vorlagen Designer hatte ich einen weißen Haupthintergrund, transparenz im äußeren Hintergrund und transparenz im Header- Hintergrund eingestellt. Unter  Blog-Titel hatte ich ebenfalls "transparent" angegeben, doch es klappte nicht. Jedes mal (ich bin mir nicht mehr ganz sicher) aber ich glaube wenn ich den Haupthintergrund ändern wollte, änderte sich automatisch der Header mit. Deshalb beschloss ich das händisch zu übernehmen, und verschob die Navigationsleiste und den Header in HTML nach oben. 
1.  content <...>
2.  Header
<...>
3.  tabs-outer <...>
4.  content-outer <...>


Im Layout sieht das ganze dann etwas verschoben aus.


Schlussendlich habe ich dann in allen Vorlageneinstellungen die Hintergrundoptionen auf transparent gelassen.





Background, leicht durchlässig

Mittels dieser CSS-Zeile:



.colum-center-inner{background-color:rgba(255,255,255,0.9)[...]}



 

Das Hintergrundbild ist aus meiner Reihe der Oberflächen und Strukturen.


Sticky-Navigationsleiste mittels JQuery 


Da ich nicht wollte, dass die Navigationsleiste unter dem oberen Browserfenster beim scrollen verschwindet, habe ich mittels JQuery das Sticky Nav erstellt. Zuerst habe ich das Script ( bei mir über den ajax.googleapis) eingebunden und danach den Code im Headbereich eingefügt.



Im CSS Bereich kann man das ganze dann noch nach belieben anpassen.

So das war dann im großen und ganzen erstmal alles. Bei Fragen-Melden unter einwortsatz@gmail.com


eure Julia :) 



03 September 2015

Relaunch

Hoppa, la Hopp, renn, spring, stolper und da sind wir wieder.  Genau genommen sogar immer noch. Ganz genau genommen sogar schon seit 1159 Tagen. Seit dem 1 Juli 2012. Also schon ein ganz schönes Stück, mit mittlerweile insgesamt 27.017 Seitenaufrufen, was für uns als Gelegentliche-Hobby-Blogger schon ziemlich schmeichelnd ist. Danke hierfür.


An diesen 27.017 Aufrufen möchten wir jetzt weitermachen und passend zu dieser Gelegenheit haben wir Einwortsatz einen neuen, individuelleren Look verpasst. Wir hoffen, dass dieser Gefällt und Anmerkungen/Tipps hierzu auch gegenüber uns geäußert werden.

Warum wir nach dieser ca. 10 Monatigen Pause wieder weitermachen wollen? 
Zum einen, weil Julia als angehende Designerin es nicht mehr weiter aushielt den Weblog in der vorigen Verfassung zu sehen und zum anderen aus den schon bekannten unerklärlichen Gründen wie bislang. Spaß vielleicht. Aus dem Gefühl heraus einfach schreiben zu wollen. Sich nicht aus den Augen zu verlieren. Die eigene Kreativität auszuleben, (Wobei das bei Julia durch ihr Studium eher überhand nimmt uns sie sich eher nach Rationalität sehnt - also nicht wundern, falls mal irgendwelche Sachlichen Texte hier erscheinen...). 

Also weiterhin immer mal wieder reinschauen lohnt sich (wieder ;) )... 

Eure zwei Hampelhasen,
Fenja und Julia