Photo by StevenM_61

First of all the reason: most of my trafic comes from StumbleUpon. With that in mind I decided that it would be a really good way to promote my blog by nicely asking visitors that came from Stumble to give me a thumb up if they like the article (the all “ask and you will be given” mentality). The ideea came from stumbling on a post from Smashing Magazine which nicely asked for my “Thumb Up”.

Initially I thought that it would be even cooler to actually develop a plugin for WordPress that did just that… Of course after 5 minutes or so of brainstorming about the technical problems of this, I realized that this was WordPress and someone must have already developed such a useful plugin. After a quick search in the plugin directory on wordpress.org I found THE GOOD WP Greet Box.

The Good – WP Greet Box

This plugin lets you show a different greeting message to your new visitors depending on their referrer url. For example, when a Digg user clicks through from Digg, they will see a message reminding them to digg your post if they like it. Another example, when a visitor clicks through from Twitter, they will see a message suggesting them to twit the post and follow you on Twitter. You can also set a default greeting message for new visitors (not matching any referrer URLs) suggesting them to subscribe to your RSS feed. Having these targeted suggestions will help your blog increase exposure and loyal readership. Best of all, this plugin is compatible with various WordPress cache plugins so you do not have to sacrifice speed.

Currently the following referrers are installed by default, but you can easily create your own if your favorite referrer is not on the list!

• del.icio.us
• digg.com
• google.com
• yahoo.com
• stumbleupon.com
• technorati.com
• twitter.com

The Bad – My Design

Why is that? Well… It has to do with  the fact that my theme is a Child Theme, based on Thematic, so it has all the bells and whistles Thematic has… So why is it the bad… simple actually… I have to add wp_greet_box(); inside my theme to load the message.

Thematic give you the option to add below the header and above the footer using functions.php file (more info over at Thematic). That being said if I add the greet message below my header (so it is visible by my visitors) my right-side navigation would just move down… because of the way Thematic’s HTML is built. There’s nothing wrong with this of course , just that I created the design with the side bar stuck to my header so using this plugin like this in a way brakes my design.

The Ugly – Finding a workaround using functions.php in my Thematic Child Theme

To make things strait: THEMATIC IS NOT THE BAD. My workaround is .

The obvious solution was to post my greet just before of my FIRST Post Title (I’ll get back to the “first” part).

To do this I’ve used Thematic’s thematic_postheader custom hook. Since this is used for displaying the title and author data in every post I couldn’t just put add_filter( ‘thematic_postheader’, ‘greet_box’ ); in my functions.php and create a simple function with wp_greet_box(); inside because that would just delete my titles…( I mean not displaying them ).

So I’ve copy-pasted the code from inside themes/thematic/library/functions/hooks-filters.php that is related to thematic_postheader hook inside my greet_box() function and made a small modification – code and comments below:

function greet_box(){

//this is the original code from the hooks-filters.php file

global $post, $authordata;

if (is_single() || is_page()) {
$posttitle = '<h1 class="entry-title">' . get_the_title() . "</h1>\n";
} elseif (is_404()) {
$posttitle = '<h1 class="entry-title">' . __('Not Found', 'thematic') . "</h1>\n";
} else {
$posttitle = '<h2 class="entry-title"><a href="';
$posttitle .= get_permalink();
$posttitle .= '" title="';
$posttitle .= __('Permalink to ', 'thematic') . the_title_attribute('echo=0');
$posttitle .= '" rel="bookmark">';
$posttitle .= get_the_title();
$posttitle .= "</a></h2>\n";
}

$postmeta = '<div class="entry-meta">';
$postmeta .= '<span class="author vcard">';
$postmeta .= __('By ', 'thematic') . '<a class="url fn n" href="';
$postmeta .= get_author_link(false, $authordata->ID, $authordata->user_nicename);
$postmeta .= '" title="' . __('View all posts by ', 'thematic') . get_the_author() . '">';
$postmeta .= get_the_author();
$postmeta .= '</a></span><span class="meta-sep"> | </span>';
$postmeta .= '<span class="entry-date"><abbr class="published" title="';
$postmeta .= get_the_time('Y-m-d\TH:i:sO') . '">';
$postmeta .= the_date('', '', '', false);
$postmeta .= '</abbr></span>';
$postmeta .= "</div><!-- .entry-meta -->\n";

if ($post->post_type == 'page' || is_404()) {
$postheader = $posttitle;
} else {
$postheader = $posttitle . $postmeta;
}
// this was the original filter applied to  thematic_postheader
//echo apply_filters( 'thematic_postheader', $postheader );

echo $postheader; //I've just echoed out $postheader because

//the hole function will be added to the filter below
}

