Useful Thematic Filters

The learning curve on Thematic is a bit steep if you’ve never used filters and hooks before. The Thematic guide is a great place to start, and by looking at the functions files of other released themes I’ve found most of what I need. But here’s my growing list of Thematic filters for easy reference:

Replace the Blog Title with Your Logo

//Replace Blog Title with Your Logo

function remove_thematic_blogtitle() {
     remove_action('thematic_header','thematic_blogtitle', 3);
}
add_action('init','remove_thematic_blogtitle');

function child_logo_image() {
     //Add your own logo image code
     //Here's an example
    ?>
    <h1><a href="/" title=""><img src="<?php bloginfo('template_url'); ?>/images/logo.jpg" alt=""/></a></h1>
   <?php
   // End Example
}
add_action('thematic_header','child_logo_image', 3);

Add a Search Form to the Header

function add_search(){
include (TEMPLATEPATH . '/searchform.php');
}
add_action('thematic_header','add_search');

Add “Home” to Menu Options

// Add 'Home' Menu Item

function childtheme_menu_args($args) {
    $args = array(
        'show_home' => 'Home',
        'menu_class' => 'menu',
        'echo' => true
    );
	return $args;
}
add_filter('wp_page_menu_args', 'childtheme_menu_args');

Remove Blog Description

//Remove Blog Description

function remove_thematic_blogdescription() {
	remove_action('thematic_header','thematic_blogdescription',5);
	}
add_action('init','remove_thematic_blogdescription');

Remove the Post Footer

add_filter('thematic_postfooter','my_postfooter');
function my_postfooter() {
// The Sound of One Hand Clapping
}	
add_filter('thematic_postfooter','my_postfooter');

Add a Twitter Link Under Each Post

function childtheme_postfooter($output) {
	$twitterlink = '<p><a href="http://www.twitter.com/devinsays">Follow me on Twitter</a></p>';
	return ($twitterlink . $output);
}	
add_filter('thematic_postfooter','childtheme_postfooter');

Add Google Analytics Tracking Code

//Google Analtyics

function analytic_footer() {?>
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "XXXXXXX";
urchinTracker();
</script>
<? }
add_filter ('thematic_after', 'analytic_footer');

Add Thumbnail Support

// Add Thumbnail Support for Theme (introduced in 2.9)

if ( function_exists( 'add_theme_support' ) ) {
	add_theme_support( 'post-thumbnails' );
	}

Change the Footer Message in Your Site to:
“Copyright (Current Year) (Your Blog Name) | (Link to Admin Page) | (Link to RSS)”

// Generate footer code

function childtheme_footer($thm_footertext) {
     $date = date('Y');
     $blog_name = get_bloginfo('name');
     $admin_url = get_bloginfo('wpurl') . '/wp-admin';
     $entries_rss = get_bloginfo('rss2_url');

     $thm_footertext = sprintf(
     '<p>&copy; %s %s | <a href="http://wptheming.com/2009/10/useful-thematic-filters/">Site Admin</a> | <a href="http://wptheming.com/2009/10/useful-thematic-filters/">Entries RSS</a></p>',
     $date, $blog_name, $admin_url, $entries_rss);

     return $thm_footertext;
     }

add_filter('thematic_footertext', 'childtheme_footer');

Add a Favicon

function childtheme_favicon() { ?>
    <link rel="shortcut icon" href="<?php echo bloginfo('stylesheet_directory') ?>/images/favicon.ico">
<?php }

add_action('wp_head', 'childtheme_favicon');

Removing Plug-In Code

A lot of times plug-ins will insert unnecessary stylesheets and scripts. Here’s some filters to remove some of that cruft in popular plug-ins. Although it’s listed here under Thematic filters, you can use the following code on any WordPress site.

// Remove Page Navi CSS

function childtheme_deregister_styles() {
	wp_deregister_style( 'wp-pagenavi' );
}

add_action( 'wp_print_styles', 'childtheme_deregister_styles', 100 );

Removing and Renaming Widget Areas

This feature is in the trunk version of Thematic. It should be publicly released when WordPress 2.9 comes out, but you can download it via SVN if you want to get a jump on it. For a more detailed tutorial on widget areas with Thematic read this post in the forums.

/* Defining Widget Areas */

function remove_widget_areas($content) {
	unset($content['1st Subsidiary Aside']);
	unset($content['2nd Subsidiary Aside']);
	unset($content['3rd Subsidiary Aside']);
	unset($content['Index Top']);
	return $content;
}
add_filter('thematic_widgetized_areas', 'remove_widget_areas');

