Adressen für kostenlose WordPress-Themes gibt es ja wie Sand am Meer. Einen schönen Überblick hab ich hier gefunden. Dort wird auch kurz angerissen, wie themes den eigenen Bedürfnissen angepasst werden können. Da ich das auch gerade alles hinter mir habe, will ich im folgenden berichten, wie das im Detail funktioniert und welche Dateien zu bearbeiten sind. Aus der Sicht eines Anfängers – für Anfänger.
Auf der Suche nach einer Vorlage sollten Sie nicht nur beachten, ob das Layout passt – Sie sollten auch darauf achten, welche widgets implementiert sind (die ggf. auch bearbeiten werden müssen) und die gewählte Vorlage auch mal auf Funktionalität und Zuverlässigkeit testen – einfach mal spielen und am besten alle widgets ausprobieren.
Sie haben Ihr Template gefunden? – Na, dann kann’s ja losgehen. Ein klein wenig Grundkenntnisse im Umgang mit einem ftp-Clienten und im Vergeben der entsprechenden Dateirechte setze ich voraus – ansonsten können Sie in meinem früheren Aufsatz „WordPress einrichten“ gerne nachlesen, wie schön das auch mit der Firefox-Erweiterung „fireFTP“ funktioniert. Dort hab ich ohnehin auch versprochen, dass das Anpassen von englischen themes noch genauer erörtert wird. Wie gesagt: Der Artikel richtet sich an Anfänger, die einen groben Überblick über die zu bearbeitenden Dateien des WordPress-Vorlagenordners erlangen wollen.Gewisse english-Grundkenntnisse von großem Vorteil und Sie sollten den Mut haben, sich an die Quellcodes heranzuwagen. Sie müssen nicht unbedingt php können (ich kann es auch nicht) – aber Sie sollten etwas EDV-Verständnis mitbringen und selbst spielend erlernen können, was die ein oder andere Änderung bewirkt. Sie sollten also in der Lage sein, sich hineinzudenken. Als Autofahrer müssen Sie kein KfZ-Meister sein.
Zunächst sollten Sie die Vorlage schon einigermaßen konfigurieren und feststellen, was alles geändert werden muss. Das sind zumeist Ünersetzungen engl./deutsch – aber auch Änderungen von Verknüpfungen, oder Anpassung von Seiten-Elementen.Dann ist der ftp-Ordner das Ziel unserer Begierde, in dem sich die gewählte Vorlage /wp-content/themes/Theme_name befindet. In diesem Ordner befinden sich die Dateien, die Ihren Bedüfnissen angepasst werden müssen. Die nachfolgende Tabelle liefert einen groben Überblick, welche Dateien Sie bearbeiten müssen (das sind zumindest die Dateien, die sich in meinem Theme befinden). konstruktive Kritk, Vorschläge oder Ergänzungen sind willkommen 🙂
Ein Artikel, den Sie später verfassen, kann auf unterschiedliche Weise aufgerufen werden. Ihr Artikel könnte z.B. über die Archiv- , die Tag- , die Suchen-Funktion oder auch über die zugeordnete Kategorie geöffnet werden. Jedesmal wird Ihr Artikel etwas anders präsentiert. Einmal erscheint nur ein Auzug Ihres Artikels (excerpt) – zB. im Archiv – im . Außerdem ist es noch wichtig zu wissen, dass eine gewisse Hierarchie der Templates festgelegt ist: Falls ein „Spezialtemplate“ nicht vorhanden ist, nimmt WordPress dann das nächst bessere Standrad-Template (z.B. die single.php). Wie diese Hierarchie im Einzelnen funktioniert bw. festgelegt ist, können Sie bei codex.wordpress.org nachlesen. Sämtliche Dateien sollten zunächst gesichert werden, bevor Sie diese bearbeiten; Dateirechte auf 666
404.php | Diese Seite erscheint, wenn die aufgerufene Seite nicht gefunden werden kann (fehlerhafter Link, umbenannte Seite). Wenn Sie Ihren Besuchern eine schönere bzw. aussagekräftigere Fehlermeldung präsentieren wollen sind Sie hier richtig. Provozieren Sie doch einfach mal meine Fehlermeldung, indem sie in der Adressleiste nach „https://www.plerzelwupp.de/“ noch ein „grmpflgrks“ setzen (oder so was ähnliches 😉 |
archive.php | Wichtig, wenn Sie ein Archiv anbieten. Hier wird das Erscheinungsbild des Archivs festgelegt. Es genügt, wenn Sie die Einstellungen für Ihren Archivtyp ändern (und dran denken, wenn Sie das mal umstellen). Wenn Sie ein Monatsarchiv anbieten, wäre das beispielsweise die Einstellung unter „monthly archive“. Hier können Sie u.a. die Überschrift und das Datumsformat für das Archiv festlegen. z.B.
Außerdem bearbeiten Sie hier auch den Zeitstempel, den jeweiligen Artikel-header und -footer Ihrer Rubrik „Archiv“ (das, was über und unter dem jeweiligen Artikel im Archiv steht. Nicht zur verwechseln mit dem Seiten -header und -footer). Das wäre zum Beispiel die Kommentarfunktion, die Anzeige der Tag-Zuordnungen oder das Einrichten eines Excerpts (anstelle des jeweils vollständigen Artikels). |
archives.php | Salopp gesagt: diese Datei „macht“ das Archiv, ist aber nicht für das Erscheinungsbild zuständig. Der Name dieser Datei ist beliebig – heisst jedoch meistens archives.php. Hier sollten normalerweise keine Änderungen erfoderlich sein. |
attachment.php | Diese Seite erscheint, wenn Sie mit Anhängen arbeiten – beispielsweise eine WP-Galerie einfügen. Sie ist also auch nicht zwingend erforderlich. Manchmal heisst Sie auch image.php. Ist die Datei nicht vorhanden, greift zumeist die single.php
Möchten Sie eine attachment.php z.B. für eine WP-Bildergaleire erstellen, so können Sie auch die single.php kopieren und umbenennen. |
comments-popup.php | Zumindest für Anfänger nicht erforderlich. Die comments-popup.php kommt erst dann zum Tragen, wenn die Kommentarfunktion als popup genutzt wird. Ist Blödsinn, deshalb gehe ich nicht weiter darauf ein. Wenn es diese Seite nicht gibt, greift der Standard: Die comments.php |
comments.php | Wie der Name schon vermuten lässt, werden hier die Kommentarelemente editiert. Diese Seite erscheint, wenn Sie einen Artikel über den Kommentar erreichen oder einen Kommentar verfassen „Es ist ein Kommentar vorhanden: Hans schreibt am 27.12.2008 blablabla“. Wenn Sie die Kommentarfunktion nutzen, müssen Sie (bei engl Templates) diese Seite übersetzen. z.B. die Anzahl der Kommentare: Ihr Artikel hat entweder „keinen Kommentar“, „einen Kommentar“ oder „x Kommentare“ wird übersetzt von:
nach
|
footer.php | Das ist die Fußzeile der Seite und sollte eigentlich bei allen Seiten angezeigt werden (scrollen Sie diese Seite nach unten, so sehen Sie auch meine Fußzeile). Hier verewigen sich auch die Ersteller des Original-Templates bzw. die Ersteller Ihrer Vorlage. Bitte lassen Sie den Verweis auch stehen. Das gehört sich so und wird auch so erwartet. Ansonsten gilt: Es kann hier allerlei Allgemeines rein, sollte aber nicht überladen werden. Oft finden Sie hier noch eine Allgemeine Blog-Info, einen Verweis auf das Impressum oder ein Link zu Ihrem RSS-Feed (der sollte noch bearbeitet werden, wenn sie den feed beispielsweise über feedburner anbieten wollen). Weil die Fußzeile auf jeder Seite angezeigt wird, könnte hier z.B. auch ein Statistik-Code eingefügt werden. |
functions.php | Legt fest, wie die Widgets in der Sidebar ausgegeben werden. Hier könnte ggf. eine Änderung erforderlich werden (z.B. Überschriften übersetzen – sofern diese nicht direkt im Widget geändert werden kann). Ansonsten würde ich empfehlen, hier nicht so viel herum zu spielen. |
header.php | Analog zum footer: Das ist die Seitenkopfleiste, die über jeder Seite angezeigt wird. Zwischen <head></head> befinden sich die Angaben des „klassischen“ Kopfbereichs – hier wird zum Beispiel die Sprache festgelegt, aber auch der Seitentitel, Beitragstitel bzw. Kategorietitel generiert. Ab (<body> ) kommen die dann die sichtbaren Bereiche. Bilder im Header werden über das Sylesheet style.css verlinkt – (sämtliche Formatanweisungen befinden sich in der style.css). Im Header-Body-Bereich wird auf das Stylesheet verwiesen (z.B. . <div id=“top“>). In der style.css wird dann unter „top“ das Image verlinkt. Sie können aber auch wie folgt vorgehen, wenn Sie ein eigenes Bild einbetten wollen: Erkunden Sie zunächst, wie das Bild des Original-Templates hieß (z.B. headr.jpg), dann suchen Sie per ftp diese Datei in dem Template-Ordner. Die original-Datei benennen sie (zur Sicherheit) um, z.B. header.jpg.old. Anschließend laden Sie Ihre eigene headr.jpg hoch. Die Pixelmaße Ihrer headr.jpg sollten Sie an die style.css anpassen. Sie müssten sich mit Pixelbreiten (z.B. narrowcolumn, sidebar) und Abständen herumschlagen. Wenn Sie sich Pixelrechnerei ersparen wollen, schauen Sie sie vorher, ob in der style.css unter footer oder header (sind ja i.d.R. gleich breit) die Gesamtbreite angegeben ist. Häufig geben die Template-Ersteller auf Ihren Downloadseiten auch die Breiten und Höhen an. Für den schnelleren Erfolg sollten Anfänger möglichst nicht mit den Pixelmaßen der style.css spielen. Daher empfehle ich, ein Template herauszusuchen, bei dem die Maße schon Ihrem Geschmack und Ihren Erfordernissen entsprechen. Wie gesagt: passen sie lieber das header-Bild an. |
index.php | Das is die Start- bzw. Heimatseite Ihre Blogs. Hier werden Übersetzungen erfoderlich. Im Prinzip ist die Vorgehensweise analog der archive.php – nur dass Sie hier nicht Ihr Archiv, sondern Ihre Startseite gestalten. |
links.php | Zeigt normalerweise die Links Ihrer wp_list_bookmarks() und ignoriert den Seiteninhalt. Änderungen sind nur erforderlich, wenn Sie später eine eigene Blogroll bzw Linkliste einfügen. |
page.php | Hier wird das Erscheinigsbild Ihrer statischen Seiten festgelegt (z.B. das Kontaktformular oder ihr Impressum). Im Prinzip wie bei der archive.php oder index.php: Je nachdem, welche Anhängsel Ihre statischen Seiten haben sollen. |
search.php | Das ist die Seite für die Suchergebnisse. Die wird natürlich nur erforderlich, wenn Sie auch eine Suchfunktion anbieten. Die Seite wird bearbeitet und übersetzt wie zuvor schon die archive.php und index.php. Darüber hinaus müssen Sie die sonstige Eventualitäten einer Seitensuche abklopfen und auch diese Bereiche übersetzen (aus „sorry, no search-results“ wird z.B. „Ihre Suche ergab leider keine Treffer“ . Am besten Sie bieten als Suchergebnis auch Ihr Excerpt (Auszug) und nicht die kompletten Artikel an: So könnte ggf. <?php the_content(); ?> durch <?php the_excerpt(); ?> ersetzt werden (falls dem noch nicht so ist). Wer’s lieber kompliziert mag: Es gibt auch excerpt-plugins. |
searchform.php | Hier kann das Suchformular Ihren Bedürfnissen angepasst werden. Im Prinzip müssten hier nur die Suchformularfelder eingedeutscht werden. Mein Suchformular (siehe links oben) wird mit „Auf gut Glück“ abgeschickt. Ich weiss auch nicht, was mich da geritten hat. Das ändere ich demnächst. |
sidebar.php | Das sind Ihre Navigationsleist(en) . Falls Sie mehrere Menüleisten haben, sind Sie hier auch unterteil (z.B. right und left). Es werden die einzelnen Elemente abgerufen. Die Formatierungen hingegen sind (wie überall) in der style.css hinterlegt (siehe oben)!!! |
single.php | Das ist die Haupt-Ansicht Ihres jeweiligen Artikels (auf den dann auch verlinkt werden kann). Meist noch mit Kommentarfeld. Ansonsten gilt hier: ebenfalls übersetzen und anpassen wie die archive.php oder index.php (hier natürlich keine „excerpt“ – denn es ist ja unser „content“) |
style.css | Dreh und Angelpunkt sämtlicher Formatierungen (z.B. Schriftformatierungen, Textfarbe, Linkfarbe, Größe der einzelnen Elemente, usw.). Zu den Pixelrechnerei – Breiten und Högen werde ich hier nichts schreiben. Dar+ber hab ich mich oben schon kurz ausgelassen. Und einiges zur style.css hab ich ja schon bei den php-Dateien erwähnt. Deshalb ergänzend nur noch ein paar Worte zu Farben und Hintergründe. Die Webfarben und deren Bezeichnung sind bei Wikipedia schön erklärt: Wiki-Webfarben. Beachten Sie z.B., dass farbige Hintergründe (z.B. der Sidebar) nicht immer aus css-Farben erstellt werden (z.B. bei Verläufen). Stattdessen werden Hintergrundbilder – z.B hintergund.png eingesetzt. Wenn SIe Ihre farbigen Hintergründe über css erstellen, können Sie auf die Farbtabellen zugreifen. Es geht auch mit Photoshop: Über den Farbwähler können Sie den Code für Hex-Farben oder websichere Farben anzeigen oder umgekehrt. Sie könnten beispielsweise ein Screenshot von Ihrer Seite erstellen, mittels Pipette Farben aufnehmen und ggf. mit dem Farbwähler noch etwas anpassen (damit das auch harmonisch wirkt). Den Code können Sie dann in der style.css einfügen. Ich würde mich dabei auf websichere Farben beschränken. |
Wie gesagt, soll mit dem vorliegenden Artikel ein grober Überblick über die Dateien vermittelt werden, die zu bearbeiten bzw. zu übersetzen sind. Es soll in erster Linie für Anfängern einen Einstieg sein, um fertige Templates anzupassen bzw. zu übersetzen. Gerne können Sie sich hier auch austauschen oder Ihre Kritik loswerden. Auch Email-Anfragen über das Kontaktformular sind willkommen.
Stefan sagt
Ich bin begeistert. So einen Überblick hätte ich gern schon eher gefunden 🙂
Danke!
Gucky sagt
Ich such mich immer dämlich nach den PHP-Befehlen die IN den Seiten stehen. Also was die bewirken… also jetzt speziell für WP.
Hast du da auch irgendwo was ? Oder einen Link darauf ? Oder gibt es das auch möglicherweise in deutscher Sprache ?
Ich habe das wie gesagt schon mal bei WP gesehen, aber ich such mir immer einen „Wolf“ bis ich die Seite gefunden habe… 🙁
Jaja… ich weiß… hätte ich in die Lesezeichen legen sollen als ich mal gefunden hatte…
Solche Überblicke sind immer sehr hilfreich. Obwohl ich die Bedeutung der meisten (wichtigsten) Dateien kenne. Also wofür die sind…
Stefan sagt
Hier wirst Du fündig, falls ich plerzelwupp mal vorgreifen darf:
http://doku.wordpress-deutschland.org/Hauptseite
🙂
plerzelwupp sagt
@Stefan: Dankeschön für die rasche Hilfe 🙂
@Gucky: Mir ging es unächst darum, einen raschen Überblick zu bekommen; was die einzelnen Dateien bewirken – und diese dann zu „übersetzen“. Ich selbst bin kein php-Experte – versuche mich immer auf ein Problem zu konzentrieren und dieses dann zu lösen. Das geht meistens und reicht für das Übersetzen eines Themes vollkommen aus.
Um „frei“ programmieren zu können fehlen mir die Sprachkenntnisse (Syntax, etc). Deshalb konzentrier ich mich auf Codeschnippsel, Anleitungen und Tutorials von den „wahren“ Profis. Beim Einsetzen gehört auch etwas Experimentierfreude dazu (vorher immer alles sichern).
Wie bereits im Artikel erwähnt – das hier soll einen Einstieg und groben Überblick liefern
Gucky sagt
@Danke Stefan… DAS habe ich gesucht !
DAS sollte keine Beschwerde oder Meckerei sein… 😯
Man muß ja auch das Rad nicht neu erfinden. Aber um „Nachbasteln“ zu können finde ich es wichtig – neben den Seiten die dafür zuständig sind – auch die Befehle zu kennen bzw. was sie bewirken.
Deshalb hatte ich gefragt…
plerzelwupp sagt
Nein, nein – das hab ich auch niemals so aufgefasst. Hab das schon richtig verstanden – alles ist gut 😉
togo sagt
Hallo,
schöne Übersicht, die mir sehr weiterhilft. eine Frage habe ich aber noch: In welcher Datei kann ich die Anzahl der auf der Statseite veröffentlichten Artikel bestimmen? Ich suche mich seit Tagen blöde… dachte, das ginge über die Einstellungen, habe aber auch da nichts gefunden. Kannst Du mir da weiterhelfen?
Beste Grüße 😉
togo sagt
Okay, vergiss meine Frage… manchmal sollte ich doch über eine Brille nachdenken 🙁
plerzelwupp sagt
Vielen Dank für die Rückmeldung, togo. Freut mich, wenn Dir durch den Beitrag ein wenig geholfen wurde 🙂
Andi sagt
Hey, solch eine Übersicht hilft mir grad wirklich weil ich seid 2 Wochen erst mich dazu entschlossen habe mich in dieser Welt auch einzuschließen.
Viele Anfänger haben vermute ich auch die selbe meinung wie ich. Nur eine Anleitung wie man diese noch effektiver einsetzen kann wäre super.
Sebastian B. sagt
Ich bin gerade dabei mich in die Struktur und Funktion der WordPress Themes einzuarbeiten und dieser Artikel war ein gelungener Einstieg. Ich hoffe ich werde langsam aber sicher immer mehr hinter die Kulissen blicken können ;).
Wenn man seinen Blog optisch vom Einheitsbrei abheben will, ist man ja mehr oder weniger dazu gezwungen am Theme herumzubasteln.
extrusionswerkzeuge sagt
Solch eine Übersicht hilft mir sehr, danke Oliver!
kunststoffwinkel sagt
Danke Oliver für Info.
Cornelius Braun sagt
Danke für den Verweis mit den Hierarchien. Das war mir so noch gar nicht bewusst. Aber man lernt ja nie aus. 😉
Christian Fredebeul sagt
Durch Informationen und Anleitungen wie diese wird einem Anfänger wie mir die Angst genommen, etwas kaputt zu machen, das einzige was mich derzeit noch irritiert ist diese unglaubliche Fülle an Informationen, die ich von Zeit zu Zeit gerne mal durcheinander bringe. Vielen Dank für die gut aufgeschlüsselte Übersicht.
ein Synonym für sagt
Eine sehr anschauliche Beschreibung, genau das, was ich schon lange gesucht habe, danke :).
Alex sagt
Platitüden, kein wirklicher Informationswert für jemand der wissen möchte wie man Themes verändert einsetzen kann. Kein Hinweis auf die die Art und Weise wie man Themes anpassen kann.
Kunststoffprofile sagt
Vielen Dank für die gut aufgeschlüsselte Übersicht.
Tim sagt
Ein sehr schönes Anfängertutorial für die template Hirarchien von WP. LG, Tim
Tim sagt
@Alex die gesame Palette der Möglichkeiten zur Templateveränderung bz. Erstellung ist vielleicht für einen Artikel etwas viel verlangt, oder? Für Anfänger ist diese Aufschlüsselung der Templae Hirarchie schonmal ein Anfang. Wer tief in die Templateanpassung einsteigen möchte sollte sich in eines der sehr umfangreichen Tutorials zur Erstellung von WP Themes einlesen. LG, Tim
gerhard sagt
interessante Übersicht – vielen Dank.
Allerdings habe ich eine weitere Frage:
es gibt doch Templates, die mit ‚translation-ready‘ getagged sind (http://wordpress.org/extend/themes/tags/translation-ready).
Wie werden diese Templates verändert – auch über die von dir angesprochenen Einzeldateien oder gibt hier eine generelle Steuerungsdatei?
natursteinfliesen sagt
Sehr interesante Übersicht. Danke für info..