Entries tagged as template

02 Nov 2009 s9y mit jQuery zurechtbiegen

Wie ich bereits erwähnte, benutze ich im neuen Template YL 104 erstmals die Javascript-Bibliothek jQuery.

Neben einfachen Effekten wie dem Ein- und Ausblenden bestimmter Abschnitte oder der Vergrößerung von Grafiken setze ich jQuery stellenweise auch ein, um das DOM zu verbiegen. Stark vereinfacht gesagt kann man so mittels jQuery von s9y oder seinen Plugins generierten (X)HTML-Code verändern, ohne ihn im Kern oder Plugin bearbeiten zu müssen – natürlich nur für Besucher, die Javascript im Browser aktiviert haben.

Wofür genau setze ich das ein und warum?

Read more →

31 Oct 2009 s9y-Admin-Template: Freiwillige Beta-Tester vor

Der eine oder andere wird es vielleicht bereits auf twitter mitbekommen haben oder die Vorschau gesehen haben: Ich habe mal wieder einen Versuch unternommen, ein alternatives Template für die s9y-Verwaltungsoberfläche zu gestalten. Keine besonders schöne Aufgabe eigentlich, da man im Backend normalerweise kaum Einfluss auf den ausgegebenen (X)HTML-Code hat und somit ziemlich mit CSS tricksen muss, um zum gewünschten Ergebnis zu kommen. In diesem Fall spielt zudem auch noch mein neuer Freund jQuery mit und wertet das Dropdown-Menü ein wenig auf.

Was ich jetzt brauchen könnte, ist Feedback. Also brauche ich Beta-Tester, die die Betaversion des Admin-Templates testen – neben generellen Meinungen wäre vor allem interessant, ob die Ausgabe der Bereiche, die (selten, lies: nicht von mir verwendete) Plugins im Backend zusätzlich erzeugen, eventuell „merkwürdig“ aussieht. Auch Browserprobleme, speziell im IE, nehme ich derzeit mit Kusshand entgegen, zu einem gründlichen Crossbrowser-Test bin ich nämlich auch noch nicht gekommen. Rückmeldungen per Email, twitter oder Instant Messenger. Eine kurze „Anmeldung“ zum Betatest in den Kommentaren wäre nett.

Ach so: Installation. Downloaden, ZIP-Datei entpacken und den enthaltenen Ordner admin/ in Euer Template-Verzeichnis entpacken. Dabei ggf. vorhandenes admin/ unbedingt sichern – das Ding hier ist bestenfalls halb- bis dreiviertelfertig! Das wollt ihr noch nicht dauerhaft benutzen …

20 Oct 2009 jQuery-Spielkram in YL104

Wie bereits angedeutet habe ich im neuen Template die Javascript-Bibliothek jQuery eingebunden, um ein paar kleine Spielerei und Effekte einbauen zu können. Obschon man heutzutage wohl davon ausgehen kann, dass in den meisten Browsern JS aktiv ist, sind diese Teile komplett so angelegt, dass das Template auch ohne diese Funktionalitäten „benutzbar“ bleibt – jQuery ist quasi der „Zuckerguß“.

Effekte

Da wäre zum einen die kleine Infobox im Kopfbereich, welche mit einem Fade-In-Effekt dargestellt wird, wenn man mit der Maus über das Logo fährt. Analog wird die Infobox übrigens dargestellt, wenn der Link um das Logo per Tastatur fokussiert wird.

Ähnliches gilt für die Hinweise zum Kommentieren, welche nun erst eingeblendet werden, wenn man den Link im Text „Bitte die Hinweise beachten.“ über dem Kommentarformular klickt. Beides sind Informationen, die eigentlich niemand zweimal liest, daher sind sie prädestiniert für solche show/hide-Effekte.

Statt Lightbox

Diesen Effekt wollte ich zunächst gar nicht integrieren, musste aber dann feststellen, dass sich das Lightbox-Plugin für s9y offenbar nicht mit der eingebundenen jQuery-Bibliothek verträgt. Kein Problem, denn natürlich gibt es Lightbox-Klone in jQuery.

Stadtpark

Die größere Ansicht des Bildes links wird nun über Fancybox angezeigt – nicht über das Lightbox-Plugin, der Code für Fancybox ist in dieses Template integriert.

Darüber hinaus habe ich noch ein paar Codekorrekturen (man nennt das „DOM-Manipulation“) mittels jQuery vorgenommen, die ich mir jedoch für einen seperaten Eintrag aufheben möchte, zumal es dort noch weitere Änderungen geben könnte und die bereits eingebauten etwas umfangreichere Erklärungen benötigen.

19 Oct 2009 Anschauungsmaterial

Kaum war das neue Template online, das bekam ich auch schon die erste Anfrage, ob ich es denn veröffentlichen würde. Die Antwort lautet (diesmal klar und deutlich): Nein. Zumindest nicht, so lange ich es selbst benutze.

Dieses Template ist sehr an meine individuellen Bedürfnisse angepasst. Eine „öffentliche Version“ wäre mit nicht wenig Arbeit verbunden und würde höchstwahrscheinlich nicht so aussehen, wie man es sich wünschen würde – allein schon das Logo im Header …

Aber: Ich hab soeben die letzten drei Templates dieses Blogs auf meiner Template-Seite bereitgestellt.

Allerdings waren davon zumindest die letzten beiden (YL 102 und 103) ebenfalls sehr individuell, sodass diese Templates meines Erachtens maximal als Anschauungs- und Lernmaterial dienen können. Ich bin gespannt, ob und was Ihr daraus macht.

14 Jun 2009 One Room: Submit-Button verschieben

Dirk hätte gern den Submit-Button im Kommentarformular von One Room verschoben. Ich kann den Wunsch nachvollziehen und halte das durchaus auch für eine sinnvolle Verbesserung – werde es aber dennoch in der „offiziellen“ Zip-Datei des Ports nicht umsetzen. Es widerspricht einfach meinem Prinzip, einen Port möglichst originalgetreu umsetzen zu wollen.

Ich gebe Dirk also keinen Fisch, zeige ihm (und allen anderen, die das eventuell auch stört) aber gerne, wie man angelt. Die folgende Anleitung funktioniert übrigens analog auch für das Kontaktformular, Hinweise dazu am Ende.

Read more →