Affiliate Coaching Teil 5 – Template auswählen & konfigurieren

geschrieben am in der Kategorie Affiliate Marketing von

Euer Blog ist aufgesetzt – wie bekommt ihr ihn nun schick gestaltet? Dies ist eine der zentralen Fragen im Rahmen unseres Affiliate Coachings. Schließlich wollt ihr eure Besucher dazu animieren, die von euch beworbenen Produkte zu kaufen.

Nachdem euch Dennis im letzten Teil bereits die notwendigen Schritte zum Setup von WordPress näher gebracht hat und insbesondere im letzten Abschnitt die WordPress-internen Möglichkeit zum Finden kostenloser WordPress-Themes erläutert hat, möchten wir euch diesmal Anbieter von WordPress-Templates vorstellen. Darüber hinaus werden wir ein passendes Theme für unser Projekt www.tierbedarf-handlung.de auswählen und an unsere Bedürfnisse anpassen. Doch mehr dazu später…

Kostenloses vs. Kostenpflichtiges Theme

In erster Linie liegt es an euch, ob ihr die Möglichkeit und die Kenntnisse dazu habt, kostenlose Themes mit verhältnismäßig geringem Aufwand an eure Bedürfnisse anzupassen. Oftmals ist es so, dass die von WordPress über das Backend direkt zur Integration angebotenen Themes einen deutlichen Blog-Charakter haben. Ziel unserer Projekt-Idee soll es jedoch nicht sein, den Besuchern den Anschein zu vermitteln, als würde unsere Seite stets aktuelle Artikel zum konkreten Thema Tierbedarf veröffentlichen. Vielmehr sollte die Seite einen informativen, shop-ähnlichen Charakter haben, welcher sich in erster Linie über das Design widerspiegelt.

Wir wollen uns an dieser Stelle nicht grundsätzlich gegen kostenlose Themes aussprechen, jedoch hat die Erfahrung gezeigt, dass kostenpflichte Templates oftmals die Anforderungen, welche man sich im Vorfeld stecken sollte, besser erfüllen.

screenshot_woothemes

Was gibt es sonst für Vorteile von kostenpflichtigen Themes?

Allein die Tatsache, dass ein Anbieter Geld für ein zur Verfügung gestelltes Design verlangt, impliziert, dass für die Erstellung des Themes Arbeitszeit und andere Ressourcen wie z.B. Kosten für das Grafik-Design angefallen sind. Eine Schlussfolgerung, dass kostenpflichtige Themes daher immer besser und optisch ansprechender sind, liegt nahe, muss jedoch nicht immer zutreffend sein. Darüber hinaus können kostenfreie Templates mitunter für den Laien kaum zu erkennende Sicherheitslücken oder gar Schadcodes enthalten, was man bei kostenpflichtigen Themes zwar auch nicht gänzlich ausschließen kann, allerdings hat man in diesem Fall einen konkreten Bezug zum Anbieter des Themes anhand der Rechnung. Kostenpflichtige Anbieter überfrachten ihre Themes dafür manchmal mit eigenen Frameworks, die zwar einen gewissen Funktionsumfang bieten, aber dann auch wartungsanfällig sind. Gerade Zusatzfeatures wie das beliebte Image-Resizing bieten, wenn es schlecht läuft, Angriffsmöglichkeiten für Schadsoftware. Als Beispiel wäre hier Timthumb zu nennen, was wiederum sowohl von kostenlosen als auch kostenpflichtigen Themes eingesetzt wird. Man sollte sich also über den benötigten Funktionsumfang im Klaren sein. Manchmal ist weniger auch mehr.

Kostenlose Theme-Anbieter Kostenpflichtige Theme-Anbieter
http://themes.wpde.org/ http://www.woothemes.com/(70$ für 2 Themes)
http://www.digi-download.net/deutsche-wordpress-themes/ http://www.wphub.com/themes/(ab 1$ pro Theme)
http://wpshower.com/ http://themeshift.com/(39$ für ein Theme)
http://graphpaperpress.com/(99$ pro Jahr für alle Themes)
http://themeforest.net/(ab 12$ pro Theme)
http://www.elegantthemes.com/(39$ pro Jahr für alle Themes)
http://pandathemes.com/(ab 35$ pro Theme)

