CHILD TH
EMES
SLIDESHARE.NET/JASONDAVIS8@CAPSTONCREATION
CAPSTONECREATIONS.COM
WHAT IS A WORDPRESS THEME? Fundamentally, the WordPress Theme system is a way to "skin" your
website/blog.
Consists of: style sheet(s) template file(s) images code files (functions)
SLIDESHARE.NET/JASONDAVIS8 @CAPSTONCREATION
CAPSTONECREATIONS.COM
WHAT IS A CHILD THEME?Official Definition: A WordPress child theme is a theme that inherits the functionality of another
theme, called the parent theme.
A Child theme allows you to modify, or add to the functionality of that parent theme. A child theme is the safest and easiest way to modify an existing theme, whether you want to make a few tiny changes or extensive changes. Instead of modifying the theme files directly, you can create a child theme and override within.
SLIDESHARE.NET/JASONDAVIS8 @CAPSTONCREATION
CAPSTONECREATIONS.COM
WHY USE CHILD THEMES?Modification/Customizations: If you modify an existing theme and it is updated, your changes will be lost.
With a child theme, you can update the parent theme (which might be important for security or functionality) and still keep your changes.
Time: It can speed up development.
Beginners: It’s a great way to get started if you are just learning WordPress theme
development.
SLIDESHARE.NET/JASONDAVIS8 @CAPSTONCREATION
CAPSTONECREATIONS.COM
WHEN TO USE CHILD THEMES:As soon as you want to modify the site's look, presentation, or functionality
Examples of such cases: change color scheme change "read more" match blog to non-WP site change footer contents*
SLIDESHARE.NET/JASONDAVIS8 @CAPSTONCREATION
CAPSTONECREATIONS.COM
HOW TO USE A CHILD THEME? Create a directory under /wp-content/themes/ Name = /themename-child/ will do (no spaces) Upload a properly-formatted stylesheet. Activate the child theme. Log in to your site’s dashboard, and go to
Administration Panels > Appearance > Themes. You will see your child theme listed there. Click Activate.
Now Enjoy your day.
SLIDESHARE.NET/JASONDAVIS8 @CAPSTONCREATION
CAPSTONECREATIONS.COM
CHILD THEME COMPONENTSRequired: Style Sheet: style.css
Optional: Template files functions.php other files (images, JavaScript, php includes) screenshot.png
SLIDESHARE.NET/JASONDAVIS8 @CAPSTONCREATION
CAPSTONECREATIONS.COM
CHILD THEME STYLE SHEET (STYLE.CSS) FORMATRequired Commented Information Block (at top) Required elements:
Theme Name Template (parent theme name)
Optional elements: Theme URI, Description, Author URI, Author, Version
@import directives (optional)
SLIDESHARE.NET/JASONDAVIS8 @CAPSTONCREATION
CAPSTONECREATIONS.COM
SAMPLE CHILD STYLE SHEET
SLIDESHARE.NET/JASONDAVIS8 @CAPSTONCREATION
CAPSTONECREATIONS.COM
CHILD THEME FUNCTIONS FILEfunctions.php
Unlike style.css, the functions.php of a child theme does not override its counterpart from the parent. Instead, it is loaded in addition to the parent’s functions.php. (Specifically, it is loaded right before the parent’s file.)
TIP FOR THEME DEVELOPERS. you can make the user functions of your theme pluggable —that is,
replaceable by a child theme— by declaring them conditionally. E.g.:
SLIDESHARE.NET/JASONDAVIS8 @CAPSTONCREATION
CAPSTONECREATIONS.COM
INCLUDING FILESIn the parent functions.php(if the parent is child theme ready)
require_once( get_stylesheet_directory() . '/my_included_file.php' );
When you need to include files that reside within your child theme's directory structure, you will use get_stylesheet_directory(). get_stylesheet_directory() points to your child theme's directory (not the
parent theme's directory).
You would do this in a theme that has a child theme already, otherwise it’s a potential edit lost on next update of parent.
Just wait……… more on this in a second.
SLIDESHARE.NET/JASONDAVIS8 @CAPSTONCREATION
CAPSTONECREATIONS.COM
RE-USE COMMON ELEMENTSget_template_part Load a template part into a template (other than header, sidebar, footer). Makes it
easy for a theme to reuse sections of code and an easy way for child themes to replace sections of their parent theme.
A PHP include or require on steriods.
Example: <?php get_template_part( 'loop', 'index' ); ?>
will do a PHP require() for the first file that exists among these, in this priority:wp-content/themes/twentytenchild/loop-index.phpwp-content/themes/twentyten/loop-index.phpwp-content/themes/twentytenchild/loop.phpwp-content/themes/twentyten/loop.php
SLIDESHARE.NET/JASONDAVIS8 @CAPSTONCREATION
CAPSTONECREATIONS.COM
CREATE THE CUSTOM FILE Add the get_template_part function to your parent theme page template. Create a new page template in your child theme. Name it and paste your code.
RESOURCES (search for child themes) WPtuts.com WordPress Codex WPBeginner.com WPEngineer.com WPSnippets.com
SLIDESHARE.NET/JASONDAVIS8 @CAPSTONCREATION
CAPSTONECREATIONS.COM
FRAMEWORKSThe term "Theme Framework" currently has two meanings:
A "drop-in" code library that is used to facilitate development of a Theme
A stand-alone base/starter Theme that is intended either to be forked into another Theme, or else to be used as a Parent Theme template
SLIDESHARE.NET/JASONDAVIS8 @CAPSTONCREATION
CAPSTONECREATIONS.COM
BASE/STARTER THEMES A "base/starter" Theme framework is a stand-alone Theme designed to be a flexible
foundation for quicker WordPress development, usually serving as a robust Parent Theme for Child Themes.
Some Theme frameworks can also make theme development more accessible, removing the need for programming or design knowledge by Creating Options Pages.
Examples: Klasik Thematic Thesis Genesis
These are base/starter themes – but also Themes!
SLIDESHARE.NET/JASONDAVIS8 @CAPSTONCREATION
CAPSTONECREATIONS.COM
FRAMEWORKS A "drop-in" code library framework is not a stand-alone Theme. Such
frameworks cannot be installed nor used as a stand-alone Theme. Rather, these libraries are included with the Theme, and "bootstrapped" to the
Theme by being included in the Theme's functions.php file.
Examples: Options Framework Redux Framework
SLIDESHARE.NET/JASONDAVIS8 @CAPSTONCREATION
CAPSTONECREATIONS.COM
FRAMEWORKS Essentially once a framework is installed and you have your template files
ready and in your child theme, you can reuse the framework and crank out themes faster. Just activate a different child theme.
Many design and layout options can be controlled without the need to know programming (PHP).
You’ll find amazing design flexibility. Unlike a single theme, where you’re stuck with the colors and layout the designer hard-coded into it, a theme framework is versatile and adaptable to many different potential site looks and layouts.
User communities have created collections of styles and functions that can often be plugged into your site with little or no programming knowledge.
It’s easy to optimize your site for SEO.
SLIDESHARE.NET/JASONDAVIS8 @CAPSTONCREATION
CAPSTONECREATIONS.COM
MORE TOOLS
SLIDESHARE.NET/JASONDAVIS8 @CAPSTONCREATION
CAPSTONECREATIONS.COM
Top Related