brassblogs

I need to get my bearings!

I was away last week (my little brother got married! I used to change his diapers! I can’t believe it.), and I returned with an illness, so I’ve been unexpectedly down for the count this week as well. I’m still not 100%, but at least I can now sit here and do some things without feeling woozy.

So, now I need to figure out where I left off and provide you a new goodie… hmmm… what shall I do next? (perhaps learn how to plan this better? LOL)

I know – let’s do some custom fields fun!

Now, for the record, WordPress 2.8 came out the VERY DAY I left to go to my brother’s wedding. So I have not yet had the chance to mess with 2.8 yet, and for that I apologize. However, that being said, I figure this’ll be useful anyway, since WordPress seems to always degrade nicely (I still have a lot of code I wrote for 2.0.x and it still works great). So I’m going to assume this still works fine until I actually get to test it out – but please be aware if you have upgraded to 2.8, then I can’t guarantee this stuff works. I’m pretty sure it will, but… use at your own risk.

(Now watch, this’ll be rendered obsolete in 2.8 – that’s so my luck LOL)

Okay, custom fields. They are terrific. I’ve used them a lot for things like portfolio sites, or wanting to display something like an image in place of a title – stuff like that. They are very useful and configurable, and you can do so many things with them. I highly recommend them for something like portfolio or video sites.

In fact, I’m using custom fields on this site for a myriad of purposes, but I’m still writing a plugin for Mal’s/WordPress connection that relies heavily on them.
Let’s take the simplest of these – it’ll give you an idea, and it’s easy enough that those with little PHP knowledge will still be able to find this useful One of the most common things I see requested on the forums is the ability to replace a title (say, in the sidebar) with an image that links to the post – but have the post title appear instead of the image when you’re actually in there. (Sometimes even the image will be within the post content, or it’ll be next to the title.) So I’ll use that idea as the base example, since it’ll be the easiest one to explain, and I think it’ll help you understand it and maybe get more out of it, if you so desire.

Initially, you want your index page to list your last 5 most recent posts in the sidebar (for example. Just sayin’. It really can be anything, but this seems like a good one to go with.) You’d like them to appear as linked images rather than linked post titles. So, here’s what you do.

Step one: find the image you want to replace the title with. Use the image uploader (within the “Write Post” area) to upload your image. Choose your settings (for this upurpose, you’ll probably want the “thumbnail” version) Now, when you get to the part where you need to insert the image, you want to go to where it says “Link URL”. Copy that entire line. (If you’d like the image to appear within the post content when the end user goes to read the post, then feel free to insert it into the body at this time – just be sure you change it to “medium” or whatever you want to show before you insert it, or you’ll get the thumbnail in there too.)

Step two: now, scroll down to the “Custom Fields” section in the “Write Post” area. Click the “Enter New” link (under the dropdown) and give the field a generic name. You want it to be generic because you’ll be using it a lot from now on – so you want something that will trigger the knowledge later on that *this* is what you use to replace title with images – so in this example, we’ll call it “title_image”. In the “Value” part, paste the image information you just copied. After doing that, click “Add Custom Field”.

Your custom field has been created and inserted into the post. Now, how do we get it to show? This is where the magiv of get_post_meta comes in.

Step three: open up the blessed functions.php file. Crack those knuckles, and let’s start writing it out.

function_replace_titles() {
// this may or may not be necessary. My still-sick brain cannot recall at this time. I'm pretty sure it's not necessary, so go ahead and try it without - and if it doesn't work, then uncomment the next line and see if that helps.
// global $post;

$id = $post->ID; // get the post ID
$key = 'title_image'; // the name you gave this field
$single = 'true'; // return only the first value
$image = get_post_meta($id, $key, $single); // the magic value!
echo $image;
}

Okay, now if you took this and placed “<?php replace_title(); ?> in your theme files – well honestly it wouldn’t do anything unless you were on a single post page. Then it would just echo out the image file location. But we want something prettier than that. So…

Step four: open up your sidebar.php file. What we’re going to do here is pull in a query (uh-huh – I toldja query_posts is wonderful thing, didn’t I?) to grab the 5 most recent posts, but instead of listing titles, we want the image to replace them:

<?php $recent = new WP_Query('showposts=5&offset=1');
if($recent->have_posts()) : while($recent->have_posts()) : $recent->the_post(); ?>
<a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>">
<img src="<?php replace_titles(); ?>" alt="<?php the_title(); ?>" /></a>
<?php endwhile; endif; ?>

And what should come up in your sidebar are the thumbnail images you set in the custom values for your posts for the 5 most recent posts made on your site. (Oh, and the “offset=1″? It’ll shift it so that the one that’s showing up – the current and most recent post – doesn’t also show up in the list.) They will be linked thumbnail images, and when you click on them, it’ll take you directly to the post without passing “Go”. If you placed the image within the post as well, then it’ll be in the content, as usual.

As I said, this works very well for all kinds of things. Don’t feel limited to images only. You can also use it for any kind of information you’d like to put it – it’s all a matter of what you want to retrieve, and how you use that information when you retrieve it.

That being said, you can use this awesome function that makes using custom fields even nicer. It just makes them “prettier” and integrates better, I think. (It’s now a standard in all the WP sites I do – it’s just too cool to NOT use it.)

Hope that helps you out – and as usual, feel free to leave questions in the comments section or email me (I prefer in the comments, because I like to answer questions publicly – it may help someone else who has the same question! Bust still, email’s okay.)