Child-Theme erstellt

WordPress Header, Foto: Cowboy of Bottrop, Lizenz: CC-by-sa 3.0 de
WordPress Header, Foto: Cowboy of Bottrop, Lizenz: CC-by-sa 3.0 de
closeDieser Beitrag wurde vor 11 Jahren 7 Monaten 18 Tagen veröffentlicht. Die Informationen in diesem Beitrag sind möglicherweise veraltet. Bitte benutze die Suche oder das Archiv, um nach neueren Informationen zu diesem Thema zu suchen.

WordPress TitleNachdem ich die Tage ein neues Theme hier im Blog aktiviert habe, mussten da natürlich noch ein paar Anpassungen daran vorgenommen werden. Dafür habe ich nun ein Child-Theme erstellt.

Der Vorteil ist, dass ich ein eigenes Theme habe, in dem ich nur die Änderungen und Ergänzungen zum Original (Parent-Theme) verwirkliche. Alles andere kommt aus dem Original, was kann ich dann auch jederzeit ohne Verlust meiner meiner Anpassungen aktualisieren kann. :smoke:

Meine Anpassungen sind allen voran eine deutsche Sprachdatei, mit der die im Theme definierten Texte übersetzt werden. Das Problem dabei: Im Original sind die Texte zwar (fast) alle für die Übersetzung per Sprachdatei vorbereitet, es wurde aber nirgends die Textdomain definiert und aufgerufen. Jetzt habe ich die Sprachdatei natürlich im Child-Theme eingefügt, aber die Texte in den Dateien des Parents wollten nicht deutsch werden. Zur Lösung komme ich später, erst mal was generelles zu Child-Themes.

Das Child-Theme befindet sich also in einem eigenen Verzeichnis unterhalb von /wp-content/themes, und beinhaltet zwingend die Datei style.css. Dann ist das Child-Theme ganz normal im Backend auswählbar. Bei mir handelt es sich wir gesagt um das Tiger-Theme, welches im Verzeichnis tiger liegt. Das Child-Theme liegt nun daneben im Verzeichnis tiger-cowboy. Das Stylesheet beinhaltet dann zunächst mal Folgendes:

/*
Theme Name: Cowboy's Tiger-Child-Theme
Theme URI: http://www.jocoxdesign.co.uk/wordpress-themes/tiger
Description: A clean and simple orange/dark grey theme with optional site logo and favicon upload, breadcrumbs, latest posts slider, social networking icon and Google Analytics intergration via the Theme Options. Also includes separate blog and full-width page templates, support for the Wp-PageNavi plugin, threaded comments, post thumbnails, drop down navigation and integrated search.
Author: Jo Cox Design (Child-Theme von Markus Bloch)
Author URI: http://www.jocoxdesign.co.uk
Template: tiger
Version: 1.0
Tags: custom-menu, microformats
License: GNU General Public License
License URI: http://www.gnu.org/licenses/gpl-2.0.html

*/

@import url("../tiger/style.css");

Erforderliche Angaben dabei sind „Theme Name“ und „Template“. Ersterer benennt das Theme mit dem Namen, den man nachher im Backend findet, Letzteres definiert das Eltern-Theme, auf welches sich bezogen wird. Dabei wird der Name des Verzeichnisses angegeben, in welchem das Theme liegt. Dabei ist Groß- und Kleinschreibung zu beachten! Den Rest habe ich einfach aus dem Original übernommen, man hätte das aber auch weg lassen können.

Ich beziehe mich hier also auf das Theme im Verzeichnis „tiger“, und damit hole ich mit ohne eine weitere Codezeile alle Funktionalität in mein Child-Theme.

Mit der letzten Zeile lade ich das Stylesheet des Eltern-Themes, und habe somit auch das Design 1:1 übernommen. Damit ist das Child-Theme einsatzbereit, nur erkennt man natürlich noch keinen Unterschied zum Original. Klar, ich habe ja auch noch keine Anpassungen gemacht. ;)

Mich hat hier gestört, dass die Smilies per CSS auf Zeilenhöhe festgelegt sind. Man erkennt sie kaum, daher habe ich im Stylesheet des Child die Höhe vergrößert, und dann auch bei den Kommentaren des Autors eine orangefarbenen Linie am linken Rand eingefügt. Zuletzt habe ich die Links auf der Linkseite formatiert.

/*
Theme Name: Cowboy's Tiger-Child-Theme
Theme URI: http://www.jocoxdesign.co.uk/wordpress-themes/tiger
Description: A clean and simple orange/dark grey theme with optional site logo and favicon upload, breadcrumbs, latest posts slider, social networking icon and Google Analytics intergration via the Theme Options. Also includes separate blog and full-width page templates, support for the Wp-PageNavi plugin, threaded comments, post thumbnails, drop down navigation and integrated search.
Author: Jo Cox Design (Child-Theme von Markus Bloch)
Author URI: http://www.jocoxdesign.co.uk
Template: tiger
Version: 1.0
Tags: custom-menu, microformats
License: GNU General Public License
License URI: http://www.gnu.org/licenses/gpl-2.0.html

*/