function rename_widgetized_areas($content) {
	$content['Primary Aside']['args']['name'] = 'Sidebar';
	$content['Index Bottom']['args']['name'] = 'Home Content';
	return $content;
}
add_filter('thematic_widgetized_areas', 'rename_widgetized_areas');

Disable Header Scripts

If you’re not using drop down menus, no need to load the header scripts.

function childtheme_remove_scripts() {
    remove_action('wp_head','thematic_head_scripts');
}
add_action('init', 'childtheme_remove_scripts');

Other Resources

If you’ve ever been to the Thematic forums, you’ve no doubt noticed Christopher Goßmann’s awesome presence. Here’s his code snippets for changing/styling layouts.

Design Notes has a few snippets, some of which I added to this list.

Here’s 6 Useful Thematic Snippets for related posts, linkable post images, and removing default scripts and stylesheets.

If you’re interested in using non-standard web fonts, check out this article for How to Add Typekit to your Thematic Child Themes

Thanks to Justin Tadlock for the PageNavi CSS removal code.

Published by

Devin

I'm a WordPress developer based in Austin, Texas. Follow my projects on GitHub, or more general WordPress ramblings as @devinsays on twitter.

24 thoughts on “Useful Thematic Filters”

  1. I noticed that in your framework when you replace the blog title w/ a logo you also remove the blog description completely instead of just hiding it. Do you think there is any SEO loss when you don’t have that h tag?

  2. Well what if you set the logo to be the background image of the title link, and then set the text-indent on the blog-description ? I might try that later… except then how do you set the width and height attributes of the title link? Hmmm… the image is definitely easier in that sense. Idk either if that’d be considered spam by the SEO gods as most of the time that description is part of the graphic, and is the legit blog description anyway.

    1. Hey Kathy. When I get a chance I’ll update the child theme to mirror how WooThemes does it:

      <div id=”logo”>
      <a href=”#” title=”#”><img src=”logo.png” /></a>
      <h1><a href=”#”>Site Title Hidden</a></h1>
      <span>Site Description Hidden</span>
      </div><!– /#logo –>

      As a side note, anything that’s set to display:block; can get a height and width.

  3. I altered your admin-panel-functions.php file to include the code below. Basically it keeps the logo img that you had, but also puts the blog-title (in a span) and the blog description back in.. except that if there is a logo detected in the Options panel, then they both get a class=”hide” so they can be thrown off the page. For SEO, which one gets the h1 tag probably depends on what your site description and site names are relative to your keywords but to stay sane for right now I just went w/ how Thematic currently handles it.


    /*
    * Replace Blog Title with Logo
    */

    function add_childtheme_logo() {
    global $my_shortname;
    $logo = get_option($my_shortname . '_logo');
    if (!empty($logo)) {
    remove_action('thematic_header','thematic_blogtitle', 3);
    remove_action('thematic_header','thematic_blogdescription',5);
    add_action('thematic_header','childtheme_logo', 3);
    add_action('thematic_header','child_blogdescription',5);
    }
    }
    add_action('init','add_childtheme_logo');

    function childtheme_logo() {
    global $my_shortname;
    $logo = get_option($my_shortname . '_logo');
    if (!empty($logo)) { ?>

    <a href="/" title="" rel="home"><img src="/scripts/timthumb.php?src=&w=600&zc=1" alt="" />

    <?php
    }
    }

    and then for style I just had to style the hide class. this is probably overkill, but i wanted the thing gone! i


    .hide{
    text-indent: -9999px;
    margin-left: -9999px;
    height:0;
    overflow: hidden;
    }

  4. Its my understanding that if your site uses the s.e.o plugin (which many do) you do not have to worry about logo code replacing blog title

  5. Cool tips, used the disable header scripts and favicon tips in my blog. I just have a question though. Most thematic websites have like google page speed score of 70 to 80. The page speed suggests that I enable compression, on the jquery.js file, you think its a good idea to compress this file and other files as well? I mostly edit the style.css file only.

  6. Actually I handled to replace the Blog Title, but I can not insert the LOGO :-(

    function child_logo_image() {
    //Add you logo image code

    Could you tell me an example for the logo image code? If i use the html code I got an unexpected error.

    Thanks a lot
    Joachim

  7. It looks like bloginfo(‘template_url’) is calling up the parent (the actual Thematic theme). What would be the workround if you wanted to keep images in the child theme folder?

      1. I think you mean:

        bloginfo(‘stylesheet_directory’)

        The stylesheet_url grabs the actual style.css location.

        Thanks for the post by the way.

  8. @Devin
    Man, I am very hookie with thematic framework and yours posts helps me a lot! Thanks for share so good information about this framework, wordpress and more! God bless you dude! :)

    Hugs from Brazil!

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>