Deutschsprachiges vs. Englisches Theme

Ein weiterer wichtiger Faktor bei der Wahl des richtigen WordPress Themes liegt in der Sprache, in welcher dieses angeboten wird. Wie ihr anhand der obigen Tabelle seht, gibt es zahlreiche englischsprachige WordPress-Theme-Anbieter. Oftmals sind die Themes dieser Anbieter komplett in Englisch gehalten, was u.U. diverse Anpassungen in den Einstellungen und Standard-Formulierungen mit sich ziehen kann. Schließlich wird eure Zielgruppe vorwiegend aus dem deutschsprachigen Raum kommen und diese erwarten auch eine entsprechend klare Sprachgebung auf eurer Seite. In der Regel beziehen sich die Anpassungen bei englischsprachigen Themes auf verschiedene kleinere Stellen, wie z.B. die Kommentarfunktion oder die einzelnen Seitenlayouts. Anhand des von uns gewählten Themes werden wir euch später im Artikel zeigen, wie ihr solche Änderungen selbst vornehmen könnt, auch ohne weitreichende Programmierkenntnisse.

Wir suchten und fanden ein Theme zum Thema Haustierbedarf

Ihr erwartet an dieser Stelle sicherlich den bahnbrechenden Tipp, wie ihr das auf euch optimal zugeschneiderte Template findet – den Mastertipp haben wir natürlich nicht, aber einige Anhaltspunkte, die euch bei der Suche behilflich sein dürften. 😉

Aus unseren positiven Erfahrungen heraus haben wir uns bei der Suche nach einem passenden Theme zunächst vorwiegend auf Anbieter kostenpflichtiger Themes konzentriert. Auch ihr solltet angesichts der meist recht überschaubaren Kosten, welche sich in der Regel im Bereich von 30$ bis 70$ bewegen, nicht davon abschrecken lassen, ein kostenpflichtiges Theme zu kaufen. Jedoch sollte euer Anspruch in diesem Fall sein, dass das gewählte Theme im Wesentlichen euren konkreten Vorstellungen und Wünschen entspricht und keine oder nur wenige Anpassungen notwendig sind. Die wichtigste Überlegung vorab sollte daher sein, welche Anforderungen ihr an und welche Vorstellungen ihr von eurem Theme habt. Welche Farben kommen für euch in Frage? Wie sollte das Theme aufgebaut sein? Welche Funktionen sollte das Theme bieten?

In unserem Fall haben wir viel Wert auf ein übersichtliches und klar strukturiertes Design, die Möglichkeit einzelne Produktseiten in Kategorien übersichtlich über das Menü darzustellen, einen leicht anzupassenden Header sowie einen Online-Shop-ähnlichen Aufbau mit einem Grid-View gelegt. Wobei man eine Grid-View-Ansicht auch über ein passendes Plugin umsetzen könnte – darauf werden wir in den folgenden Artikeln noch einmal eingehen.

Ansonsten sollte das Theme auch nicht unnötig überladen sein. Unnötige Funktionen, die vom zentralen Gedanken – den Benutzer zum Weiterklicken in den Online-Shop animieren – abhalten, sollten möglichst außen vor bleiben. Vor allem die kostenpflichtigen Themes bieten hier oftmals viele zusätzliche Funktionen, wie etwa verschiedene Post Types, Thumbnail-Features usw., welche oftmals nice-to-have sind, aber genauso oft später gar nicht benötigt werden.

Hinsichtlich der Farbgebung kamen für uns vor allem die Farben weiß, grün und blau in Frage, am besten in einer Kombination. Da wir in unserem Projekt vorwiegend die Produkte der großen Anbieter MedicAnimal, ZooPlus u.ä. integrieren wollen, sollte das Design in gewisser Hinsicht auch diesen Anbietern nachempfunden sein. Auf euer Projekt bezogen, solltet ihr überlegen, welche Farbgebung am ehesten die „Stimmung“ des Partnerprogramms, das ihr bewerben wollt, widerspiegelt. Für ein Sommerthema empfiehlt es sich daher nicht ein dunkelschwarzes Theme zu wählen. 😉

