Git für WordPress: Die wichtigsten Kommandos

logo-gitIn diesem Artikel möchte ich Euch die Git-Kommandos vorstellen, die Ihr für die ersten Schritte mit Git braucht. Leider ist Git kein Programm, das man startet und danach passiert alles automatisch. Ihr müsst immer mitdenken. Auch wenn das am Anfang mühsam ist, es lohnt sich. Wenn man sich darauf einlässt, kann man seine Arbeitsabläufe besser strukturieren. Und selbst Monate später auf alte Versionen zurückgreifen.

Git hat noch einen großen Vorteil: Ihr könnt rumspielen und ausprobieren. Git löscht nur auf ausdrücklichen Befehl und auch dann in den seltensten Fällen so, dass man’s nicht mehr rückgängig machen könnte. Also nur Mut!

Im Folgenden wird Befehlszeilen-Syntax zu sehen sein. Auch wenn Euch diese Welt fremd ist und Ihr Euch später dafür entscheidet, ein visuelles Tool zu benutzen – es ist wichtig, sich mit dem vertraut zu machen, was da passiert. Und das geht am Anschaulichsten über den Befehlszeilen-Code.


Dieser Artikel ist Teil einer Reihe.
Bisher sind erschienen/geplant:
1. Git für WordPress – Einstieg
2. Git für WordPress – Hilfe, Befehlszeile!
3. Git für WordPress – Die wichtigsten Kommandos
4. Git für WordPress – Arbeiten mit Branches
5. Git für WordPress – Projekte auf GitHub
6. Git für WordPress – Versionen zusammenführen
7. Git für WordPress – Tools und Tipps


Weiterlesen Git für WordPress: Die wichtigsten Kommandos

Git für WordPress: Hilfe, Befehlszeile!

logo-gitIm ersten Artikel dieser Reihe habe ich die „Denkweise“ von Git beschrieben. Heute geht es um die Befehlszeile – beziehungsweise darum, was die Arbeit damit so schwierig macht. Meiner Erfahrung nach existieren große Berührungsängste gegenüber dem Thema. Ich möchte in diesem Text ein bisschen beleuchten, wo die Ursachen für diese Ängste liegen.  

Je nach Betriebssystem heißt das Programm für die Eingabe von Befehlen im Textmodus Terminal, Konsole oder Command Line.

Die Kommandozeile … ist ein Eingabebereich (interface) für die Steuerung einer Software, der typischerweise (aber nicht zwingend) im Textmodus abläuft.

sagt Wikipedia dazu. Dieser Textmodus hat es in sich.
Weiterlesen Git für WordPress: Hilfe, Befehlszeile!

Git für WordPress – Einstieg

logo-gitIm Laufe der nächsten Wochen möchten wir eine Reihe von Artikeln zum Thema Git veröffentlichen. Wie „tickt“ Git? Unser Eindruck ist, dass vor allem der erste Einstieg vielen schwer fällt. Eine zusätzliche Hürde stellt das verwirrende Vokabular dar. Heute daher erst einmal der Versuch einer Einführung, ganz ohne Befehlszeilen-Chinesisch.

Was ist Git?

Laut Wikipedia ist Git

eine freie Software zur verteilten Versionsverwaltung von Dateien.

Im Klartext: Mit Git kann ich sowohl die Versionen tausender Dateien eines Software-Projekts verwalten, als auch die Versionen meiner letzten Keynote-Präsentation. „Verteilt“ ist in diesem Fall eine etwas verwirrende Übersetzung von „distributed“. Ich entscheide mich lieber für „dezentralisiert“.


Dieser Artikel ist Teil einer Reihe.
Bisher ist geplant:
1. Git für WordPress – Einstieg
2. Git für WordPress – Hilfe, Befehlszeile!
3. Git für WordPress – Die wichtigsten Git-Kommandos
4. Git für WordPress – Arbeiten mit Branches
5. Git für WordPress – Projekte auf GitHub
6. Git für WordPress – Versionen zusammenführen
7. Git für WordPress – Tools und Tipps


Weiterlesen Git für WordPress – Einstieg

Wohin mit dem Code – PlugIn oder functions.php?

Jeder, der eine Webseite mit WordPress betreibt kennt das: Irgendeine Funktion fehlt mal wieder im Theme. Also macht man sich im Web auf die Suche. Nach ein paar Klicks findet man die Lösung in Form eines Codeschnipsels: „Just paste this in your functions.php and you are done.“ Kopieren, einfügen, Problem gelöst.

Alternativ kann man sich im Plugin Directory von wordpress.org umschauen. Hier gibt es Plugins für alle Lebenslagen, es gibt praktisch nichts, was es nicht gibt.

Aber wie macht man’s eigentlich richtig? Die functions.php mit vielen schicken Codeschnipsel anreichern oder doch lieber ein Plugin installieren?
Weiterlesen Wohin mit dem Code – PlugIn oder functions.php?

CSS3 Dropdown-Menü ohne Javascript

