Für die Funktion eines WordPress Templates sind die einzelnen PHP-Dateien verantwortlich, in unserem Fall bislang nur die index.php. Doch um HTML visuell aufzupeppen (und damit WordPress unser Template „erkennt“), brauchen wir ein CSS-Stylesheet. Deshalb lege jetzt in deinem Template-Ordner die Datei style.css an:

/wp-content/themes/tutorial/style.css

Nun fügen wir folgenden Code in unser Stylesheet ein, um die Hauptstruktur unseres Templates zu formen:

body			{color: #333; background: #e5e5e5;}

#wrapper		{width: 850px; margin: auto; text-align: left; background: #fff;}
#header			{height: 160px; padding: 20px; }
#main			{width: 520px; padding: 20px; float: left;}
#sidebar		{width: 270px; padding: 10px; padding-top: 20px; float: left;}
#footer			{clear: both; height: 100px; padding: 20px; }

Dieser Teil ist nur dafür da, unserem Template eine grobe Struktur zu geben, aber ein wichtiger Teil fehlt noch. Wenn du im WordPress Backend auf der „Manage Themes“ Seite gehst, siehst du alle Themes, die du in deinem Theme Ordner hast. Unser „Tutorial“-Theme wird aber nicht angezeigt, das werden wir jetzt ändern. Füge an den Anfang der style.css folgenden Code:

/*   
Theme Name: Tutorial
Theme URI: http://wordpress.lernenhoch2.de
Description: Template zum WordPress Tutorial auf http://wordpress.lernenhoch2.de
Author: Christian Strang
Author URI: http://lernenhoch2.de
*/

Erklärung:

• Theme Name: Dies ist der wichtigste Wert und zeigt im Theme Manager das Template mit seinem Namen an
• Theme URI: Wenn du vorhast, dein Template zu verteilen, solltest du hier die URL angeben, unter der man es finden kann. So können User, die dein Theme nutzen, nach einer aktualisierten Version, behobenen Bugs, etc. suchen
• Description: eine kurze Beschreibung zu deinem Template, wie es aussieht (2 Spalten, weiß/blau, simpel…) oder für welchen Zweck (Kinder-Blog, Schul-Blog, etc.) oder was du sonst über dein Template sagen möchtest
• Author: Der Name desjenigen, der das Template erstellt hat
• Author URI: Die URL zu deinem blog, deiner Website

Da wir noch keinen Inhalt haben, bzw. noch nichts mit WordPress ausgeben, können wir nur hoffen, dass das Layout so funktioniert. Im nächsten Teil werden wir es dann erfahren :)

Hinweis: Das Stylesheet muss erst noch verlinkt werden, damit das Layout angezeigt wird. Wie das geht erfährst du im Teil Den Head-Bereich füllen.