Wordpress - Child Themes - Versionsgeschichte

37.49.72.8: /* Hinweise */

2019-05-10T12:24:39Z

Hinweise

37.49.72.8: /* Hinweise */

2019-05-10T09:13:58Z

Hinweise

37.49.72.8 am 10. Mai 2019 um 09:12 Uhr

2019-05-10T09:12:19Z

37.49.32.84 am 13. März 2017 um 19:54 Uhr

2017-03-13T19:54:16Z

37.49.32.84 am 13. März 2017 um 19:32 Uhr

2017-03-13T19:32:46Z

37.49.33.84: Die Seite wurde neu angelegt: „== Links == https://codex.wordpress.org/Child_Themes == Minimales Child Theme == * Ordner mit Template Name erstellen (recommended: meinTemplateName-child) * Mi…“

2015-03-31T10:02:02Z

Die Seite wurde neu angelegt: „== Links == https://codex.wordpress.org/Child_Themes == Minimales Child Theme == * Ordner mit Template Name erstellen (recommended: meinTemplateName-child) * Mi…“

Neue Seite

== Links ==
https://codex.wordpress.org/Child_Themes

== Minimales Child Theme ==

* Ordner mit Template Name erstellen (recommended: meinTemplateName-child)
* Mindestens style.css und functions.php anlegen
* Header für style.css
<pre>
/*
Theme Name: Twenty Fifteen Child
Theme URI: http://example.com/twenty-fifteen-child/
Description: Twenty Fifteen Child Theme
Author: John Doe
Author URI: http://example.com
Template: name_of_parent_template_folder
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
Text Domain: twenty-fifteen-child
*/
</pre>
* Enqeue Parent and Child Theme Styles
functions.php
<pre>
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
wp_enqueue_style( 'child-style', get_stylesheet_uri(), array( 'parent-style' ) );
}
</pre>

== Styles im Stylesheet einbinden ==

Einfache Möglichkeit wenn das Parent Stylesheet nur eine style.css Datei benutzt:
<pre>
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );

}
</pre>
Bei mehreren Stylesheets im Eltern Theme:
<pre>
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
wp_enqueue_style( 'child-style',
get_stylesheet_directory_uri() . '/style.css',
array('parent-style')
);
}
</pre>

← Nächstältere Version		Version vom 10. Mai 2019, 12:24 Uhr
Zeile 56:		Zeile 56:

	Was genau in dem array stehen muss, ist natürlich '''von Theme zu Theme verschieden'''en. Bei Twentyfifteen heisst der handle, mit dem die Styles eingebunden werden, ‚twentyfifteen-style‘. '''Zu finden ist diese Information in der functions.php''' von Twentyfifteen in Zeile 209.		Was genau in dem array stehen muss, ist natürlich '''von Theme zu Theme verschieden'''en. Bei Twentyfifteen heisst der handle, mit dem die Styles eingebunden werden, ‚twentyfifteen-style‘. '''Zu finden ist diese Information in der functions.php''' von Twentyfifteen in Zeile 209.
		+
		+	==== Caching Probleme umgehen ====
		+	<pre>
		+	wp_enqueue_style( 'scheme-custom',
		+	get_stylesheet_directory_uri() . '/css/scheme-custom.css',
		+	$deps,
		+	wp_get_theme()->get('Version') // Bust Cache to ensure loading
		+	);
		+	</pre>

	== Minimales Child Theme ==		== Minimales Child Theme ==

@@ Zeile 48: / Zeile 48: @@
 ===Hinweise===
-Bei manchen Themes, die mit mehreren CSS-Dateien arbeiten, kann es nämlich nötig sein, zuvor die CSS-Dateien des Eltern-Themes zu deregistrieren und noch einmal neu zu registrieren. So stellt man sicher, dass die Reihenfolge stimmt, in der die Styles geladen werden – Eltern-Theme zuerst, erst danach die vom Childtheme.
+==== Reihenfolge garantieren ====
-In der oben gezeigten Funktion wird zuerst das CSS des Eltern-Themes geladen. Das erreicht man dadurch, dass man dem Child-CSS eine dependency (Abhängigkeit) zuweist, nämlich das Parent-CSS. Im Codebeispiel ist das der Teil, der in dem array steht:
+Bei manchen Themes, die mit mehreren CSS-Dateien arbeiten, kann es nämlich '''nötig sein, zuvor die CSS-Dateien des Eltern-Themes zu deregistrieren und noch einmal neu zu registrieren'''. So stellt man sicher, dass die Reihenfolge stimmt, in der die Styles geladen werden – Eltern-Theme zuerst, erst danach die vom Childtheme.
 == Minimales Child Theme ==

@@ Zeile 1: / Zeile 1: @@
 == Links ==
-https://codex.wordpress.org/Child_Themes
+ https://codex.wordpress.org/Child_Themes
 == Bessere Anleitung ==
@@ Zeile 110: / Zeile 111: @@
 Mit phpmyadmin einfach die Optionen aus dem Elterntheme Eintrag kopieren und in das Child Theme eintragen.