In jedem Premium-WordPress-Theme ist ein Dropdown-Menu eingebaut.
Der Grund ist einfach: Ganz gleich, wie viele Unterseiten der User ineinanderschachtelt, das Menü sieht immer gut aus. Denn die Unterseiten erscheinen ja erst, wenn man auf einen Menüpunkt klickt.

Meistens sind diese Menüs mit Javascript animiert. Falls etwas nicht funktioniert oder wenn man etwas an der Optik verändern will, ist Suchen angesagt.

Vor einiger Zeit bin ich bei designmodo.com auf eine schöne Lösung gestoßen, bei der der Dropdown-Effekt mit reinem CSS erzeugt wird. Kein Javascript. Nur ein paar Zeilen CSS.

Weiterlesen CSS3 Dropdown-Menü ohne Javascript

Stylesheet mit enqueue_style einbinden

Laut WordPress-Codex ist es best practice, nicht nur Scripts, sondern auch Stylesheets über die Funktion wp_enqueue_style einzubinden. Das Stylesheet wird also nicht mehr klassisch per Link in den head-Bereich des HTML-Dokuments geschrieben, sondern über einen Hook in der functions.php geladen.

Ich habe mich gefragt: Wozu ist das gut? Was ist der Vorteil von enqueue_style, an welcher Stelle hat die Link-Methode Nachteile?
An der klassischen Link-Methode ist zunächst mal nichts verkehrt. Kommt das Theme mit einem einzelnen Stylesheet aus, spricht nichts dagegen, den Links zur Datei style.css direkt in die header.php einzutragen.
UPDATE: Das hat sich inzwischen geändert. Laut Codex soll ein Stylesheet nicht länger über einen Link in den head eingebaut werden, sondern über enqueue_script.

Weiterlesen Stylesheet mit enqueue_style einbinden

Was ist eigentlich Modernizr?

Für Responsive Design-Projekte setzen wir ein paar Hilfsmittel ein, um das Responsive Design über alle Browser hinweg zugänglich zu machen. Eines davon ist Modernizr.
Modernizr ist eine JavaScript-Bibliothek, mit deren Hilfe man HTML5/CSS3 einsetzen kann ohne in Kauf nehmen zu müssen, dass die Website in älteren Browsern nicht richtig funktioniert.

Modernizr überprüft jeden anfragenden Browser gezielt danach, was er leisten kann und was nicht. Das Ergebnis dieser Prüfung wird in einem eigens erzeugten JavaScript-Objekt gespeichert.
Zusätzlich ergänzt Modernizr das HTML-Element um Klassen, die erklären, welche Features unterstützt werden und welche nicht.

Weiterlesen Was ist eigentlich Modernizr?

LINKTIPP: SASS für Einsteiger

Getting started with Sass and Compass
Ich bin zwar nach wie vor skeptisch, ob sich das in meinen Workflow integrieren lässt, aber jetzt will ich es doch mal mit SASS und Compass versuchen.

Bei thinkvitamin.com gibt es eine Video-Einführung zum Thema SASS.
Update: Schade, der Link zum Video funktioniert nicht.

Eine Anleitung, wie man die ganze Kompiliererei in einen WordPress-Theme-Entwicklungsablauf integriert, gibt es hier:
Upgrade your WordPress theme CSS with Sass and Compass

Man sollte allerdings als Mac-User keine Angst vorm Terminal haben. ;o)

Linktipp: Statische Social Media Buttons

Facebook, Twitter, Google: Statische Buttons im Eigenbau
So, jetzt habe ich’s endlich getan. Ich hab die animierten Social-Buttons in der Single-Ansicht gegen statische Buttons ausgetauscht. Vladimir Simovic hat gezeigt, wie’s geht. Vielen Dank für die ausführlich Anleitung!

Mich haben die Ladeverzögerungen immer gestört. Nicht nur bei meiner Seite, auch bei anderen Seiten fand ich es lästig, wenn ich mal wieder auf Twitter und Facebook warten musste. Irgendwie beisst sich das, wenn man selbst die kleinsten Code-Schnipsel optimiert und dann lädt die Seite ewig.

Google-Web-Fonts in WordPress einbinden (Update)

Eine alternative Schrift in ein WordPress-Theme einzubinden ist nicht weiter kompliziert. In diesem Artikel beschreibe ich drei Möglichkeiten, wie Du Web-Fonts in Dein WordPress-Theme einbinden kannst: Google-Webfonts, Typekit und die @font-face-Methode.
Die Schrift-Darstellung funktioniert in allen modernen Browsern gut, es spricht also nichts dagegen, Verdana, Arial und Times in den Ruhestand zu schicken.

1. Google Web-Fonts

Die Oberfläche der Google Web Fonts-Seite wurde vor einiger Zeit überarbeitet, das Testen und Zusammenstellen von Schriften ist jetzt sehr bequem und unkompliziert. Du kannst Dir dort eine „Kollektion“ von Schriften zusammenstellen – und beim Klick auf den Button „Use“ zeigt Dir Google die fertigen Code-Schnipsel, mit denen Du die Schriften in das WordPress-Theme einbetten kannst.
Weiterlesen Google-Web-Fonts in WordPress einbinden (Update)