Anlaufstelle waren für uns zunächst die kostenpflichtigen Theme-Anbieter themeforest, WooThemes und elegantthemes. Die Auswahl dort ist riesig und ihr solltet euch durchaus die Zeit nehmen, intensiv nach einem geeigneten Template zu suchen. Da für unsere Zwecke viele der Themes zu viele Sonderfunktionen baten, haben wir uns letztlich – Achtung: Insider-Tipp 🙂 – für das kostenlose Theme Sight entschieden.

Theme installieren und aktivieren

Zum Installieren eines Themes geht ihr folgendermaßen vor. Zunächst erwerbt ihr das Theme eurer Wahl, sofern es kein kostenloses ist, und ladet euch die Daten runter. In unserem Fall entpacken wir die sight.zip mit einem gewöhnlichen Entpackprogramm wie WinRar o.ä.

Den nun erhaltenen Ordner laden wir mit einem FTP-Programm vollständig im Installations-Ordner eures Blogs in den Unterordner wp-content à themes hoch.

screenshot_ftp_upload_theme

Ist dies erledigt, seht ihr das neue Template im WordPress Backend unter dem Punkt Design à Themes und könnt dieses mit einem Klick auf „aktivieren“ zu eurem Standard-Theme machen.

screenshot_theme_aktivieren

Damit ist das Theme installiert und ihr könnt anschließend weitergehende Anpassungen vornehmen. Wie man sieht, ist unser Template ebenfalls in Englisch gehalten, weshalb wir in den nächsten Schritten die Übersetzung der einzelnen Texte vornehmen.

screenshot_template

Es gibt zur Übersetzung englischsprachiger Themes das praktische Plugin Codestyling Localization, eine passende Anleitung dazu findet ihr hier. Das Plugin hilft zweifelsfrei dabei mit überschaubarem Aufwand die Standardtexte zu übersetzen, ist aber aus unserer Erfahrung heraus relativ fehleranfällig und bietet auch nicht alle Standardtexte zur Übersetzung an. Wir freuen uns allerdings ggf. über euer Feedback und eure Erfahrungen mit dem Plugin. 🙂

Wir gehen eher den klassischen Weg und passen die Texte direkt in den entsprechenden Template-Dateien an. Dazu gehen wir im WordPress Backend auf den Menüpunkt Design à Editor und bekommen anschließend alle Dateien unseres Templates sowie die verwendeten Stylesheets angezeigt. An dieser Stelle sei nochmal der Hinweis auf die so nützlichen Editoren mit FTP Funktion gegeben (z.B. PSPad für Windows oder Textwrangler für Mac). Auch hier werden einfach die Dateien im Editor bearbeitet, der Vorteil ist aber, dass diese direkt online geöffnet und bearbeitet werden und man nach dem Speichern noch einen „Rückgängig“-Button hat, um ggf. fehlerhafte Änderungen zurück zu nehmen. Perfekt für die Arbeitsweise „trial and error“ des unversierten Webdevelopers 😉 Diese Funktion fehlt im WordPress-Editor übrigens gänzlich, also Vorsicht!

screenshot_editor

Nun klicken wir uns durch die einzelnen Template-Dateien. Bitte beachtet, dass je nach Theme unterschiedlich viele Template-Dateien aufgelistet werden können. Die wichtigsten Dateien, welche die Texte, die über das Frontend angezeigt werden, beinhalten sind folgende:

  • 404.php – Inhalt und Formatierung der 404-Fehlerseite
  • single.php – Inhalt und Formatierung eines einzelnen Artikels
  • footer.php – Inhalt und Formatierung des Footerbereichs
  • comments.php – Inhalt und Formatierung des Kommentarbereichs
  • header.php – Inhalt und Formatierung des Headerbereichs
  • page.php – Inhalt und Formatierung einer einzelnen Seite
  • search.php – Inhalt und Formatierung der Suchergebnis-Seite
  • searchform.php – Inhalt und Formatierung des Suchformulars
  • loop.php – Inhalt und Formatierung der Artikelübersicht
  • pagination.php – Links zum Aufrufen älterer Artikel unterhalb der Artikelübersicht

Idealerweise nehmt ihr euch die Zeit und schaut jede Datei einzeln durch und übersetzt die englischen Texte nach euren Bedürfnissen. Unterhalb seht ihr noch zwei Beispiele dafür…

