9 April 2010 0 Comments

Designing WordPress Child Themes

I’ve mentioned before that more than 95% of the sites I’ve been hired to develop for the past few years have been built on WordPress. Now, while many of these require a completely customized, original theme built from scratch, most of them are built on a basic, well-crafted “framework”. You already know about CSS framework systems, such as the Grid – but today I want to talk about WordPress child themes, which are sort of like using a framework system, but maybe even better. If you create WordPress themes on a regular basis, this bit of text, which goes at the top of your style.css file, should be quite familiar to you: /* Theme Name: My Awesome Theme Theme URI: http://devlounge.net/my-awesome-theme/ Description: An awesome, all-original theme. Author: Mr. Awesome Author Author URI: http://devlounge.net/mrawesomeauthor Version: 1.0 . My original, awesome theme. . */ Now let’s say I want to create a child theme for My Awesome Theme , called “Eldest Daughter”. At the top of my child theme style.css file, I would do this: /* Theme Name: Eldest Daughter Description: Child theme of My Awesome Theme Author: Miss Eldest Daughter Author URI: http://devlounge.net/miss-eldest-daughter Template: my-awesome-theme Version: 1.0 . The eldest daughter of My Awesome Theme. . */ @import url (“../my-awesome-theme/style.css”); What you’re doing here is establishing Eldest Daughter as the child of My Awesome Theme with this line: Template: my-awesome-theme Then making sure to import the styles from My Awesome Theme with this line: @import url (“../my-awesome-theme/style.css”); And just like that, your child theme will inherit all the styles from its parent theme, and anything you put in the child theme’s style.css file will override its parents elements without making changes to the original styles . And that’s how to get started creating WordPress child themes. You can learn more here: How to Modify Themes the Smart Way and at the WordPress Codex . Do you create and/or use child themes?

Read more:
Designing WordPress Child Themes

Leave a Reply

You must be logged in to post a comment.

Get Adobe Flash playerPlugin by wpburn.com wordpress themes