Frumph.NETWork

A child theme is a theme that goes in your wp-content/themes directory that ONLY has your customizations inside of it.   When upgrading ComicPress to newer versions you will not lose all of your customizations since they are centralized in a single location.

More information on what a child theme is here:
http://frumph.net/wordpress/comicpress-2-9-parent-child-theme-relationship/

Original Post is here:
http://frumph.net/wordpress/faq/creating-a-custom-child-theme-for-comicpress-2-9/

A child theme will contain your graphic sets for navigation, avatars, calendars, moods and site graphics;  Your custom CSS, widgets and code overrides.

I have provided a blank comicpress child theme here:
http://frumph.net/downloads/comicpress-blank.zip

1. Modify the directory name to one of your chosing, i.e. /comicpress-mysitename/
2. Change the ‘Theme Name, Author and Author URI’ inside the child theme’s style.css to your custom names.
3. Put your custom sets of navigation, avatars, calanders, moods in the images folder in this Child Theme, uses the same base structure as the main ComicPress theme, (if you have them, otherwise you can make them later).
4. If you are using a custom-menubar.php, that too goes into this child theme.
5. The widgets directory in the child theme is where you can place custom widgets if you make any.
6. Design your site with Companion or putting the CSS into this child theme’s style.css
7. Take a screen capture of your designed site and replace the screenshot.png file in this child theme.

1. Modify the directory name.

The comicpress-blank.zip file has a directory inside of it called comicpress-blank, you can either upload it via the dashboard -> themes -> add new [upload], or you can ftp the contents into the wp-content/themes directory of your wordpress installation.

When it is on your server, rename the directory to something more coherent then ‘blank’ so that you can recognize it as your own.

The end result will be something like this  /wp-content/themes/comicpress-yoursitename/  and the style.css for the child theme is in the /wp-content/themes/comicpress-yoursitename/style.css

2. Change relevant information inside the style.css of your child theme.

/*
Theme Name: ComicPress Blank
Theme URI: http://comicpress.org
Template: comicpress
Description: Publish a comic with WordPress.  <a href="http://comicpress.org">Visit the ComicPress Website.</a>
Author: Your Name Here
Author URI: http://Your personal site url here/
Version: 1.0
*/

This is how the blank child theme originally looks. You will want to modify this to have the information you want in your child theme. Change the theme name to represent your webcomic or site. You’re the author, change that as well and your website too.

4. Put your custom stuff in the child theme.

Now that you have your own child theme you can centralize the location of all of your images & stuff that is used on your site. The child themes images directory is where you place your site design images that are relevant to the style.css inside the child theme directory. When using the child themes style.css and your images are in the child themes images directory you can use this path structure in example:

body {
	background: #fff url('images/background.jpg') top center no-repeat;
}

Notice that the url(‘ portion is basically just looking into the images directory that is under the style.css that is calling for that image instead of using some huge http:// patch structure.

Your other graphic sets, like navigation, moods, etc behave the same way as if they were put into the main theme. If you have custom navigation graphics with it’s own navstyle.css that you created, instead of going into the /comicpress/images/nav// directory you would put them into the child theme instead, such as /comicpress-yoursitename/images/nav// and ComicPress will check there as well for the options area in the dashboard when configuring your site.

5. custom-menubar.php goes into the child theme

The custom-header.php is basically a file that can be injected into the menubar position wherever it is on your site, instead of the menubar showing it will instead load this file. This allows you to create your own look and feel for your menubar. This custom-header.php file when using a child theme needs to be in the child theme directory.

6 . The widgets directory in the child theme

You can create your own custom widgets or ones that are specific for your child theme. This directory gets auto loaded when the theme gets executed to be seen in the widgets area of the dashboard.

7. Put your CSS changes into the style.css of the child theme.

In order to continue with this whole “don’t edit your comicpress theme” method of thinking. Some of you use Companion to do this exact same thing. However I want to touch up on an important note to those modifying CSS. You do NOT put the entire style.css set of elements into the custom area or companion. You ONLY put changes. For example, in the main ComicPress theme’s style.css you see:

body {
	margin: 0;
	font-family: 'Arial' , sans-serif;
	font-size: 14px;
	color: #000;
}

And you want to add a background to the body area and change the color from black to white. You would want to ONLY put what is changed, like this inside of the style.css of the child theme OR companion:

body {
	background: #fff url('images/background.jpg') top center no-repeat;
	color: #000;
}

Notice that not *all* of the elements are there, ONLY what is changed. This allows you to recognize what specific thing is changed instead of trying to figure out a difference between your original and your changes.

Good luck! If any of you need any assistance in creating your own custom child theme, please do not hesitate to contact me!

- Phil (Frumph)