WordPress Theme Tutorial
Teil 1 - Teil 2 - Teil 3 - Teil 4 - Teil 5
single.php - Die Beitragsansicht
Die Datei single.php ist fast identisch zur index.php. Es kommt nur ein kleiner, aber wichtiger Teil, hinzu: die Kommentare!
Diese bindet man am einfachsten wie folgt ein:
<?php if (('open' == $post-> comment_status) && ('open' == $post->ping_status)) { ?><a href="<?php trackback_url(true); ?>" rel="trackback">Trackback</a><?php } ?> <a href="<?php the_permalink() ?>" rel="bookmark">Permanent Link</a>
<?php if(!('open' == $post-> comment_status) && ('open' == $post->ping_status)) { ?>
Zur Zeit können keine Kommentare abgegeben werden. Setze doch einen <a href="< ?php trackback_url(true); ?> " rel="trackback">Trackback auf deine Seite.
<?php } elseif (('open' == $post-> comment_status) && !('open' == $post->ping_status)) { ?>
Pings setzen ist zur Zeit nicht erlaubt.
<?php } elseif (!('open' == $post-> comment_status) && !('open' == $post->ping_status)) { ?>
Weder Pings noch Kommentare sind erlaubt.<?php } ?>
<?php comments_template(); ?>
Dieser Code kommt am besten nach der Beitragsausgabe und vor endwhile und else.
comments.php - Die Kommentare
Diese Datei gibt die Kommentare aus und erlaubt dem User einen neuen Kommentar zu schreiben.
Auf die Formatierung der Kommentare werde ich wohl später eingehen, da diese Datei relativ umständlich ist. Ich empfehle für den Anfang die comments.php aus dem Standard WordPress Theme, da sie dort bereits sehr gut formatiert ist. Den Feinschliff kann man mit CSS ja sowieso machen. Der Aufbau dürfte für den Anfang zu fast jedem Theme passen.
404.php - Auch ein Blog braucht eine Fehlerseite
Die Fehlerseite ist relativ einfach aufgebaut, sie besteht aus dem Layout der Seite (Header, Footer, Sidebar) und der Fehlermeldung.
<?php get_header(); ?>
<div class="post">
<h1>Fehler!</h1>
Die gewünschte Seite ist nicht verfügbar.<br />
<?php include (TEMPLATEPATH . '/searchform.php'); ?>
</div>
<div id="sitemap">
<?php get_sidebar(); ?></div>
<?php get_footer(); ?>
Der Aufbau mittels Header, Hooter und Sidebar dürfte aus den Dateien index.php und single.php bekannt sein.
Weiterhin befindet sich auf der Seite nur die Fehlermeldung. Hier ist sie genauso wie ein Post gestaltet (DIV post). Weiterhin wird das Suchfeld eingefügt, damit sich der Leser gleich auf die Suche begeben kann.
screenshot.png - Um das neue Theme besser darzustellen fehlt nur noch das Screenshot
Jetzt kommen wir schon zum letzten Teil dieses Tutorials. Nach dem das Theme nun fertig gestellt ist, sollten wir noch ein Screenshot erstellen. Es sollte eine Größe von 300×225px haben und als screenshot.png gespeichert werden. Es wird dann automatisch im Admin ‘Panel beim jeweiligen Theme angezeigt.
Fertig!
Fertig! Das erste WordPress Theme ist erstellt. ![]()
Ich würde mich über Kommentare zu diesem Tutorial freuen. Natürlich können auch Fragen zum Thema oder allgemeines Feedback abgegeben werden.
Wenn euch das Tutorial gefallen hat, würde ich mich über einen Backlink auf den webworkblog.net freuen.
WordPress Theme Tutorial
Teil 1 - Teil 2 - Teil 3 - Teil 4 - Teil 5
Nettes Tutorial und gut beschrieben. Wäre ganz gut, wenn man das vielleicht noch ein wenig mehr beschreiben könnte hinsichtlich der Sidebar und einer groben CSS-Ausrichtung bzgl. der Navigation oder so.
Habe noch eine kurze Frage:
Fehlt bei “single.php - Die Beitragsansicht” nicht “get header” und “get footer”?
Doch doch. Du nimmst die index.php und fügst zusätzlich noch das was oben steht ein. beides zusammen ist dann die single.php
Man möchte ja sehen was man kommentiert
Hallo
zum Thema Fehlerseite in Blogs haben wir eine Blog Parade gestartet. Unter dem Motto “Zeig mir deine Fehlerseite” kann jeder Teilnehmer seine Fehlerseite präsentieren.
http://www.webmeister.ch/blog/2007/07/27/zeig-mir-deine-404-error-seite/
Unter allen Teilnehmern wird ein Buch verlost.
Originelle Fehlermeldungen sind willkommen.
Webmeister
Hallo, mich würde interessieren ob das mit der neuen Wordpress Version immernoch so einfach geht.
Super danke!!! Kurz und knackig…
Wie installiere ich denn dann mein fertiges Wordpress-Theme?
also bisher finde ich das tutorial super! endlich erklärt mal einer im verständlichen deutsch, was es mit den jeweiligen Sachen auf sich hat. bisher hab ichs zwar noch nicht getestet, aber es klingt schon mal nicht schlecht. wer weiß, vielleicht blick ichs ja endlich und kann dann ein paar templates erstellen XD Danke!!!
nicht gerade ausführlich erklärt, kann ich nicht gebrauchen.
Vielen Dank für das Tutorial! Ohne dieses wäre vermutlich mein erstes Theme nicht möglich gewesen. Schafft leider nicht jeder die Vielfalt von Wordpress auf ein Minum zu begrenzen.
Habe mir hier auch ein paar gute Tipps geholt!
Danke dafür!
Hi,
sehr schönes Tutorial. Deckt das gröbste ab. Solltest du das noch einmal erweitern, wäre es z.B. gut, die Widget-Funktionalität ebenfalls einzubauen. Das hab ich mir über Automattic geholt und funktioniert wunderbar.
Ganz ohne Wissen bin ich da nicht rangegangen, braucht jedoch für ein komplett neues Theme die Basis. Und die hab ich hier gefunden. Danke!
Hallo,
gut wäre, wenn die Code-Sachen besser lesbar wären und nicht hintereinander weg… also schön übersichtlich untereinander.
Ansonsten schön.
PS: Aber eine Frage… Ich möchte gern bei “Seite erstellen” eine Seite anlegen, die hat halt standardmäßig das Template, mit rechts diesen Blog-Elementen (Standarttemplate, Links, Archive)…aber ich möchte ein anderes Template, das eher eine leere Seite ohne diese Blog-Elemente sondern nur mit von mir eingegebenen Texten und Bilder zeigt.
Ich würde nämlich eine komplette Seite machen, da gibts z.B. “Über mich, Blog, Galerie” und im Prinzip soll halt nur “Blog” den Blogcharakter haben und bei den anderen Kategorien möchte ich nur Text-&Bilder posten ohne das da irgendjemand nochwas zu bloggen könnte.
Wie bekommt man ein eigenes Template denn letztlich in die “Template-Auswahl” bei “Seite bearbeiten > Attribute > Template”
Hoffe auf Hilfe, weil das jetzt in dem Tutorial nicht drinstand
Vielen Dank für dieses Tutorial!
Es liefert eine sehr gute Basis um einmal in den Aufbau der WP-Templates hinein zu kommen.
Hi!
Super dein Beitrag! Genau so eine Stück für Stück-Anleitung habe ich gesucht. Da selber auf Anhieb durchzusteigen ist schon recht schwierig.
Danke!
Gruß Martin
super tutorial, kurz und knapp
wie mache ich es denn, wenn ich zB die Homepage anders aufteilen will, dann muss ich doch irgendwo eine weiche einbauen …
Homepage -> nimm das Template
anderer Seite -> nimm dieses Template
ansonsten ein übersichtliches tolles Tutorial
Super Tutorial. Genau das habe ich gesucht. Super erklaert und sehr verstaendlich.
Beste Gruesse aus den USA. Gerrit
Hey, super Tutorial. Endlich mal ein kurzes, verständliches und vor allem vollständiges, genau nach sowas habe ich die ganze Zeit über gesucht. Das einzige, was ich zu bemängeln habe, ist der Abschnitt zur style.css, da könnte man noch ein wenig näher auf die benötigten Angaben eingehen. Aber gut, dann suche ich mir das, was ich benötige, halt aus einer CSS-Befehlsliste raus, ist ja auch nicht tragisch
Liebe Grüße
@kristall
am einfachsten ist wenn du dir den webdeveloper &oder firebug für firefox holst damit kannst du während du dein theme anguckst (also ist aktiviert und du befindest dich in deinem blog) per mauszeig alle klassen id´s etc anzeigen lassen
gruß can
Danke Kurz und gut!
Gut beschrieben!
Danke sehr!
verständlich erklärt…
die codes hätten etwas übersichtlich eingepflegt werden können:)
gibt es demnächst auch ein tuto für functions.php im wp?