Post on 29-Jan-2018
transcript
Understanding the Relationship Between
Parent & Child Themes
Hashtag
#thisisthebesttalkeveratawordcampanditsaboutparentandchildthemesimeanhowcoolisthatright
Hashtag
#wckc
About Me
About Me
About Me
Between Jobs
About Me
About Me
About Me
About Me
What is a parent theme?
What is a child theme?
What is a child theme?
What is a child theme?“A WordPress child theme is a theme
that inherits the functionality of another theme, called the parent theme, and allows you to modify, or add to, the functionality of that parent theme.”
What is a child theme?“A WordPress child theme is a theme
that inherits the functionality of another theme, called the parent theme, and allows you to modify, or add to, the functionality of that parent theme.”
That is what defines their relationship
Why a child theme?
Setupwp-content
themestwentytenchildtheme
Setupwp-content
themestwentytenchildtheme
style.css
wp-content
themestwentytenchildtheme
style.css
/*Theme Name: Child ThemeTheme URI: http: //example.com/Description: Child theme for Twenty TenAuthor: Tom JenkinsAuthor URI: http: //example.com/about/Template: twentytenVersion: 1.0*/
wp-content
themestwentytenchildtheme
style.css
/*Theme Name: Child ThemeTheme URI: http: //example.com/Description: Child theme for Twenty TenAuthor: Tom JenkinsAuthor URI: http: //example.com/about/Template: twentytenVersion: 1.0*/
wp-content
themestwentytenchildtheme
style.css
/*Theme Name: Child ThemeTheme URI: http: //example.com/Description: Child theme for Twenty TenAuthor: Tom JenkinsAuthor URI: http: //example.com/about/Template: twentytenVersion: 1.0*/
Theme Name: Child Theme
Template: twentyten
wp-content
themestwentytenchildtheme
style.css
/*Theme Name: Child ThemeTheme URI: http: //example.com/Description: Child theme for Twenty TenAuthor: Tom JenkinsAuthor URI: http: //example.com/about/Template: twentytenVersion: 1.0*/
@import url("../twentyten/style.css");
The FlowChild Theme
style.css
Parent Theme
style.css
The FlowChild Theme
style.css
Parent Theme
style.css
The FlowChild Theme
style.css
Parent Theme
style.css
The FlowChild Theme
style.css
Parent Theme
style.css
index.php index.php
The FlowChild Theme
style.css
Parent Theme
style.css
index.php index.php
home.php
http://codex.wordpress.org/Template_Hierarchy
The FlowChild Theme
style.css
Parent Theme
style.css
index.php index.php
functions.php functions.php
The FlowChild Theme
style.css
Parent Theme
style.css
index.php index.php
functions.php functions.php+
The FlowChild Theme
style.css
Parent Theme
style.css
index.php index.php
functions.php functions.php+
function say_something($word) {echo "Bob says “ .$word;
}
The FlowChild Theme
style.css
Parent Theme
style.css
index.php index.php
functions.php functions.php+
function say_something($word) {echo "Bob says “ .$word;
}
function say_something($word) {echo "Simon says “ .$word;
}
The FlowChild Theme
style.css
Parent Theme
style.css
index.php index.php
functions.php functions.php+
function say_something($word) {echo "Bob says “ .$word;
}
function say_something($word) {echo "Simon says “ .$word;
}
The FlowChild Theme
style.css
Parent Theme
style.css
index.php index.php
functions.php functions.php+if (!function_exists('say_something')){
function say_something($word) {echo "Bob says “ .$word;
}}
Actions and Filters
Actions and Filters
Actions are the hooks that the WordPress core launches at specific points during execution, or when specific events occur.
Actions and Filters
Actions are the hooks that the WordPress core launches at specific points during execution, or when specific events occur.
function header_additions() {echo “I’m in the header section”;
}add_action('wp_head', 'header_additions');
Actions and Filters
Actions are the hooks that the WordPress core launches at specific points during execution, or when specific events occur.
function header_additions() {echo “I’m in the header section”;
}add_action('wp_head', 'header_additions');
Filters are the hooks that WordPress launches to modify text of various types before adding it to the database or sending
it to the browser screen.
Actions and Filters
Actions are the hooks that the WordPress core launches at specific points during execution, or when specific events occur.
function header_additions() {echo “I’m in the header section”;
}add_action('wp_head', 'header_additions');
Filters are the hooks that WordPress launches to modify text of various types before adding it to the database or sending
it to the browser screen.
function custom_excerpt_more( $more ) { return 'Read More...';}add_filter( 'excerpt_more', 'custom_excerpt_more' );
<div id=”header”>// Do some stuffif (has_action('child_header')) :do_action('child_header');
else :// Do other stuff
endif;</div>
Parent Theme
<div id=”header”>// Do some stuffif (has_action('child_header')) :do_action('child_header');
else :// Do other stuff
endif;</div>
Parent Theme
Child Themefunction child_header() {// inject some html to replace what’s there
}add_action('child_header', 'child_header');
Buffet Frameworkhttp://wordpress.org/extend/themes/the-buffet-framework
Carrington Corehttp://blog.carringtontheme.com/
Hybridhttp://wordpress.org/extend/themes/hybrid
Thematichttp://wordpress.org/extend/themes/thematic
http://techguytom.com
@techguytom
tom@techguytom.com
Understanding the Relationship
Between Parent & Child Themes