WordPress: Themes finden, installieren und anpassen & Suchmaschinenoptimierung

Mit Themes – den fertigen und einsatzbereiten Layouts bzw. Designs für WordPress – können Sie Ihrer WordPress-Seite immer wieder ein anderes Gesicht geben.

Die WordPress-Themes finden Sie auf den Websites der Autoren oder in Theme-Verzeichnissen, wie ich sie auf meiner Website vorstelle. Aber am besten wenden Sie sich zunächst an die offizielle Themes-Sammlung:

Offizielles Themes-Verzeichnis Das offizielle Themes-Verzeichnis ist englischsprachig und beherbergt mittlerweile mehr als 2.400 einsatzbereite Themes. Alle hier aufgelisteten Themes sind Open-Source und erfüllen die recht strengen Auflagen des Verzeichnisses. So müssen z. B. die Themes CSS-Regeln für die Bilder- und Galerie-Funktion aufweisen, die Gravatre und Widgets müssen unterstützt werden etc.

Abbildung 1: Offizielles Themes-Verzeichnis

In dem offiziellen Themes-Verzeichnis können Sie sowohl die Suchfunktion bemühen als auch sich die Schlagwörter, nach denen die Themes klassifiziert wurden, auflisten lassen.

Wenn Sie sich ein Theme herunterladen, müssen Sie das Paket entpacken und den Ordner mit den Template-Dateien nach /wp-content/themes/ hochladen. Danach sollte es im Bereich "Design » Themes" erscheinen:

Abbildung 2: Neues Theme wurde hochgeladen

In diesem Übersichtsbereich können Sie auch nach installierten Themes suchen, installierte Themes verwalten (aktivieren/deaktivieren).

Fahren Sie mit der Maus über ein Theme erscheint der Link „Theme-Details“. Ein Klick darauf liefert Ihnen ausführliche Informationen zum jeweiligen Theme und auch die Möglichkeit das Theme wieder zu löschen.

Seit der Version 2.8 haben Sie die zusätzliche Möglichkeit, Themes aus dem Backend heraus zu installieren – ähnlich wie bei Plugins. Sie greifen dabei auf die offizielle Sammlung auf WordPress.org zu. Begeben Sie sich dazu einfach zum Menüpunkt "Design »Themes" und wählen dort den Button "Hinzufügen" (oben links) oder den Link „+ Neues Theme hinzufügen“, den Sie in einem leeren Bereich am Ende Ihrer installierten Themes als Platzhalter finden.

Suchen Sie dort nach einem bestimmten Theme. Sie können Ihre Suche auch einschränken, indem Sie nach bestimmten Funktionen filtern.

Abbildung 3: Im Backend nach einem Theme aus dem offiziellen Verzeichnis suchen.

Auf der gleichen Seite finden Sie zudem die folgenden Links:

• Hochladen: Hier können Sie ein gezipptes Theme, das Sie auf Ihrem Rechner gespeichert haben, installieren. Es gilt hierbei das gleiche wie bei gezippten Plugins, die man aus dem Backend heraus installiert.

• Empfohlen: Hier wird Ihnen eine Auswahl an Themes vorgestellt.

• Neueste: Hier werden neue Themes vorgestellt.

• Vor kurzem aktualisiert: Hier finden Sie Themes, die kürzlich aktualisiert wurden.

Mit einem Klick auf die Vorschau eines Themes können Sie das Theme begutachten:

Abbildung 4: Vorschau des neuen Themes

Im linken Bereich des Fensters können Sie diese Vorschau wieder schließen oder aber das Theme installieren.

Nach der Installation haben Sie die Möglichkeit eine Live-Vorschau des Themes anzusehen bevor Sie es endgültig aktivieren. Klicken Sie dafür einfach auf den Link "Live-Vorschau".

Abbildung 5: Live-Vorschau

Live-Vorschau bedeutet hierbei, dass Sie das Theme mit ihren eigenen Inhalten angezeigt bekommen.

Nur, wenn Sie das Theme auch aktivieren ist es auch im Frontend sichtbar.

Abbildung 6: Das neue Theme wird im Backend als aktiv angezeigt

Da das neue Theme aktiv ist, können wir uns das Ergebnis im Frontend anschauen:

Abbildung 7: Geschafft!

Das war's. Das Theme ist kompatibel und funktioniert. Was will man mehr?

Es gibt nicht viel, aber auf einige Punkte sollte man bei den WordPress-Themes achten, wenn man das Theme von einer anderen Quelle bezieht. Zum einen wäre dies die Lizenz. Die große Mehrheit der Themes ist frei und steht unter einer Open-Source-Lizenz (meistens GPL ). Das ist einerseits sehr vorteilhaft, weil man es frei nutzen und anpassen kann. Auf der anderen Seite muss der Copyright-Link erhalten bleiben und alle Anpassungen, die Sie an diesem Layout vornehmen, stehen ebenfalls unter der Open-Source-Lizenz.

Es gibt allerdings auch kostenpflichtige WordPress-Themes. Hier sollte man ebenfalls auf die Lizenz achten.

Dann müssen Sie darauf achten, ob das Theme nur auf bestimmten WordPress-Versionen funktioniert und welchen Umfang es bietet. Hat es Unterstützung für die dynamische Sidebar und die Widgets? Ist es eingedeutscht? Kann man es leicht anpassen? etc. Üblicherweise werden diese Informationen in einer separaten Datei im Paket notiert oder Sie stehen auf der Website des Autors.

Viele Wege führen nach Köln.

Dieses alte und bewährte Sprichwort hat auch hier seine Gültigkeit. Prinzipiell stehen Ihnen mehrere Wege offen, um ein WordPress-Theme anzupassen.

