What do you need to create your Twenty Ten Child Theme (the basics):

1. Twenty Ten installed in the wp-content/themes/ folder.
2. A folder with your Child’s Theme name in the wp-content/themes/ folder.
3. A style.css CSS file in the folder of your Child’s Theme.

What could be additionally required:

1. A functions.php file in the folder of your Child’s Theme, to modify or add functions.
2. Any additional file(s) you wish to modify from the Parent Theme: header.php, footer.php, etc.

The magic happens in the CSS file of your Child Theme, namely the “Template” declaration line.

1
2
3

/*
Template: twentyten
*/

Adding this “Template” declaration in the CSS file tells WordPress to look for and run the Twenty Ten theme as a parent to this theme. The Child Theme will then get all the functionality of the Parent, but you’ll be able to modify the files without worry of being overwritten when the Parent Theme updates. Putting the “Template” declaration together with some of the common WordPress Theme declarations yeilds the code below.

1
2
3
4
5
6
7
8
9
10

/*
Theme Name: Your New Child Theme Name
Theme URI: http://your_web_site.com/
Description: Custom theme for your_web_site.com.
Author: You
Author URI: http://your_web_site.com/
Version: 0.1.0
Tags: all, the, tags, describing, your, new, theme
Template: twentyten
*/

So what should you do if you have modified a theme and updates to the theme are available? Turn your current theme into a Child Theme. For the sake of clarity, let’s assume you’ve modified the Twenty Ten theme. Follow these steps below (replacing your current theme’s name where we’ve used Twenty Ten):

1. Rename your current “Twenty Ten” theme in the style.css CSS file by modifying the “Theme Name” line.
2. Rename the “twentyten” folder your current theme is in.
3. Download a clean up-to-date copy of the Twenty Ten theme into your wp-content/themes/ folder, don’t activate it.
4. Modify your newly renamed theme’s style.css CSS file by adding the “Template: twentyten” declaration.
5. Remove all the files you did not modify from your new Child Theme’s folder (you can usually tell by file-date-time if your using an ftp client). Leave the original Twenty Ten ones alone from now on!
6. Re-activate your newly created Child Theme.

Now you can happily let the Twenty Ten theme update eternally without loosing your modifications.Similar Posts:

• Redefine Twenty Ten header image width and height
• Using HTML5 with your Thematic Child Theme
• Remove default WordPress Twenty Ten header images

Here is the reset that we use as our basic CSS building blocks:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52

/* ------------------------Begin Reset------------------------ */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
  line-height: 1.4;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
 
/* remember to define focus styles! */
:focus {
	outline: 0;
}
 
/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}
 
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/* ------------------------End Reset------------------------ */

Similar Posts:

• Using HTML5 with your Thematic Child Theme
• Detect iPad with javascript
• Dynamic Font-Based Images