Blog

Sharing WordPress tips and tricks as I find them

Genesis Base Child Theme

About 90% of the sites I build are custom Genesis child themes (the other 10% being modifications of existing Genesis child themes). Over the past year I’ve developed my own base child theme that I start from. It contains code that I use often and structured in the way I prefer. When building a site, I uncomment features as I need them, and when I’m done I delete everything that’s still commented.

» You can download my base child theme here.

It contains:

  • Functions.php – Described below
  • style.css – Copied from the latest version of Genesis with the table of contents removed and the child theme information at the top
  • screenshot.jpg – Used on the Appearance > Themes page. Usually put the client’s logo or a screenshot of the site.
  • /images – Empty, where images will go
  • /lib – Library which contains…
    • /metabox – All the code required to create custom metaboxes. I never edit this folder
    • /functions – When a function or series of functions become really long, I move them to their own file in here rather than leave them in functions.php. It comes with…
      • shortcodes.php – Some useful shortcodes and turns on shortcodes in widgets. Hint: Use shortcodes for the Site URL in sidebar widgets so they still work when the site is migrated. Since sidebar widgets store their data in serialized array it’s really hard to update these URLs in the database.

In the functions.php file I have a large theme setup function, as recommended by Justin Tadlock. Inside my setup function I have functions that do the following:

  • Remove unused backend pages (on). By default it removes the Links page. You can use it to remove any backend pages you don’t want the client seeing.
  • Customize Menu Order (on). Rearranges the top menu to be: Dashboard, Pages, Posts, Comments, Media.
  • Set up post types (off).
  • Set up taxonomies (off).
  • Set up metaboxes (off). I should also mention that if any of these functions get long (ex: creating 10 metaboxes) I move them to their own file in /lib/functions.
  • Remove unused page layouts (off). Select which page layouts you’d like offered.  You can also create your own layout options.
  • Setup sidebars (off). It has the secondary sidebar removed, how to create a new sidebar, and how to turn on footer widgets. All options are commented out.
  • Setup shortcodes (on). It pulls in the shortcodes.php file.
  • Remove edit link (on).

This should give you an idea as to how I personally organize my code. I sort it by backend to frontend, and on larger sites I break down frontend to Frontend General, Frontend Posts, Frontend Events… When a function gets really long it’s turned into its own file in /lib/functions and referenced in the functions.php file (like shortcodes.php). I also often create WordPress widgets, and put them in /lib/widgets.

Hopefully this is helpful. I highly recommend creating your own base child theme based on what you use most often and your coding style.

