Add Parent Page Slug and Parent Template to WordPress Body Class

Add CSS body classes for the parent page on all child pages and the parent page template on of a WordPress site with this body_class filter. Ever need to style all child pages of a parent page in the same way or have you wanted to access every child page of a parent page via css selectors for styling? What about selecting all pages that are descendants of a page which is using a specific template?

body_classes_htmlBuilding large websites gets complicated, even in WordPress. Large sites usually mean there are many subpages and sections to the website that may need to be styled similarly. I’ve found it helpful to add a page’s parent page slug to the body class to allow me to alter or target the page or group of pages via css. By default the themes I’ve used have been generous in adding classes to the html body element for easy css selection rules. Things like the post slug, page template, logged in status, page vs post (or custom post type), post id, author… you get the idea. While half the time I don’t need half of this and the other half the time I find myself needing more.

Place this code into your functions.php file and your html body element will have a couple additional classes if they apply. It will have a class delineating the slug for the parent page on all child pages as well as a class delineating the template used by the parent page. This lets me apply styles to a whole sibling-section of a site pretty easily by just targeting the parent-slug on the body. Also adding the template of the parent in case I needed to use that.

post_parent_classesWalking through the code here we’re filtering the body_class function is how we are able to add this. We name our own function and give it a $classes parameter. Then throughout our function we can add classes to this $classes array and they will be output with the rest of the body classes. We need to hook into WordPress at the body_class function with add_filter and specify the hook and specify our own function to be called. In this case we grab the page properties of post_parent and the template of that parent. First set the post variable to reference the global scope, and then check to see if the post is a page with is_page. Then if the post object has a value for the parent (post_parent) we add the parent’s name to the classes array. Then we get the _wp_page_template meta data from the parent to find the template it’s using (if there is no template specified, then it returns default). This is added to our classes if it exists and then we return the classes array to the original body_class WP core function.

[cc lang=”php”]
/////////////////////////////////////////////////////////////////////////////////
// Body class adding page-parent
//
function cc_body_class( $classes ) {
global $post;
if ( is_page() ) {
// Has parent / is sub-page
if ( $post->post_parent ) {
# Parent post name/slug
$parent = get_post( $post->post_parent );
$classes[] = ‘parent-slug-‘.$parent->post_name;
// Parent template name
$parent_template = get_post_meta( $parent->ID, ‘_wp_page_template’, true);
if ( !empty($parent_template) )
$classes[] = ‘parent-template-‘.sanitize_html_class( str_replace( ‘.’, ‘-‘, $parent_template ), ” );
}
}
return $classes;
}
add_filter( ‘body_class’, ‘cc_body_class’ );
[/cc]

There are many more classes we can add to the body_class and like I said, sometimes you need more than what’s already provided and sometimes you need nothing. It all depends on the theme you’re using, what it provides and what your specific site and design require. What other classes have you wanted to see here? How have you filtered body_class to fit your site’s needs?

Set Default Terms for your Custom Taxonomies

Custom Taxonomy Default Term(s) for when it’s left blank

After looking through the WP codex and various plugins, I couldn’t find anywhere to set a custom taxonomy default term. WordPress has allowed us to create custom taxonomies for a while. Before we only had categories and tags hard coded in core. One feature from those days that didn’t seem to make it to the custom taxonomies of today is the possibility to select a default taxonomy term if none are selected. Did you know about this feature? Odds are you did, even if you didn’t realize it. Have you ever seen that ‘uncategorized’ category? That was the default category added for any content that didn’t have a specific category and was left, well, uncategorized.
uncategorized-default-post-category
An annoying feature if you weren’t expecting it, but nice to have if you took the moment to actually set up your default properly. I was working on a project recently with custom post types and custom taxonomies and suddenly needed this feature, but it didn’t seem to exist, so a few google’s later I found this nice snippet from Micheal Fields. Adopting the hook and adding some to allow for custom post types I wanted to share it here for my own safe keeping as well as the benefit of the community.

To Code Custom Taxonomy Default Terms