@import url("../tiger/style.css");


.wp-smiley {
	margin:0 !important;
	max-height:1.2em;
}

.bypostauthor {
	border-left: 3px solid #f90;
	padding-left: 5px;
}

/* ROCKING BLOGROLL */
div.bookmark {
	display: block;
	text-align: left;
	min-height: 60px;
	background-image: url("images/bg.png");
	padding: 5px;
	margin-top: 5px;
	font-size: .95em;
	color: #fff;
}

div.bookmark img {
	float: left;
	background: #fff;
	color: #000;
	margin: 0 10px 5px 0;
	padding: 3px;
	width: 50px;
	heigth: 50px;
}

Die Regeln für die Klassen .wp-smiley und .bypostauthor finden sich bereits im Stylesheet des Eltern-Themes. Sie werden mit den Regeln aus dem Child-Theme überschrieben. Die Regeln für die Rocking Blogroll werden ergänzt, da sie im Original nicht vorkommenm.

Damit sind die Designanpassungen auch schon abgeschlossen. Aber die Rocking Blogroll, die mir die Links generiert und die Letzten Artikel aus den jeweiligen RSS-Feeds holt, muss noch definiert werden. Der notwendige Code kommt in die functions.php, die dafür im Verzeichnis des Child-Themes erstellt wird. Dazu noch einige andere Ergänzungen, wie z.B. die Eingabefelder für die Kontaktdaten im eigenen Benutzerprofil.

Und in den Theme-Funktionen wird für gewöhnlich auch die Textdomain für die Übersetzung aufgerufen. Dazu genügt eine Zeile:

load_theme_textdomain('tiger', get_template_directory() . '/languages');

Damit werden die Textdateien im Unterverzeichnis „languages“ gesucht und, sofern vorhanden, auch gefunden. für Child-Themes gibt es die Funktion load_child_theme_textdomain(), aber aus igendwelchen Gründen wurde die Sprachdatei nicht geladen. Die Suche durch zig verschiedene Blogs zum Thema boten immer andere Lösungen zur Definition des Verzeichnisses an, aber letztlich bin ich nicht mit einem solchen Einzeiler ausgekommen, sondern musste eine Funktion schreiben. Somit findet sich in der functions.php des Child folgender Code:

function x_theme_setup() {
	load_child_theme_textdomain( 'tiger', apply_filters('stylesheet_directory', get_stylesheet_directory() ) . '/languages' );
}
add_action ('after_setup_theme', 'x_theme_setup' );

Damit habe ich zumindest die Theme-Dateien übersetzt, die ich zur Anpassung auch im Child-Theme habe. Ein paar Übersetzungen beziehen sich auf die originale functions.php, hier funktioniert die Übersetzung aber (noch) nicht. Wie gesagt, im Original gibt es keine Sprachdateien, und auch keinen Aufruf der Textdomain.

Die wichtigsten PHP-Dateien des Themes habe ich einfach vom Parent- und das Child-Theme kopiert, und da dann einige Anpassungen vorgenommen. So z.B. das Page Peel des AK Vorrat oben rechts, oder die Überwach-Leiste am oberen Bildrand. Aus der page.php, die für die statischen Seiten zuständig ist, habe ich die Kommentare entfernt, die Kommentar-Datei und das Suchformular waren nicht auf GetText vorbereitet, und im Footer wurde der WebReflow Tracking-Code integriert. Die 404.php wurde mit Inhalt gefüllt, und fertig sind meine Anpassungen. Jetzt hab ich erst mal keine Lust mehr, aber ich muss mich noch um die Einbindung der Sprachdatei in das Original-Theme kümmern…

Keep it Country, Markus
Über Markus 1267 Artikel
Ich schreibe hier über Country Music und Linedance, vor allem über besuchte Veranstaltungen, aber auch Geocaching, Fußball und Politik gehören zu meinen Themen. Politisch bin ich eher links-liberal einzuordnen, beim Fußball steht der FC Schalke 04 im Mittelpunkt des Interesses.

Hinterlasse jetzt einen Kommentar

Kommentar hinterlassen

E-Mail Adresse wird nicht veröffentlicht.

*


Mit Absenden des Kommentars akzeptiere ich die Speicherung und Verarbeitung meiner Daten gemäß der Datenschutzerklärung.


;) 
:) 
:D 
:( 
:/ 
:p 
:o 
:lol: 
:roll: 
:angry: 
:smoke: 
:mrgreen: 
:silence: 
:blush: 
:kiss: 
mehr...