← Nächstältere Version		Version vom 13. März 2017, 19:54 Uhr
Zeile 103:		Zeile 103:
	}		}
	</pre>		</pre>
		+
		+	== Optionen aus Parent Theme nachträglich übertragen ==
		+	Wenn schon Einstellungen in den Optionen des Elternthemes gemacht wurden, kann man diese relativ einfach übertragen. Die Optionen werden in der Datenbank in der Tabelle wp_options gespeichert. Jedes Theme bekommt einen Eintrag der mit theme_mods_ beginnt und mit dem Namen des Themes aufhört. So findest du den Eintrag.
		+
		+	SELECT * FROM `wp_options` WHERE option_name = "theme_mods_themename"
		+
		+	Mit phpmyadmin einfach die Optionen aus dem Elterntheme Eintrag kopieren und in das Child Theme eintragen.

← Nächstältere Version		Version vom 13. März 2017, 19:32 Uhr
Zeile 2:		Zeile 2:
	https://codex.wordpress.org/Child_Themes		https://codex.wordpress.org/Child_Themes

		+	== Bessere Anleitung ==
		+	Quelle: https://die-netzialisten.de/wordpress/anleitung-childtheme-anlegen-update/ (2017-03)
		+	=== Zusammenfassung ===
		+	Zusammenfassung
		+	Um ein Childtheme anzulegen, sind folgende Schritte notwendig:
		+
		+	* Ein neues Verzeichnis für das Childtheme anlegen und benennen (Name frei wählbar).
		+	* Das Verzeichnis muss auf derselben Ebene liegen wie das Verzeichnis des Elternthemes.
		+	* Im Childtheme-Verzeichnis eine leere Datei anlegen und diese Datei style.css nennen.
		+	* In die style.css die Zeilen für den CSS-Header (siehe Beispiel für eine Childtheme CSS-Datei) einfügen. Dabei darauf achten, dass hinter „Template“ exakt der Name (slug) des Verzeichnisses des Elternthemes steht.
		+	* Eine leere Datei anlegen und diese functions.php nennen.
		+	* Im Childtheme die Datei functions.php anlegen und dort den Code eintragen, der für die Einbindung/Verknüpfung der CSS-Dateien aus Eltern- und Childtheme sorgt (siehe
		+	Das CSS des Elternthemes mit dem Childtheme verknüpfen).
		+	* Jetzt ist das Childtheme einsatzfähig und im Backend auswählbar.
		+	* Wer Lust hat, legt noch einen Screenshot (screenshot.png) ins Childtheme-Verzeichnis. Dann sieht es im Backend in der Themeauswahl hübscher aus.
		+	themes Ordner:
		+
		+	===Beispiel===
		+	style.css
		+	<pre>
		+	/*
		+	Theme Name: Das neue Childtheme
		+	Description: Ein schönes Childtheme
		+	Author: Kirsten Schelper
		+	Author URI: http://www.schelperdesign.net
		+	Template: Name_des_Parent-Theme-Ordners
		+	Version: 1.0
		+	Tags:
		+	*/
		+	</pre>
		+	functions.php
		+	In dieser Datei binden wir das Stylesheet der Childthemes ein und zwar so, dass es nach der style.css des Parent-Themes geladen wird. Wäre die Reihenfolge anders herum, würden wir unsere Änderungen im Childtheme nicht sehen, weil das CSS vom Childtheme vom Parent-Theme überschrieben würde.
		+
		+
		+	<pre>
		+	function twentyfifteen_child_styles() {
		+	wp_deregister_style( 'twentyfifteen-style');
		+	wp_register_style('twentyfifteen-style', get_template_directory_uri(). '/style.css');
		+	wp_enqueue_style('twentyfifteen-style', get_template_directory_uri(). '/style.css');
		+	wp_enqueue_style( 'childtheme-style', get_stylesheet_directory_uri().'/style.css', array('twentyfifteen-style') );
		+	}
		+	add_action( 'wp_enqueue_scripts', 'twentyfifteen_child_styles' );
		+	</pre>
		+
		+	===Hinweise===
		+	Bei manchen Themes, die mit mehreren CSS-Dateien arbeiten, kann es nämlich nötig sein, zuvor die CSS-Dateien des Eltern-Themes zu deregistrieren und noch einmal neu zu registrieren. So stellt man sicher, dass die Reihenfolge stimmt, in der die Styles geladen werden – Eltern-Theme zuerst, erst danach die vom Childtheme.
		+	In der oben gezeigten Funktion wird zuerst das CSS des Eltern-Themes geladen. Das erreicht man dadurch, dass man dem Child-CSS eine dependency (Abhängigkeit) zuweist, nämlich das Parent-CSS. Im Codebeispiel ist das der Teil, der in dem array steht:
		+
		+	array('twentyfifteen-style')
		+	Was genau in dem array stehen muss, ist natürlich von Theme zu Theme verschiedenen. Bei Twentyfifteen heisst der handle, mit dem die Styles eingebunden werden, ‚twentyfifteen-style‘. Zu finden ist diese Information in der functions.php von Twentyfifteen in Zeile 209.
	== Minimales Child Theme ==		== Minimales Child Theme ==