62 Comments

  1. Wow, thank you for sharing this. If I’d seen it last week it would have saved me heaps of time this week with Custom Post Types and Custom Meta Boxes alone.

    My custom child themes getting more advanced with each project and I really like the way you’ve got it all organized… it’s a huge help and as a bonus I like that you write code the way I do (lots of echo statements not lots of )

  2. Hey Bill,
    This is great. Thanks so much for sharing. This gives me ideas about how to set up a child theme with code that I use over and over. A real timesaver.

  3. Hi Bill
    Came over from one of your comments over at Studiopress.

    I’ve just bought the developer version of Genesis and have started playing with it on a local install.

    I get by with html and CSS but PHP has defeated me so far.

    Just checking out the senior moderators websites to get a feel for what you do.

  4. Niall O'Brien says:

    Hi Bill, just wondering how you go about developing custom taxonomy templates using Genesis?
    Thanks in advance.

    • Bill Erickson says:

      You create them just like any other WordPress theme. Refer to the Template Hierarchy.

      If you have a custom taxonomy called “Color” and terms “red” and “blue”,

      • taxonomy-color.php would affect both the red archive and blue archive
      • taxonomy-color-blue.php would affect only the blue archive
  5. Bill, Great Site! Thanks for sharing.

    I noticed your base child does not have a home.php file. So am I to assume you create a static home page? I am trying to figure out if it is easier for a client to update widgets in a home.php file or use the editor on a static page-home.php template.

    I am interested in your thoughts.

    Thanks

    Thanks

    • Bill Erickson says:

      Here’s my typical process:
      - If a homepage is supposed to be a listing of blog posts, I don’t do anything. This is the WordPress default.
      - If the homepage is a static page, I go to Pages > Add New and create Home and Blog, then go to Settings > Reading and set Home as the front page and Blog as the posts page.
      - If the homepage has homepage-specific customizations, I then create a front-page.php file where they all go.

      Here’s a blog post I wrote on developing a child theme that shows how I use a front page: http://www.artofblog.com/building-a-genesis-child-theme/

      • WOW Bill, that is exactly what I was looking for. I recently purchased the Pro Package from Genesis and I have been weeding my way through it. I know enough PHP to get myself in trouble and thanks to people like you I am learning something everyday.

      • I get all the logic for the first 2 points, but on the 3rd – if the home requires a lot of customization, why do you use frontpage.php and not home.php?

        • Bill Erickson says:

          home.php only applies to the blog page. In the above example, we set the page “Home” as the front page and the page “Blog” as the posts page. home.php would control Blog, and front-page.php would control “Home”.

          • So home.php only controls the ‘posts page’? I didn’t know that! Using front-page.php is much more client-proof then! Thank you!

  6. Quick question regarding child themes. I know in regular WP sites you can use Headspace2 to switch the theme look on specifically assigned pages. Is there a way of doing this with Genesis and It’s child themes?

    Thanks!

    • Bill Erickson says:

      I’ve never heard of Headspace2 so I’m not sure how it works, but if it works with other WordPress themes I would expect it to work with Genesis.

  7. This is great! Thank you.

  8. I read the tutorial in the Art of Blog post you wrote, and you have a rule of thumb for where to put code – styles in the theme, functions in plugins. (sort of, you said it nicer). But I’ve been wondering about Custom Post Types and taxonomies, I add those to teh THEME functions file – And I’ve been wondering about the client’s future needs – they’re kinda stuck with that theme or me or someone who knows how to develop CPT in the future which isn’t the way I want to do things, but I dont know another way to do it. What do you suggest?

    • Bill Erickson says:

      I actually described this just the other day in my Core Functionality plugin post.

      For things like custom post types and taxonomies – things the client would expect to keep even if changing themes – you should put in a plugin. I create a plugin called “Core Functionality” on all sites which contains this stuff.

      Even better, create a folder inside wp-content called mu-plugins (this stands for must use plugins), then drop the contents of the core-functionality plugin in this folder (you can’t have plugins inside of folders in this directory, so you have to pull it out of the folder first). This will make it so the plugin is always on and can’t be turned off. You don’t want the client disabling their core functionality plugin, losing their site’s core functionality, and calling you to fix it.

  9. I’m using your theme to learn how to edit the Genesis admin page, and the custom meta boxes are working great – but neither the core genesis defaults nor the child ones are registering. I’m wondering if this is tested?

    Is the call to setup default settings too late in the game when included in the genesis setup hook? I’m grasping at straws here – but what about the init hook (for either WP or Genesis)?

    Its this bit I’m wondering about: (which is within the Genesis_setup hook:
    // Setup Theme Settings
    include_once( CHILD_DIR . ‘/lib/functions/admin.php’);

    • Bill Erickson says:

      At the moment, the base child theme has admin code that only works if running Genesis 1.8 (not available yet). I’m currently working with StudioPress to test this code before it is released. So if you’re using the most up-to-date code from github (in /lib/admin/child-theme-settings.php) it won’t be usable. But since you reference /lib/functions/admin.php it doesn’t sound like this is the issue.

      No, this must run after WordPress and Genesis have been set up or else the genesis-specific hooks won’t be available yet.

  10. fantastic work mate, using it now to build a client site

    i un-commented the feature you added for “child theme setting”

    and put some text in for the “left footer and right footer” in the new theme options

    but when i hit “save settings” it just clears it instead of saving it…seems to be resetting on save?

    i have not modified anything in the child-theme-setting.php file and using genesis 1.8 and latest version of wordpress

    hope you can help.

    thanks so much

    • Bill Erickson says:

      Update the sanitization section to use footer_left and footer_right. Also, in the metabox function update the genesis_get_option() call to include the setting field.

      genesis_get_option( 'footer_left', 'child-settings' );

      I just updated the github repo as well.

  11. I noticed you mentioned a shortcodes.php file in your basic child theme files but did not see that file. Has it been removed…or can you include that. I would be curious to see what you have included. Thanks.

    • Bill Erickson says:

      I’ve actually moved this to my core functionality plugin. Since the user will be using the shortcodes inside their posts and pages, when they change themes they would lose that functionality if it was packaged in the theme. Putting it in a plugin ensures their content is not theme-dependent.

  12. I’m having a look at you base child theme, and I’m slightly confused.

    All the StudioPress themes that I have looked at and studied have the following line as the first line of the child themes functions.php file:

    require_once(TEMPLATEPATH.’/lib/init.php’);

    However I noticed that your child theme doesn’t have that line of code. Am I missing something, or is it not required for the child theme to function correctly?

    • Bill Erickson says:

      While the way StudioPress does it works, it isn’t the WordPress best practice.

      In WordPress, the child theme loads before the parent theme. So if you had any functions in your child theme’s functions.php file that depended upon Genesis (most will), it would break. If you remove that require_once line and drop in genesis_register_sidebar(), the site won’t work because that function hasn’t been defined yet. StudioPress added the require_once line to load Genesis before any of the child theme’s functions are loaded.

      But you shouldn’t be running any functions directly in the functions.php file. Everything should be hooked somewhere. register_post_type() should be hooked onto init. And any functions that depend on the parent theme being present should be hooked onto after_theme_setup (or a genesis-specific hook: genesis_setup).

      So if you look at my theme, you’ll see that everything is inside a function hooked onto genesis_setup, and since I’m using a higher priority (15), it runs AFTER genesis is set up.

      To summarize, StudioPress does it that way to minimize support issues. It’s harder to mess up the site using require_once than trying to remember to always hook your functions in the right place. But if you know what you’re doing, you can do it the right way.

      • So in effect, by running the code the way you do so in your theme, you are effectively doing it the same way that the require is doing, by making sure the parent theme (i.e. Genesis) loads its functions first?

        • Bill Erickson says:

          Yes, although technically I’m not doing it “same way”. When you use the require statement, you’re literally loading Genesis before your child theme. When I do it my way, my functions.php file runs first, but I’m telling it to execute the code I wrapped in my child_theme_setup() function after Genesis loads.

  13. I’m starting to look for a framework to get familiar with and use for a few projects. I did some searching and couldn’t find anywhere you say anything about Bones, but I saw you made a contribution to the Bones for Genesis git. Have any insight?

    • Bill Erickson says:

      I haven’t used it to build a website, but I’ve looked through the code and it’s pretty nice.

      My personal preference for a base child theme is to be as stripped down as possible so you add in the pieces you need (BE Genesis Child). Bones takes the opposite approach of providing everything you might need (most of it commented out), so you can remove the things you don’t need.

  14. Thomas Bock says:

    Bill,

    I was checking out your base child theme and I noticed the ‘Navigation’ styles in the style.css are the older version of the Genesis ‘sample’ child theme. Is there any particular reason why you are not using the newer ‘Navigation’ styles?

    Thanks

  15. Bill, thanks so much for your contribution to Genesis in particular. I am using your base theme and i finishing a project and testing on mobile devices (due to launch in 2 days). The layout is ‘off’ meaning i cannot scroll on the page until i zoom out and is causing confusion with the client. I have tried to remove the css media screen settings and nothing changes. Am i missing something to remove this and have it like a standard display website on mobile devices. I know this is a strange request as everything is mobile but it just doesn’t look right. Thanks

    • Bill Erickson says:

      If you don’t want to use the mobile aspects:

      • Remove all the media queries at the bottom of style.css
      • Remove all the uses of max-width: 100% on elements
      • Make sure you’re using pixels instead of percentages for item widths
      • In functions.php, remove the code that adds a meta viewport tag
  16. How would one add the ability to accept shortcodes in the footer-left and footer-right areas in Child Theme Settings? I’ve put shortcodes in there and they don’t seem to execute.

    • Bill Erickson says:

      When you output it, you’ll need to wrap it in do_shortcode(). If you also want it to convert to paragraphs, also wrap it in wpautop(). Example: echo wpautop( do_shortcode( genesis_get_option( 'footer-left', 'child-settings' ) ) );

  17. Awesome! Thanks…

  18. Bill it was great being here, you have a very good blog and very nice you shared your theme :)

  19. Bill have you worked with the new styling in Genesis 1.9 yet? I dont like the way everything is broken out so that the font size of a certain item might be in the font section, but the sizing styles would be in the layout section. I prefer to have all styles for all physical divisions of a page be grouped in the same place in CSS. For example all “header right” styles would be in the “header-right” section of my stylesheet. From glancing at a few of your CSS files it looks like you do this sometimes as well (I only glanced quickly at a few so I could be assuming wrong). I wonder, if you use the new Genesis stylesheet if you would rearrange it and how?

    • Bill Erickson says:

      I haven’t used the new Genesis stylesheet, and have no plans to. I prefer pixels to rems, and already have my stylesheet laid out how I like it (it’s taken a long time to get it right).

  20. Kind of useful for me at the moment .. facing problem with child theme

  21. Thank you very much for the theme, just bought a Genesis plan, and what was needed, but not PHP tratere customize it.
    thanks

  22. Hi Bill, just wondered if this theme was up to date with Genesis 1.9.2 and WP 3.5 / 3.6?

    Thanks,
    – Matt

    • Bill Erickson says:

      Yes it is up to date. I’m currently rebuilding it to work with Genesis 2.0 (HTML5)

      • Will your new base child theme for Genesis 2.0 come out at roughly the same time as Genesis 2.0? I’m mostly curious how you’ve organized and stripped down the stylesheet. I don’t suppose the CSS is something you could give a preview of? :-)

        • Bill Erickson says:

          Here’s what the stylesheet looks like right now: https://gist.github.com/billerickson/234ae168d42a7ea45a6f

          Making changes to it as I build sites with it. It’s still pretty close to the Genesis 2.0 stylesheet right now.

          Yes, the plan is to make it public once Genesis 2.0 is officially released.

          • Hi, is your Genesis base child theme ready for 2.0?

          • Bill Erickson says:

            No, BE Genesis Child has not been updated for HTML5. I’ve left it as-is for developing on non-HTML5 versions of Genesis.

            Jared Atchison and I have an HTML5 base child theme we’re working on but it’s currently private. It’s really just the stylesheet from Genesis with slight modifications, and the same basic code of BE Genesis Child.

  23. Thanks Bill for sharing this base child theme, hope you’ll release such base child theme for latest Genesis 2.0 as well.

  24. Thanks Bill! :D

  25. Nice post, is there a demo of the theme? like me try it out.

    Thanks

  26. hi bill, is this theme responsive. actually i want a theme which could work in mobile devices as well. thanks

  27. Bill,

    Just curious..

    In your setup uou remove several of the genesis widgets, enews, feautured poat, pages, etc.

    Are there are other plugins or widgets you prefer or are you creating that functionality with code too?

    • Bill Erickson says:

      It all depends on what the client needs. If they just need a simple list of posts, I’ll use Display Posts Shortcode. If it’s something more custom (ex: upcoming events with a little calendar icon for the date) I’ll build a custom widget for it.

      • Okay thanks.
        I’ve used these widgets often. Any particular reason you delete them? Just prefer others or are they not good to use?

        • Bill Erickson says:

          Well I really don’t like how Featured Posts and Pages are written. They use query_posts() which messes with anything that modifies the main query (like my Genesis Grid plugin).

          But for the most part, it’s because I only include widgets that are necessary for the client and tested by me. I don’t like testing all the possible options they have with these plugins since 99% of the time they won’t use them.

  28. makes sense. thanks again.

  29. Thomas Bock says:

    Bill,

    Do you prefer to use a ‘setup’ function to load your site-wide functions or use the way Genesis does by starting with init.php. I have seen arguments for both.

    Thanks

    • Bill Erickson says:

      Definitely a setup function. It just seems wrong to include a file from another theme, especially since WordPress will do that for you once your functions.php file has loaded.

Join the Conversation

If you'd like to include code in your post, please post it to http://gist.github.com and include a link.