Schweizer WordPress Magazin

Webdesign

10 Tipps für WordPress Theme Autoren

Dieser Artikel ist nicht nur als Hilfe für Anfänger in der Theme-Entwicklung interessant, sondern auch als Checkliste für erfahrene Programmierer.

1. Valider Code

   Bestimmt das Wichtigste bei einem Theme: Um die Validität einer Website zu prüfen, geht man am besten auf w3.org. Hier die wichtigsten Links:

   • CSS Validation: http://jigsaw.w3.org/css-validator/
   • (X)HTML Validation: http://validator.w3.org/
   • RSS/Atom Validation: http://validator.w3.org/feed/
2. Live Demo

   Würdest du ein Theme downloaden, ohne es vorher zu testen? Also ich nicht und du sicher auch nicht. Deshalb ist es wichtig, dass der Besucher das Theme, welches man veröffentlicht, auch vorher testen kann. Ein Screenshot reicht eben nie wirklich...

3. Minimum an benötigten Plugins

   Es ist gut, wenn ein Theme verschiedene Plugins unterstützt, ohne dass man irgendwelche Anpassungen tätigen muss. Schlecht wird es nur dann, wenn man effektiv ein Plugin benötigt, um ein Theme zum Laufen zu bringen. Merke dir: Benutze so wenig Plugins wie möglich.

4. Browserkompatibilität

   Beim Webdesign geht es heute (leider) auch darum, dass das fertige Layout in jedem Browser gleich aussieht. Es empfiehlt sich manchmal auch der Einsatz von CSS Frameworks, die insgesamt eine hohe Browserkompatibilität aufweisen. Sollte zum Beispiel der Internet Explorer nicht das anzeigen, was man möchte, kann man ein spezielles Stylesheet einbinden, welches nur der IE erkennt:

   
   <!--[if lt IE 7]>
   	<link rel="stylesheet" href="http://wp-magazin.ch/wp-content/themes/tma/ie.css"
   	type="text/css" media="screen, projection">
   <![endif]-->

   Und falls man nicht immer gleich jedes Betriebssystem und jeden Browser zur Hand hat, kann man mit Services wie http://www.browsershots.org/ Screenshots des Themes machen, um zu sehen, wie es in dem und in dem Browser aussieht.

5. Kein Hard Coding

   Unter Hard Coding versteht man das direkte Einfügen von Daten, auch wenn diese von einer externen Quelle (Datenbank) geholt werden könnten. Es ist besser, wenn du die Auflistung der Seiten mit den von WordPress gegebenen Funktion erledigst, anstelle jedem Blogger zuzumuten, selber die Links anzupassen.So listet man alle Seiten unter WordPress auf:

   <?php wp_list_pages('title_li='); ?>

   Eine zusätzliche Lösung könnte auch das hier sein:

   <ul>
   <li><a href="<?php bloginfo('home'); ?>">Home</a></li>
   <?php wp_list_pages('title_li='); ?>
   <li><a href="<?php bloginfo('rss2_url'); ?>">RSS</a></li>
   <li><a href="mailto:<?php bloginfo('admin_email'); ?>">Contact</a></li>
   </ul>
   

   Hier werden nämlich zusätzlich zu den Seiten noch ein Link zur Startseite sowie ein Verweis auf den RSS Feed eingebunden. Diese Lösung ist auch möglich, da man hier nie den Link verändern muss.

6. Navigation

   Das Wichtigste beim Blog ist natürlich die Navigation durch die verschiedenen Beiträge. Könnte man nicht auf Vor und Zurück klicken, käme man natürlich nicht von der Startseite weg. Natürlich dürfen diese Links nicht fehlen! So bindet man sie in WordPress ein:

   <?php posts_nav_link(); ?>

7. Feed verlinken

   Es ist wichtig, dass man irgendwo im Theme auf den RSS Feed verlinkt. Am besten im Header und gut deklariert. Beispiel gefällig?

   <a href="<?php bloginfo('rss2_url'); ?>" title="RSS Feed">RSS Feed</a>

8. Screenshots

   Egal für wen du dein Theme erstellst, für die breite Masse oder für deinen Kumpel: Mache Screenshots. Denn spätestens WordPress verlangt einen Screenshot in der Design-Rubrik des Backends, damit man sieht, wie welches Theme aussieht. Zudem kann man damit noch bevor man überhaupt entscheidet, die Demo anzusehen oder nicht, sehen, wie das Theme aussieht.

9. Farbwahl

   Die Farbkombination ist das A und O eines Webdesigns. Gib dir Mühe und vor allen Dingen nimm dir Zeit bei der Auswahl einer Farbpalette. Übrigens: Eine gute Farbkombination finde ich immer wieder auf COLOURlovers.com :-)

10. Angaben zum Theme in der style.css

    Damit WordPress weiss, um welches Theme es sich handelt und wie es aussieht, verlangt es ein paar Daten vom Autor des Themes. Diese Angaben sind in der Datei style.css zu hinterlegen. So muss es dann aussehen:

    /*
    Theme Name: XY
    Theme URI: http://wp-magazin.ch/url-zum-theme/
    Description: Schönes Theme mit drei Spalten. Die Beschreibung sollte übrigens nicht zu kurz sein.
    Author: Max Mustermann
    Author URI: http://wp-magazin.ch/
    Version: 1.0
    */