Installing child theme on wordpress

wpchildWhy?

So you can customize any theme without loosing ability to update theme without losing customization.

No, why this post? There is quite enough resources on web for this issue!

That’s because I’m using this instruction quite often during some site customization or developing a new theme. All the default code is not memorized yet, so I have to use some good old fashion copy/paste technique. And I have this blog in Bookmarks on every browser I use, so there is no need to disturb the almighty google for such insignificant issue.

OK. Start then!

First, let’s create new folder in wp-content/themes folder. For this purpose we will call it “child-theme”, how original, isn’t it? Than open some text editor like Notepad, Notepad++, MS Word (please don’t), or for best overkill will use Adobe Dreamweaver. Create new file, name it style.css (be sure to check encoding settings -> UTF-8 is preferred), in it you have to put something like this:

/*
Theme Name:     Child-theme
Theme URI:      http://example.com/
Description:    Child theme for some theme
Author:         Your name here
Author URI:     http://example.com/about/
Template:       name of main theme folder without spaces
Version:        0.1.0
*/

save it and upload or put in your previously created folder.
*NOTICE: Italic text is required and is case sensitive.

What? That’s All?

Most certainly NOT. Now, if you developing new theme all that stuff above is not important but my come inhandy, when you using the child theme for customizing some free or paid ready made theme than this is crucial:

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

here you are importing the main theme styling, but everything you put below that will overriding the corresponding rule of the main theme.

This is all you need to have to run child-theme. Now, all modification on css that you wont to make just put in your child-theme style.css.

Other files in child theme folder may be functions.php.
With this file, funny thing is,  that if you not quite familiar with PHP, strange things may occur. Like warnings, error messages and the one and only WSOD (white screen of death) only if  you don’t apply the code correctly. But this is actually a great file because you can add some functions that will be executed before main theme functions.

Although, you can put any of main theme files (footer.php, single.php, search.php) in child-theme directory that is not suggested. Why to put those files in child-theme folder? Sooner or later there will be a need to customize something that can’t be done through CSS . Like some translations or changes in layout and so on… When that happens you can find a file that is responsible for actual problem, copy/paste entire content in new file, name it same as original and than play with it without giving seconds thoughts.

*NOTICE: If you do such thing than you have to be aware that during update of main theme, that particular file will NOT be affected.

In next posts I’ll put some things that I need for theme developing, so check it out.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s