screenshot_404

screenshot_single

Design anpassen – CSS vs. Theme-Einstellungen

Viele Templates bieten bereits einen eigenen Bereich, um Einstellungen hinsichtlich des Designs und anderer Eigenschaften vorzunehmen. In unserem Fall ist dieser Bereich recht überschaubar, bietet aber u.a. die Möglichkeit einfach ein eigenes Logo hochzuladen, eine andere Hintergrundfarbe festzulegen, den Google Analytics-Code zu hinterlegen sowie Einstellung bzgl. der Pagination und der Slideshow vorzunehmen. In anderen Themes kann man hier mitunter noch mehr Einstellungen vornehmen. Für HTML- und CSS-erfahrene Nutzer unter euch ist es auch möglich, direkt im Menüpunkt Design à Editor die entsprechenden CSS-Dateien eures Templates zu bearbeiten und darüber eure Seite anzupassen. Für die CSS-unerfahreneren Affiliates unter euch legen wir euch folgendes CSS-Tutorial nahe – ihr findet über Google auch noch weitere Tutorials zum Thema. Wir haben selbst Hand angelegt und das Theme grafisch an unsere Vorstellungen angepasst.

Wie das Ganze nach der Umgestaltung aussieht, seht ihr unter www.tierbedarf-handlung.de bzw. im nachfolgenden Screenshot. 🙂

screenshot_tierbedarf

Preiswerte Logos bekommt ihr übrigens, sofern ihr diese nicht selbst mit PhotoShop o.ä. gestaltet, günstig bei www.logo5.de.

Zeigt her eure Themes und Projekte…

Jetzt sind wir natürlich sehr gespannt und hoffen, dass ihr ebenfalls die Katze aus dem Sack lasst und uns den aktuellen Stand eurer Projekte zeigt – egal ob über verlinkte Screenshots oder direkt unter Angabe eurer Projekt-URL. Gerne geben wir euch auch persönlichen Rat und Hinweise, was ihr ggf. beachten und anders machen könnt.

Schreibt uns einfach eine E-Mail an: coaching[at]projecter.de

Wir freuen uns auf euer Feedback und ihr dürft euch in den nächsten beiden Wochen auf die Vorstellung einiger WordPress Plugins freuen! 🙂

Bereits erschienene Beiträge unserer Serie:

Über unseren Newsletter werdet ihr immer über neue Beiträge unserer Coaching Serie informiert:


Vielen Dank an die Sponsoren unserer Aktion:

.

Einen Kommentar schreiben

* Pflichtfelder

  1. Moin Moin,

    mal wieder ein sehr gelungener und ausführlicher Artikel!

    Habe mich gleich auf die Suche nach einem passenden Theme für mein Coaching-Projekt gemacht und mich ebenfalls für ein Free-Theme entschieden. Auf deutsch übersetzt und leicht angepasst sollte es jetzt meinen Anforderungen genügen.

    Unter http://personalisierte-babygeschenke.de/ kann man sich den aktuellen Stand ansehen.

    Für Feedback bin ich natürlich offen und dankbar!

    Grüße ausm Norden!

  2. Hallo Timo,

    vielen Dank für deine Rückmeldung. Dein Projekt passt thematisch super zum Bulbby Partnerprogramm (http://www.projecter.de/affiliate-blog/bulbby-partnerprogramm) :-).

    Viele Grüße und weiterhin gutes Gelingen & natürlich viel Spass bei der Umsetzung.

  3. Ich bevorzuge ebenfalls eher die kostenpflichtigen Themes, z.B. von Themeforest. Hier hatte ich bisher stets eine Top-Qualität, gute Dokumentationen und sauberen Code.

    Von Elegantthemes bin ich nicht wirklich überzeugt. Die Themes scheinen zwar auf den ersten Blick völlig ok zu sein, jedoch hakt es in Detail (fehlende oder fehlerhafte Alt-Attribute bei Bildern oder nicht vorhandene Title-Attribute in Links gehen mir sehr auf den Nerv) hier sehr oft. Auch die Konfiguration der Themes ist nicht unbedingt gelungen.
    Nicht desto trotz werden die meisten mit dem 39$ Paket sehr zufrieden sein.