[cc lang=”php”]
/**
* Define default terms for custom taxonomies in WordPress 3.0.1
*
* @author Michael Fields http://wordpress.mfields.org/
* @props John P. Bloch http://www.johnpbloch.com/
* @props Evan Mulins https://circlecube.com/circlecube/
*
* @since 2010-09-13
* @alter 2013-01-31
*
* @license GPLv2
*/
function mfields_set_default_object_terms( $post_id, $post ) {
if ( ‘publish’ === $post->post_status && $post->post_type === ‘your_custom_post_type’ ) {
$defaults = array(
‘your_taxonomy_id’ => array( ‘your_term_slug’ )
//’your_taxonomy_id’ => array( ‘your_term_slug’, ‘your_term_slug’ )
);
$taxonomies = get_object_taxonomies( $post->post_type );
foreach ( (array) $taxonomies as $taxonomy ) {
$terms = wp_get_post_terms( $post_id, $taxonomy );
if ( empty( $terms ) && array_key_exists( $taxonomy, $defaults ) ) {
wp_set_object_terms( $post_id, $defaults[$taxonomy], $taxonomy );
}
}
}
}
add_action( ‘save_post’, ‘mfields_set_default_object_terms’, 100, 2 );
[/cc]
This code hooks to ‘save_post’ and fires when the post is saved. It will check the post status and only execute if the post status is set to publish. My addition will also check the post type against your custom post type. Then it sets the default for any taxonomy that you want to set a default for. Either a single term or multiple terms can be set as the default taxonomy term. If you want multiple default terms then you just use a comma separated list. This hook will then load the existing taxonomies and if they are not yet set on the post it will set them to your designated default(s). It’s nice and flexible as you can have multiple taxonomy defaults set quickly in the defaults array. Thanks Michael!

Set Default Terms for your Custom Taxonomies via Michael Fields » Set Default Terms for your Custom Taxonomies.

Adding a header widget in your Thematic child-theme

I’ve been building lots of wordpress sites lately and have been loving the thematic framework. I install the theme and then make my edits in a custom child theme. I’ve begun seeing a few things I end up doing in nearly every site and I wanted to share them because finding out exactly how to do it was a bit like finding a needle in a haystack.

The first one I’ll share is related to creating an extra widget area. I know thematic already has a ton of widget areas. I needed a spot in the header to easily update and add elements. It’s a place that commonly holds links, search boxes, phone numbers etc, and normally it’s ok hard coding that into the theme. But what about when it changes? I always try to empower my clients with the option of making tweaks like this on their own. I have found that it keeps them happy, as they don’t get billed or have to wait for me, and it keeps me happy, since that’s really not what I want to spend my time doing. I try to make my sites the kind that I need to do the heavy lifting and some instruction at launch, but then the client is in control and can maintain the site. Of course I explain that if they break it and I have to come in to fix it, then those are billable hours, anyways… that’s another post for another day. I wanted to give the header area (normally to the right of the logo but above the navigation) a widget area. It turns out that it is really a simple few lines of code put into the child-themes functions.php file to do it!

[cc lang=”php”]
// Add Widget area in header
function add_header_aside($content) {
$content[‘Header Aside’] = array(
‘args’ => array (
‘name’ => ‘Header Aside’,
‘id’ => ‘header-aside’,
‘before_widget’ => thematic_before_widget(),
‘after_widget’ => thematic_after_widget(),
‘before_title’ => thematic_before_title(),
‘after_title’ => thematic_after_title(),
),
‘action_hook’ => ‘thematic_header’,
‘function’ => ‘thematic_header_aside’,
‘priority’ => 0,
);
return $content;
}
add_filter(‘thematic_widgetized_areas’, ‘add_header_aside’);

// And this is our new function that displays the widgetized area
function thematic_header_aside() {
if (is_sidebar_active(‘header-aside’)) {
echo thematic_before_widget_area(‘header-aside’);
dynamic_sidebar(‘header-aside’);
echo thematic_after_widget_area(‘header-aside’);
}
}
[/cc]

I know I got this code from someone in some forum somewhere, but it was a long search, and I couldn’t find it again when I looked, so whoever you are, thanks! I usually end up putting a search widget in the header and a phone number or other contact links or rss links and it’s become pretty standard in my toolkit. Hope it helps!