I’ve been running into the WordPress Genesis theme as of late. It’s not your standard wordpress theme when it comes to modifying template files. Genesis is actually a framework, that would be a better way to describe it. Genesis frameworks extend their functionality, allowing developers to customize their WordPress site.
The Genesis framework is built by Studio Press – I’m quite impressed with their work actually, it sounds like a solid framework I just need to learn more about it. So I dove right in – I scoured the internet for some learning material and a good list came up. This can only take you so far though – the best way to really learn is actually do it yourself, so that’s what I’m gonna do.
What’s the catch though? Well this is a paid framework, meaning I have to actually purchase it through their website. Well that sucks, then again it really doesn’t – these guys and gals put some work into this, they deserve it. Fortunately for me, I’ve got a project handy to work with – an existing website that is running on a Genesis Framework.
So what was the task? Well I had to modify and add a list of functionalities to their blog, just their blog area. And if you know wordpress, you know that you’re working with template files, functions, and in this case – hooks. Yeah hooks, a super modular approach to theme building. I wasn’t use to this, I mostly build on standard wordpress files. The second part to this specific build was the front end – the layout, so there was going to be some CSS involved here. Not to mention responsive media queries.
These hooks can be placed directly on a template file or within the functions.php file, they’re all basically functions.
So within the functions.php file, hooks can be implemented like:
/** Add Viewport meta tag for mobile browsers */
add_action('genesis_meta', 'add_viewport_meta_tag');
function add_viewport_meta_tag() {
echo '<meta name="viewport" content="width=device-width, initial-scale=1.0">';
}
/** Add support for custom background */
add_custom_background();
/** Add suppport for custom header */
add_theme_support('genesis-custom-header', array('width' => 960, 'height' => 100));
/** Add support for 3 column footer widgets **/
add_theme_support('genesis_theme_footer', 3);
add_action('genesis_before_footer', 'my_sample_text');
function my_sample_text() {
echo '<h2>Thanks for Reading!</h2>';
}
Okay so actually outputting mark up can be done within the functions.php file but how is this different from outputting markup on an actual genesis theme file. Yeah it’s basically the same thing and it gets even worse when you have a layout thats highly customized.
I sound like I’m complaining here when in fact, Genesis is quite forgiving. There are a good amount of hooks that are natively built in. For instance in the example above, we can use ‘genesis_theme_footer’ without calling a function, however all we need to do is pass it an argument which is ‘3’ for a three column layout. Well that’s super handy.
We can also remove some components like:
/** Remove Header */ remove_action( 'genesis_header', 'genesis_do_header' );
Here’s a powerful one, I’m not sure I’d use it often for layouts that require some heavy customization but still powerful.
function do_full_width_content() {
echo genesis_get_custom_field('full-width-content-1');
}
The ‘genesis_get_custom_field’ is a powerful hook – it let’s us access a natively built in field from the custom fields area. You can see this while you’re editing the page – within WordPress’ backend.
What are some other hooks we can use? Well here is a nice reference – Genesis Hook Reference. Additional documentation can be found right on Studio Press website – Snippets
Some other resources with your Genesis theme development are these plugins, so be sure to install these and try them out.
The key is to custom Genesis theme development is to mix it up in an intuitive way – take the ideas presented here and mix it in with your own efficient way. There is some creativity involved here.
There’s a lot more about Genesis – this is barely scratching a surface, a whole handbook can be written about this. I can’t say the documentation for it is presented thoroughly and clearly though but the good news is that they’re scattered throughout the internet. Yeah scattered – you gotta do your research. In this post though I did touch on the major points, just enough weaponry to do some damage. What I mean here are the tools you’ll need to work with the Genesis Framework.