WordPress 3.0 “Thelonious” is released! Update your copy of wordpress now to enjoy new features such as:

• The new TwentyTen default template
• Header and Background customization
• New Link shortener
• Custom post types for better content management
• AND MUCH MORE!

Read on for the video tour of wordpress 3.0!

Link to official release notes: http://wordpress.org/development/2010/06/thelonious/

WordPress 2.9 Camen (in honour of jazz vocalist Carmen McRae) has arrived! Have you upgraded your wordpress yet? There are a few newly added features that are definitely useful for many people. I for one love the new image editing feature, sure it ain’t that powerful but it sufficient enough for some minor editing. Thumbnails for articles and stuff now come built in within the engine itself and you can use it for your new theme and so on. Check out the main site for information on all the changes and stuff.

Hit the jump for the video to introduce some of the features in version 2.9

I quote from the wordpress official blog:

The coolest new stuff from a user point of view is:

1. Global undo/”trash” feature, which means that if you accidentally delete a post or comment you can bring it back from the grave (i.e., the Trash). This also eliminates those annoying “are you sure” messages we used to have on every delete.
2. Built-in image editor allows you to crop, edit, rotate, flip, and scale your images to show them who’s boss. This is the first wave of our many planned media-handling improvements.
3. Batch plugin update and compatibility checking, which means you can update 10 plugins at once, versus having to do multiple clicks for each one, and we’re using the new compatibility data from the plugins directory to give you a better idea of whether your plugins are compatible with new releases of WordPress. This should take the fear and hassle out of upgrading.
4. Easier video embeds that allow you to just paste a URL on its own line and have it magically turn it into the proper embed code, with Oembed support for YouTube, Daily Motion, Blip.tv, Flickr, Hulu, Viddler, Qik, Revision3, Scribd, Google Video, Photobucket, PollDaddy, and WordPress.tv (and more in the next release).

Have fun!

I’ve recently chanced upon an article that inspired me greatly. The article is basically adding thumbnails to the related posts instead of just having the text link itself. Well, who would have actually thought of that? This idea has never ever crossed my mind before. We know of how Youtube uses thumbnails for related video but perhaps it is necessary since it is concerning videos. Never did I thought of actually putting thumbnails beside related posts in blogs and websites. I don’t know why but I’ve to actually emphasize that point over and over again. Because it is so simple, mundane and that we’ve seen it applied in various other types of sites etc, but why not in blogs?

A picture tells a thousand word. It draws attention, creates interest and of course allows readers to visualize much better. I’ve known about Google Adsense’s rules of not having images beside their advertisements. However, what I didn’t know was that the ban was due to those images resulted in making many people decide to click the advertisement. Yes, to think of it, I did once click on some advertisements due to the pictures beside it (totally unrelated pictures actually). So to put these thumbnails together with your awesome titles, wouldn’t that generate a surge of interest within the reader?

The original idea, code etc all belong to this site:

BuildInternet

The original article:

Display Thumbnails for Related Posts in WordPress

With that said, this post is actually to help some people out who wanted some kind of modification to the modification. Basically the idea and code given in the article above (buildinternet) requires the blog owners to use a custom field. That, is very troublesome for it simply meant that every single article you have to fill in one more extra blank. For those bloggers who actually have been doing so (due to their theme and whatnots), it is completely fine. However, what about those bloggers that never does such things? Would it mean that they have to go back to the mountains of articles they have written long ago to add in the custom field? It would be extremely taxing and time wasting.

With me and many other bloggers falling into that category, we wanted the process to be automated. Yes, after I read the article I immediately went tweaking the code to try emulate the automated process I wanted. I ain’t a professional coder nor do I actually have little knowledge in coding (PHP in this case), but a little research and some testing does wonders.

This whole modification is based on the plugin called “Yet Another Related Post Plugin” (YARPP). Without that, you cannot proceed any further.

Without further ado, the modification to the modification (largely based on the code on buildinternet):

Download the YARPP Plugin

As said earlier, the modification we are about to do is based on the plugin itself. Download the plugin else you have to create a whole related post plugin yourself which this guide have no use helping at all.

Download TimThumb

TimThumb is required to create the necessary thumbnails etc for the related posts. Download it and upload it into your website. For me, I’ve placed the script itself into a folder called “scripts” in my theme folder.

Create a Template File

Upon successful installation of the plugin, you will realise that it allows a template system for displaying the different related posts. You can look through the different examples they provided and it might just give you more inspiration for better stuff.

For now, create a file named “yarrp-template-anythingyouwant.php” in the root of your theme folder. So basically if you’re using a theme called “whatever”, it would be in “/wordpress/wp-content/themes/whatever”. In this file, it will basically contain the structure of how the related posts are displayed.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38

<h4 class="meta">Other articles that might interest you</h4>  
 
<?php if ($related_query->have_posts()):?>  
 
    <div class="related-posts">  
         <?php while ($related_query->have_posts()) : $related_query->the_post(); ?>  
 
<li>                 
                 <a href="<?php the_permalink() ?>" rel="bookmark">
 
				<?php $id =$post->ID;
					$the_content =$wpdb->get_var("SELECT post_content FROM $wpdb->posts WHERE ID = $id");
					$pattern = '!<img.*?src="(.*?)"!';
					preg_match_all($pattern, $the_content, $matches);
					$firstimage_src = $matches['1'][0]; ?> 
 
				<?php if($firstimage_src != '')  : ?>  
 
					<img src="<?php echo bloginfo('template_url'); ?>/scripts/timthumb.php?src=<?php echo $firstimage_src; ?>&amp;w=150&amp;h=90&amp;zc=1&amp;q=100"
    				alt="<?php the_title(); ?>" />
 
				<?php else : ?>
 
					<img src="http://swiftworld.net/defaultthumbnail.png" alt="<?php the_title(); ?>" />
 
                 <?php endif; ?>  
 
                 <?php the_title(); ?></a>  
 
</li>   
         <?php endwhile; ?>  
     </div>  
 
 <?php else: ?>  
 
     <p>No related posts found</p>  
 
 <?php endif; ?>

What the code simply does is if related posts exists, it will go through each content of the related posts and select the first image it sees. TimThumb then creates the necessary thumbnails and resize accordingly.

What you must need to edit are lines:
20: Change according to where your script is, leave the <?php echo $firstimage_src; ?> in place and lastly edit the width and height of the image that is generated. w for width, and h for height. The ZC and Q are stuff that you do not really need to temper with. You can read up at TimThumb’s website on what they actually does etc.

25: Image when no first images are found in the content. Basically the default images to put in should there not be any at all in the article.

This code is just an example of how it the modification actually works. You can change edit and modify to suit your own needs.

Customize Modification with CSS

The CSS is taken directly from buildinternet, all credits to them. Edit to suit your own needs as well.

1
2
3
4
5
6

/* Related Posts */  
div.related-posts {clear:both; text-align:center; margin:10px 0px 0px 0px; padding:0;}  
div.related-posts li{width:150px; float:left; display:inline; margin-right:15px;; padding:0;}  
div.related-posts img{clear:both; padding:5px; background:#F7F7F7; border:1px solid #DDD;}  
div.related-posts a{clear:both; display:block; border:none; text-decoration:none;}  
div.related-posts li{font-size:12px;}

Activate the New Template

Go into the YARPP options page and under Display Options, check the box of Display using a custom template file. Select “yarpp-template-whateveryouwant.php” from the list. Save changes.

See and do necessary adjustments

Refresh your pages and adjust the template accordingly. For more fancy designs and stuff, you’ve to figure that out yourself.

CREDITS TO:
BuildInternet
http://wordpress.org/support/topic/246893