Das Standardtheme Twenty Fourteen bietet, im Gegensatz zu vielen anderen Themes, die Möglichkeit, innerhalb der Admin-Oberfläche eigene Anpassungen vorzunehmen. Sie können eigene Einstellungen bzgl. der Kopfzeile machen und sogar eigene Menüs erstellen, die sie dann als Widget implementieren können.

Die Kopfzeile anpassen

Im Menüpunkt" Design / Kopfzeile" haben Sie die Möglichkeit den Kopfbereich bzw. die Kopfgrafik anzupassen.

Abbildung 8: Kopfzeile anpassen

Sie können entweder ein eigenes Bild hochladen oder aber eines aus der Mediathek wählen. Sofern das Bild nicht genau 1.260 x 240 Pixel groß ist, müssen Sie es in einem weiteren Schritt noch zuschneiden.

Mehrere hoch geladene Bilder kann man sich auch nach dem Zufallsprinzip anzeigen lassen.

Selbstverständlich hat man auch die Möglichkeit komplett auf eine Grafik im Kopfbereich zu verzichten.

Abbildung 9: Eine eigene Grafik in der Kopfzeile

Außerdem ist es möglich die Schriftfarbe des Titels und Slogans ihrer Website anzupassen. Der Text kann außerdem auch komplett ausgeblendet werden.

Individuelle Menüs erstellen

Eine aus Nutzer-Sicht sehr interessante Neuerung in WordPress 3.0 ist die Möglichkeit aus dem Backend heraus individuelle Navigationsmenüs zu erstellen und auf der Website bzw. im Frontend ausgeben zu lassen. Damit das überhaupt erst funktioniert, muss diese neue Funktion in der functions.php aktiviert werden und damit die Ausgabe im Frontend klappt muss man in der entprechenden Template-Datei <?php wp_nav_menu(); ?> einfügen oder das Theme muss widget-fähig sein.

Nutzen Sie das neue Standard-Theme (Twenty Fourteen) oder ein anderes Theme, welches diese Funktion unterstützt, dann müssen Sie sich weder um die Aktivierung noch um die Ausgabe der neuen Funktion sorgen.

Sind Sie neugierig geworden? Dann sollten Sie sich Richtung "Design / Menüs" begeben.

Für die Erstellung eines eigenen Menüs sind nur wenige Schritte notwendig.

Abbildung 10: Navigationsmenüs im Backend erstellen

• Geben Sie Ihrem Neuen Menü einen Namen und Klicken Sie auf den Button"Menü erstellen". Sie können auch mehrere unterschiedliche Menüs erstellen.

• Danach können Sie aus verschiedenen Quellen – individuelle Links, Seiten und Kategorien – das Menü erstellen.

• Die einzelnen Menüpunkte können Sie dann durch Klicken und Ziehen ordnen und wenn gewünscht auch verschachteln, womit Sie die Möglichkeit haben, die einzelnen Menüpunkte hierarchisch zu ordnen.

Abbildung 11: Individuelles Menü positionieren

Nachdem Sie ein Menü erstellt und abgespeichert haben, entsteht im oberen Bereich ein zusätzlicher Reiter mit dem Namen „Positionen verwalten“. Wenn Sie diesen aufrufen, dann haben Sie die Möglichkeit, dass neu erstellte Menü im Theme zu positionieren und zwar an den Stellen, die die Autoren des jeweiligen Themes vorgesehen haben. Im Fall von Twenty Fourteen ist dies entweder die horizontale Navigation im Kopfbereich (Oberes primäres Menü) oder in der linken Seitenleiste.

Wenn Sie sich dafür entschieden haben die Hauptnavigation nicht zu ersetzen, sondern das individuelle Menü in der Sidebar unterzubringen, dann können Sie dies mit Hilfe von Widgets realisieren.

Abbildung 12: Individuelles Menü als Widget einfügen

Einfach das Widget "Individuelles Menü" durch Klicken und Ziehen in den entsprechenden Widget-Bereich bewegen, Menü auswählen, falls benötigt eine Überschrift geben und abspeichern.

Und so schaut das Ergebnis im Frontend aus:

Abbildung 13: Frontend

Sie haben natürlich die Möglichkeit mehrere individuelle Menüs zu erstellen. Damit haben Sie, zumindest im Standard-Theme, die Möglichkeit, die Hauptnavigation zu ersetzen sowie die Sidebar und den Fußbereich mit eigenen Inhalten zu füllen.

CSS anpassen

Alternativ können Sie die CSS-Datei (styles.css) anpassen. Haben Sie solide CSS-Kenntnisse, können Sie sehr schnell und einfach einem WordPress-Theme Ihre individuelle Note verleihen.

Verfügen Sie zusätzlich noch über gute (X)HTML- und rudimentäre PHP-Kenntnisse, können Sie die Template-Dateien anpassen oder mit etwas Übung ein eigenes Theme erstellen.

Sie können dies sogar im Backend von WordPress machen. Unter dem Menüpunkt "Design » Editor" können Sie sich alle Dateien, der installierten Themes anschauen und auch bearbeiten. Voraussetzung dafür ist, dass die Dateien beschreibbar sind bzw. über die entsprechenden Dateiberechtigungen verfügen.

Abbildung 14: Themes im Backend bearbeiten

Die Bearbeitung im Backend ist allerdings bei weitem nicht so komfortabel wie in einem separaten Editor. Was vor allen Dingen für eine übersichtliche Bearbeitung fehlt, sind die Syntaxhervorhebung und die Zeilennummerierung.