WordPress und Git: Projekte auf GitHub

logo-gitEine große Stärke von Git kam bisher noch gar nicht zur Sprache: Die Möglichkeit, Projekte über GitHub zu teilen. GitHub ist eine Plattform, auf der man Projekte öffentlich zur Verfügung stellt. Die Idee dahinter ist, dass man so im Team arbeiten kann. Viele OpenSource-Projekte wohnen deshalb auf GitHub. 

Wir entwickeln Themes für Kundenprojekte, als Grundlage benutzen wir dazu das _s-Theme von Automattic. Freundlicherweise gibt’s das auf GitHub. Den Code zu kopieren ist nicht so ein großes Problem, aber wir möchten möglichst effizient damit arbeiten. Das bedeutet, wir wollen nicht nur eine Kopie haben, wir wollen auch keine Updates von Automattic verpassen. Wie geht das?

Weiterlesen WordPress und Git: Projekte auf GitHub

Git für WordPress: Arbeiten mit Branches

logo-gitEiner der großen Pluspunkte von Git ist, dass man innerhalb eines Projekts Verzweigungen anlegen kann. Ich kann also einen Teil meines WordPress-Themes „abzweigen“ und ganz entspannt darin arbeiten, ohne dass die Ausgangsversion in Gefahr ist.

Im letzten Artikel haben wir gesehen, dass Git ganz von allein einen Branch „master“ – den ersten Zweig – angelegt hat. Das können wir mit Hilfe des Befehls git status abfragen. Wir bekommen dann die Information „On branch master“. Der Branch „master“ entsteht immer automatisch sobald man Git in einem Verzeichnis initialisiert.


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


Im ersten Artikel habe ich für die Entwicklung eines Sliders den Branch „slider“ angelegt (siehe Infografik erster Artikel). In diesem Zweig arbeite ich an einem Slider für die Startseite. Das Theme, das im Branch „master“ steckt, bleibt derweil unangetastet.
Achtung: Lieber einmal mehr prüfen, in welchem Branch Ihr gerade seid. Nur wenn Ihr Euch tatsächlich im richtigen Zweig befindet, könnt Ihr Eure Änderungen auch sehen. Am Anfang kann das ziemlich verwirrend sein.

Weiterlesen Git für WordPress: Arbeiten mit Branches

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)