add_filter( 'thematic_postheader', 'greet_box' );

Now if all that wasn’t bad enough, if I leave it like this the greet box will appear in all posts above the title, which means on the homepage I will have 10 identical greet boxes for all my 10 posts… Not a pretty picture one might say.

There is a solution if you are wondering…

I’ve created a global variable that it’s initialized with ’1′ once the page loads (I’ve called it $greet_count). I’ve done this inside a init_count(); function that gets hooked to thematic_belowheader so it get’s initialized only once on page load (if we would’ve added it to the greet_box() function that hooks into thematic_postheader it would have been re-initialized on every post and still display 10 greet boxes on the home page ).

This in my functions.php file after all the hacking

function init_count(){
global $greet_count;
$greet_count = 1;
}
function greet_box(){

global $post, $authordata, $greet_count; //added the counter as a global var.

if (is_single() || is_page()) {
$posttitle = '<h1 class="entry-title">' . get_the_title() . "</h1>\n";
} elseif (is_404()) {
$posttitle = '<h1 class="entry-title">' . __('Not Found', 'thematic') . "</h1>\n";
} else {
$posttitle = '<h2 class="entry-title"><a href="';
$posttitle .= get_permalink();
$posttitle .= '" title="';
$posttitle .= __('Permalink to ', 'thematic') . the_title_attribute('echo=0');
$posttitle .= '" rel="bookmark">';
$posttitle .= get_the_title();
$posttitle .= "</a></h2>\n";
}

$postmeta = '<div class="entry-meta">';
$postmeta .= '<span class="author vcard">';
$postmeta .= __('By ', 'thematic') . '<a class="url fn n" href="';
$postmeta .= get_author_link(false, $authordata->ID, $authordata->user_nicename);
$postmeta .= '" title="' . __('View all posts by ', 'thematic') . get_the_author() . '">';
$postmeta .= get_the_author();
$postmeta .= '</a></span><span class="meta-sep"> | </span>';
$postmeta .= '<span class="entry-date"><abbr class="published" title="';
$postmeta .= get_the_time('Y-m-d\TH:i:sO') . '">';
$postmeta .= the_date('', '', '', false);
$postmeta .= '</abbr></span>';
$postmeta .= "</div><!-- .entry-meta -->\n";

if ($post->post_type == 'page' || is_404()) {
$postheader = $posttitle;
} else {
$postheader = $posttitle . $postmeta;
}

//checked to see if the box was displayed before
if ($greet_count == 1) { wp_greet_box();$greet_count=2; }

//echo apply_filters( 'thematic_postheader', $postheader );
echo $postheader;
}

add_filter( 'thematic_belowheader', 'init_count' );
add_filter( 'thematic_postheader', 'greet_box' );

Now that was simple right? I came up with this idea after over 1 hour of trying to position that box with css without breaking the layout and failing miserably.

I have now clue to how some one else might find this useful, but it’s a big web out there and if you had any uses for this hack please let me know! It would be really interesting to see what you’ve come up with.

Also if someone else has am idea on how to do this using Child Themes other then my own please let me know!

Related posts:

1. Create an “About the author” area for Thematic
2. Add “Featured Posts” to your Thematic child theme
3. 10 design tips for your custom wordpress theme built with thematic