Childthemes 2

@pixolin

MeetUp Köln

Themes ändern, aber richtigChild Themes & Template Hierarchy

© Monica Holli/flickr/CC BY

@pixolin

MeetUp Köln

Das Theme gefällt mir soweit ganz gut, aaaber …

Wie werde ich "Dieser Beitrag wurde unter Allgemein abgelegt am 16. Juni, 2014." wieder los?

Und wie ändere ich die Schriftart?

@pixolin

MeetUp Köln

Bitte nicht …Theme direkt ändern: • wird bei Update

überschrieben • Änderungen/Original

sind schlecht auseinanderzuhalten

@pixolin

MeetUp Köln

Bitte nicht …Design > Editor verwenden: • Macht unter Umständen

die Website unbrauchbar! Beispiel: "White Screen of Death" bei function bla( {}

da fehlt was

@pixolin

MeetUp Köln

Child Themes

@pixolin

@pixolin

MeetUp Köln

Child Theme, DefinitionEin WordPress Child Theme ist ein Theme, das die Funktionalität eines anderen Themes, des so genannten Parent Themes, erbt.

Child Themes sind Ergänzungen, bzw. Ersetzungen des Parent Themes. Sie sind ohne Parent Theme nicht verwendbar.

@pixolin

MeetUp Köln

Bitte nicht …Komplettes Parent Theme oder komplette style.css kopieren

Das Child Theme soll das Parent Theme ergänzen!

(aber: Templates kopieren ist erlaubt.)

@pixolin

MeetUp Köln

Woraus besteht ein Child Theme mindestens?

header.php index.php style.css

mit Template Header und Verweis auf Parent Theme!

@pixolin

MeetUp Köln

Template Header/* Theme Name: Twenty Fourteen Child Theme URI: http://example.com/twenty-fourteen-child/ Description: Twenty Fourteen Child Theme Author: John Doe Author URI: http://example.com Template: twentyfourteen Version: 1.0.0 Tags: light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready Text Domain: twenty-fourteen-child */ !@import url("../twentyfourteen/style.css"); !/* =Theme customization starts here -------------------------------------------------------------- */

@pixolin

MeetUp Köln

Template Header (mindestens!)/* Theme Name: WP Meetup Köln Template: twentytwelve */ !

@import url("../twentytwelve/style.css"); !

/* =Theme customization starts here -------------------------------- */

@pixolin

MeetUp Köln

Cascading Style Sheets heißen so, weil sie in einer verschachtelten HTML-Struktur eine Style-Regel so lange vererben, bis der Wert durch eine andere Regel überschrieben wird.

@pixolin

MeetUp Köln

<html> <head> </head> <body> <h1></h1> <p></p> <p><span class="wichtig"></span></p> </body> </html>

"Cascades" © Darren Johnson/flickr/CC BY

@pixolin

MeetUp Köln

body { color: #333; } gilt für alle nachfolgenden Selektoren, sofern keine spezifischere Regel greift

.wichtig { color: #d12525; }

@pixolin

MeetUp Köln

Wiederholen sich Regeln, überschreibt das zuletzt geladene Style Sheet die vorherigen<link rel="stylesheet" type="text/css" href="reset.css"> <link rel="stylesheet" type="text/css" href="style.css"> <link rel="stylesheet" type="text/css" href="mein-style.css">

@pixolin

MeetUp Köln

Template Header/* Theme Name: WP Meetup Köln Template: twentytwelve */ !@import url("../twentytwelve/style.css"); !/* Google Web Font Dancing Script */ @import url(http://fonts.googleapis.com/css?family=Dancing+Script); !.site-header h1 a { font-family: 'Dancing Script', cursive; }

@pixolin

MeetUp Köln

Template HierarchyWordPress versucht immer, das "am besten geeignete" Template zu verwenden. Beispiel: Kategorie "Hobbits"

category.php ?

archive.php ?

index.php!

category-hobbits.php

?

@pixolin

MeetUp Köln

http://codex.wordpress.org/Template_Hierarchy

@pixolin

MeetUp Köln

@pixolin

MeetUp Köln

front-page.phpUnter Einstellungen > Lesen kann man festlegen, was als Startseite angezeigt wird.

Statische Seite ➛ front-page.php Blogseite ➛ home.php

Existiert das Template nicht, kann man es anlegen!

@pixolin

MeetUp Köln

Templates ändern?• Mit Plugin (z.B. "What The File")

nachschauen, welches Template für die Anzeige verwendet wird.

• Template kopieren, nach Text suchen und HTML editieren.

• Wird der Text mit einer theme-eigenen Funktion erzeugt/verändert?

@pixolin

MeetUp Köln

PHP erlaubt nicht, zuvor deklarierte Funktionen neu zu definieren oder die Definition zu löschen.

@pixolin

MeetUp Köln

Fatal errorKopieren der komplettenfunctions.php führt häufig zu einem Fatale error, weil (mindestens) ein Funktionsname doppelt vorkommt.

@pixolin

MeetUp Köln

Fatal error: Lösung 1Das Parent Theme ist darauf vorbereitet und verwendet

if( ! function_exists(…) )bzw.

if( ! isset(…) )

@pixolin

MeetUp Köln

Fatal error: Lösung 2Funktionen werden in WordPress Schnittstellen hinzugefügt

add_action('hook', 'function');

und lassen sich genauso auch wieder entfernen

remove_action('hook', 'function');

anschließend eigene Funktion hinzufügen

add_action( 'hook', 'myfunction' );

@pixolin

MeetUp Köln

@pixolin

MeetUp Köln

Happy Child Theming!Two children playing with a seated older man. © Boston Public Library/Flickr/CC BY

MG! Heute

Childthemes 2

Internet

Transcript of Childthemes 2