I decided to write this post because I wanted a way to align my featured image to the right by changing the default class from “alignleft” to “alignright”. I figured it would be simple enough to do. I probably just had to add a filter to a featured image hook or something along those lines.
OMG, I was so wrong.
First thing I realized was that the Genesis Framework doesn’t have a specific filter for the Featured Image. You can add an image in your post and have Genesis pull the first thumb. But when you activate the featured image in the Genesis settings, all you can do is change the size.
First thing I had to remember is that the Genesis Framework is still WordPress. Well duh! But, with all the hooks and filters and functions that are included in the framework, sometimes I forget that I can always go back to the basics.
Genesis doesn’t have a filter that directly affects the featured image on the post but WordPress does!
has_post_thumbnail(); the_post_thumbnail(); get_the_post_thumbnail();
Sometime the solutions can take so long to get to, but in the end, they’re so simple!
The Solution to using the Genesis Featured Image
First add the image size to your functions.php file.
/** Add new image sizes */ add_image_size( 'post-image', 150, 150, TRUE );
Quick Explanation: post-image is the reference to the size, 150 is the height and width, TRUE means to crop the image.
Now add the action.
/* Manipulate the featured image */ add_action( 'genesis_post_content', 'ibfy_post_image', 8 );
Keep in mind that the featured image is within the post content. So we’re adding our new function to the genesis_post_content hook.
Now the meat!
function ibfy_post_image() {
global $post;
if ( is_page() )
return; // Make pages act normal
//setup thumbnail image args to be used with genesis_get_image();
$size = 'post-image'; // Change this to whatever add_image_size you want
$default_attr = array(
'class' => "alignright attachment-$size $size",
'alt' => $post->post_title,
'title' => $post->post_title,
);
// This is the most important part! Checks to see if the post has a Post Thumbnail assigned to it. You can delete the if conditional if you want and assume that there will always be a thumbnail
if ( has_post_thumbnail() && is_home() ) {
printf( '<a href="%s" title="%s">%s</a>', get_permalink(), the_title_attribute( 'echo=0' ), genesis_get_image( array( 'size' => $size, 'attr' => $default_attr ) ) );
}
}
Here’s a little explanation on what I discovered printf() is. Basically you put in your code with little tags like %s, which just means “string”. There’s also %d which means return an integer. This is almost exactly the same as sprintf(). I’m not sure what the difference is Thanks to Kevin Lloyd, I finally do understand the difference, and it’s used with Genesis, quite often actually so it’s good to start to understand how to use it.
Each %s gets the value from the properties after the quotes IN ORDER. So in the code above, ‘href=”%s”‘ gets the first property which is “get_permalink()” and so on.
The genesis_get_image() function will now return the featured image with the attributes we set at the beginning! You can now manipulate the Genesis Featured Image however you want. Add classes, change alignment, go nuts!!!
Here’s the full code to copy:
/** Add new image sizes */
add_image_size( 'post-image', 150, 150, TRUE );
/* Manipulate the featured image */
add_action( 'genesis_post_content', 'ibfy_post_image', 8 );
function ibfy_post_image() {
global $post;
if ( is_page() )
return; // Make pages act normal
//setup thumbnail image args to be used with genesis_get_image();
$size = 'post-image'; // Change this to whatever add_image_size you want
$default_attr = array(
'class' => "alignright attachment-$size $size",
'alt' => $post->post_title,
'title' => $post->post_title,
);
// This is the most important part! Checks to see if the post has a Post Thumbnail assigned to it. You can delete the if conditional if you want and assume that there will always be a thumbnail
if ( has_post_thumbnail() && is_home() ) {
printf( '<a href="%s" title="%s">%s</a>', get_permalink(), the_title_attribute( 'echo=0' ), genesis_get_image( array( 'size' => $size, 'attr' => $default_attr ) ) );
}
}
Last thing to remember is to disable “Include the Featured Image?” under the Genesis Content Archives settings.
If you know a different way or a better way, please share!
Resource: I borrowed some code from a wpsmith tutorial on something totally different, thanks!
Alternative way to edit the featured image
So I just discovered another way to edit the file, which is so much easier! Here’s the code!
/** Change the featured image */
remove_action( 'genesis_post_content', 'genesis_do_post_image' );
add_action('genesis_post_content','ibfy_post_image', 0) ;
function ibfy_post_image() {
if ( ! is_singular() && genesis_get_option( 'content_archive_thumbnail' ) ) {
$img = genesis_get_image( array( 'format' => 'html', 'size' => genesis_get_option( 'image_size' ), 'attr' => array( 'class' => 'alignright post-image' ) ) );
printf( '<a href="%s" title="%s">%s</a>', get_permalink(), the_title_attribute( 'echo=0' ), $img );
}
}
Using TimThumb to Edit the Featured Image Size
Have your image hard cropped so that it’s always the same size.
/** Change the featured image */
remove_action( 'genesis_post_content', 'genesis_do_post_image' );
add_action('genesis_post_content','surefire_post_image', 0) ;
function surefire_post_image() {
if ( ! is_singular() && genesis_get_option( 'content_archive_thumbnail' ) ) {
$img = genesis_get_image( array( 'format' => 'url') );
printf( '<a href="%s" title="%s"><img src="%s/path/to/your/timthumb.php?src=%s&w=225&h=160" /></a>', get_permalink(), the_title_attribute( 'echo=0' ),get_stylesheet_directory_uri(),$img );
}
}
I design and develop websites with wordpress, I like anime, I play video games, and my mind is always thinking of new ideas. 
thanks, I was also expecting a filter of some sort
Paul recently posted..add a parent class to custom WordPress menu items that have sub menus
It would’ve been so easy… In any case, I find that the second method listed is the best way to go, but the first is great for full customization.
You second option is much more efficient and really the best way to go until such a time as a filter is added to allow this change to be made more efficiently.
I would recommend it over timthumb for performance reasons (with the built into WordPress image sizing the images are sized once and not every time they are called and the cache is empty). It also minimizes outside code that has to be maintained.
On that last point, I think we are all familiar with the big security issue TimThumb went through a few months ago. They actually were on top of things but the vulnerable code was in millions of sites and could be exploited even if the theme or plugin wasn’t active. Since code has to be maintained this made for a security nightmare. By using the built in WP functionality, you just need to upgrade WP to maintain the code and thus improve security.
In any case, the code looks good. I especially like teh progression to simpler code as you learned a better way to do it.
Nick the Geek recently posted..A Better Home Page
Thanks so much for the feedback. I’m definitely familiar with the TimThumb hack, it haunted me for a few weeks. The only thing I don’t like about the wordpres image resize is the crop that it does. If the image you use isn’t proportional to the dimensions your using for your featured image, it won’t do a true crop.
Maybe a compromise would be to host your timthumb script off site and use the wordpress core as a backup…
To answer your question:
printf() will actually output the text like echo does.
sprintf() (I assume that’s what you meant) will return a string that you can stuff into another variable and use later.
Kevin Lloyd recently posted..Getting Sassy with Compass and Sass
You, my friend, are awesome! Thank you for the clarification!
Cool…Thanks! Also I love the way your post date slides out when you hover over the title. Did you do that with JavaScript?
Shanna recently posted..Utilize WordPress Theme
Yup, just a little bit of jQuery. All the other transitions like links, etc are CSS3. I’m actually getting this theme together to sell it in my upcoming market place =). Keep an eye out!
Awesome…Thanks
Shanna recently posted..Utilize WordPress Theme
Trying this in the functions file of the Fabric child theme with no results. I know I’m doing something wrong and should probably go to bed and look at it in the morning. I even tried to simply use remove_action( ‘genesis_post_content’, ‘genesis_do_post_image’ ); and still nothing. And by nothing, I mean the site acts as though I haven’t changed a thing. I too and simply trying to remove the left align.
OK, I’m going to bed and will look at it in the morning. Maybe one of you fine and outstanding folks will offer me some advice that will make my morning.
Thanks, Keith
Hey Keith, one thing I noticed is the Genesis Admin will sometimes override your functions. Go into the Genesis Admin settings and make sure the “Show featured Image” box is unchecked in the blog archive section. See if that makes a difference.
Jonathan, thanks for the reply. That box is not checked. ???????
hmmmm…. send a link to the site and paste the code in your function file. I’ll take a look for you =)
Hi thanks for this tutorial but its not working for me.
Hi there! Super happy to run across your post after some pretty fruitless searching. I am NOT a php person, at all, and I have the code pasted in the functions file of my child theme. But I am still getting the featured post images aligned left (and right, on Firefox) go figure. I would love to do away with the featured posts widget altogether, quite frankly. I would like to be able to post 2 (or more images) without having to deal with the Featured Post stuff.
I do have the included Featured Post Image turned off. Thanks for any direction, kind of a n00b!
Shari Miller recently posted..Post 3
What exactly are you trying to do? Remove the featured image? add multiple images? This is something that may need to be looked into further (like diving into the code, what plugins are being used, etc.)
Great post, thanks for sharing your knowledge. I came across a bug in you post in ‘the meat’ section. The line below has the title and href attributes transposed. The printf statement puts the permalink in the title tag and the title tag in the href.
printf( ‘%s‘, get_permalink(), the_title_attribute( ‘echo=0′ ), genesis_get_image( array( ‘size’ => $size, ‘attr’ => $default_attr ) ) );
Reversing them fixes the problem.
printf( ‘%s‘, get_permalink(), the_title_attribute( ‘echo=0′ ), genesis_get_image( array( ‘size’ => $size, ‘attr’ => $default_attr ) ) );
Thought you might want to know. I really do appreciate sites like this with helpful snippets, thanks again!
Mike
oops, looks like the code was filtered. Be happy to explain via email if you don’t catch it.
Mike
Nice Catch!! Fixed it, thanks for the info!!
Well that was a great tutorial, but I want my homepage featured image to be in center rather than aligned to left and right. Is their any way to do so. Please kindly help me.
Vivek recently posted..Prevent Negative SEO : Important Tools And Methods