With the popularity of jQuery, AJAX, and client-side programming operations in general, there’s more use made of JSON as a format for getting data backwards and forwards.

For example, the Twitter API offers data as JSON – and more manageably than accessing their RSS XML feeds for user timelines etc.

http://twitter.com/status/user_timeline/USERNAME.json?count=10 

The issue is how to make use of JSON-encoded information in the WordPress environment – much of what is available is only recently available, so some care has to be taken about how it’s used.

1. Native PHP functions

json_encode() and json_decode() make life very simple – but these functions are only available in PHP >= 5.2.0 and WordPress is still designed to run on significantly older versions of PHP than this. Alternatives would have to be supplied if you were thinking about releasing a plugin. There are custom-written functions to reproduce these in PHP4, see for example user contributions to json_encode. These are often not 100% perfect, but one may well do all that you require…

2. JSON2

If you’re happy to do the work in jQuery/javaScript, WordPress 2.9 comes with JSON2 bundled, registered and ready to go…

add_action('wp_print_scripts','load_json_parser');

function load_json_parser(){

	if (is_admin()) return; // probably don't want this on admin pages

	wp_enqueue_script('json2');

}

No need any more to play around with eval in the javaScript, but again, this is a WordPress >= 2.9 thing….

3. Borrowing the Text Editor

Lastly, there is one more, slightly unofficial, dodge that can be used. WordPress makes use of TinyMCE as its rich text editor and this comes with the its own JSON parser. Results may not be completely predictable.

require_once(ABSPATH."/wp-includes/js/tinymce/plugins/spellchecker/classes/utils/JSON.php");

$jsObj = new Moxiecode_JSON();

// encodes the supplied array to JSON format
$json = $jsObj->encode(array("key1"=>"value1","key2"=>"value2"));

//decodes supplied JSON to a PHP array
$json_array = $jsObj->decode($json);

People have predicted their death for a long time, but pingbacks/trackbacks (and displaying them) are still firmly with us – there is a certain vanity involved…

They do give an indication of related content, other sites in your niche (and just how many automated spam sites there are out there ) etc. At the same time, they break up the flow of user comments and even with threaded comments can make it difficult for visitors to follow the discussion.

So it’s reasonable to separate out pingbacks and perhaps not include their digest content, just the title and a link. The method has changed for WordPress 2.7 upwards, with the arrival of threaded comments and their integration into the core code.

The frist step is to adjust the call to the comments template in single.php or where ever you’re hoping to display the comments… Replace:

<?php comments_template(); ?>

with

<?php comments_template('', true); ?>

The “true” flag gives access to an array $comments_by_type – as the name might even suggest, a record of the numbers of each type of comment for that post.

Your theme will (should) have something like this code in it – most likely in comments.php but possibly as a separate comments template function in functions.php or elsewhere – the important thing is to locate comments_number() and wp_list_comments()

<h3 id="comments"><?php comments_number('No Responses', 'One Response', '% Responses' );?> to &#8220;<?php the_title(); ?>&#8221;</h3>

<ol class="commentlist">
<?php wp_list_comments(); ?>
</ol>

Replace it with this:

<?php if ( !empty($comments_by_type['comment']) ) : ?>

<h3 id="comments"><?php comments_number('No Responses', 'One Response', '% Responses' );?> to &#8220;<?php the_title(); ?>&#8221;</h3>

<ol class="commentlist">
<?php wp_list_comments('type=comment'); ?>
</ol>

<?php endif; ?>

<?php if ( ! empty($comments_by_type['pings']) ) : ?>

<h3 id="pings">Trackbacks/Pingbacks</h3>
<ol class="commentlist">
<?php wp_list_comments('type=pings'); ?>
</ol>

<?php endif; ?>

We have 2 lists now, created by wp_list_comments

The other (optional) issue is to recalculate the headline figure of comments – which is still showing the total of user comments + pings. This is done with the use of the get_comments_number filter. Add, in functions.php

<?php

add_filter('get_comments_number', 'comment_count', 0);
function comment_count( $count ) {
if ( ! is_admin() ) {
global $id;
$comments_by_type = &separate_comments(get_comments('status=approve&post_id=' . $id));
return count($comments_by_type['comment']);
} else {
return $count;
}
}
?>

And that should be that – next step would be to restyle the two lists, with a customized callback function for wp_list_comments() – but that will have to be for another post…

Expressivo is a free WordPress theme, three-column with two righthand sidebars – going to a single sidebar on single posts and pages. With Cufon embedded fonts for post titles, threaded and paged comments – you can also replace the header completely with your own image.

Version 1.1 has been tested on Firefox 3, Internet Explorer 6 & 7, Google Chrome, Opera 9.

Features

• Custom link and hover colors
• jQuery dropdown menu for static pages – exclude pages and configure item order
• Add your own header image / logo
• Embedded fonts
• Translation ready

Demo: Expressivo demo

Download: Expressivo WordPress Theme v1.1 – expressivo.zip Compatible with WP > version2.8

This theme is released under the terms of the GPL licence.

Our free themes are supplied “as is” – sorry, but we don’t have the resources to offer support for email enquiries or comments about individual installation/customisation. You’re free to use and modify them as you wish, but we would ask you to retain the credit link in the footer.

You want a jQuery slideshow for your WordPress blog? - on the front page, or maybe in the sidebar? No real problem, all the javascript is taken of with the help of a jQuery plugin, all we have to do is figure out how to get the post data.

And to keep things really simple, this is going to use the thumbnail functions in WP 2.9 – no need to mess around with custom fields any more.

Firstly, you do have to explicitly declare the new thumbnail system in functions.php – and best to wrap it up in an “if function exists” to avoid problems for older WP installs.

if (function_exists('add_theme_support')) {
add_theme_support( 'post-thumbnails' );
add_image_size('slideshow-image', 300, 160); // for front page slideshow
}

The smart move is to define a “Featured” category – any post in that category will be available for the slideshow, and that’s the selection taken care of. Create a category – call it featured, or anything, but make a note of the cat_ID – mouseover a category on the admin categories page and it’ll be in the url, something like:

http://testblog.com/wp-admin/categories.php?action=edit&cat_ID=3

The ordering will be by date, newest first. (Don’t forget you can tweak the timestamp of a post if you really want to just to get the order exactly as you want it).

So create a couple of posts in this category and add some thumbnails to them – since our slideshow is going to be 300px by 160px, make sure they’re bigger than that. Then, in home.php, or index.php, where ever you want the slideshow to appear, add:

<?php

$featured_category_id = 3;
$number_of_posts = 4;

$args = array('showposts'=>$number_of_posts, 'cat'=>$featured_category_id);

$slideshow_query = new WP_Query($args);

?>
<div id="slideshow">
<?php
// let's keep a record of the post IDs as we go, in case we want to omit these from other post loops/lists on the same page
$duplicates = array();

while ($slideshow_query->have_posts()) : $slideshow_query->the_post();

//add the ID to the duplicates array for future reference
$duplicates[] = $id;

//test to see whether there's a thumbnail associated with the post
if (has_post_thumbnail()) {
?>
<div class="post-thumbnail">
<a href="<?php the_permalink(); ?>">
<?php	the_post_thumbnail('slideshow-image'); ?>
</a>
</div>
<?php	}
endwhile;
?>
</div>  <!-- end of #slideshow -->

Next, some javascript. We can use the excellent jQuery Cycle Plugin – as the package stands currently, we’ll use jquery.cycle.all.min.js – which allows all the possible transition effects etc. – in practice, you may well want to use the lighter versions…

* For a standard production site, always use min = minified, rather than pack = packed – pack may be a smaller filesize, but it doesn’t run quicker….

We need a very quick script to configure and activate the plugin – so create a new file, slideshow-activate.js

jQuery(document).ready(function($){
$('#slideshow').cycle({
fx: 'fade' // choose your transition type, ex: fade, scrollUp, shuffle, etc...
});
});

Later, there are lots of options here, transition speed, pausing etc. – consult the plugin pages for ideas.

We need to get our scripts on the WordPress page, and indicate that they depend on jQuery being loaded – making use of the WordPress functions wp_register_script and wp_enqueue_script – so in functions.php

add_action('wp', 'js_head_load');

function js_head_load(){

if(is_admin()) return;  //so that we're not loading unecessary scripts in the admin

wp_register_script('cycle', get_bloginfo('template_directory')  . '/scripts/jquery.cycle.all.min.js', array('jquery'), '1.0');

wp_enqueue_script('slideshow-activate',  get_bloginfo('template_directory')  . '/scripts/slideshow-activate.js', array('jquery', 'cycle'), '1.0');

}

And then, don’t forget to put the 2 files into /scripts in your theme folder…

That should give you a working slideshow – ready to be styled with some CSS. Note that the way the Cycle plugin works is that it looks to rotate the immediate children of the div being called – here, they’re images, they could be eg. divs – so if you add a wrapper div(s) you may need to adjust slideshow-activate.js.

And if it’s not working, check first that the right scripts (jQuery, Cycle, slideshow-activate) are actually being loaded and in the right order, by looking at the page source – and check you’ve got thumbnails attached to the relevant posts…

You could go on to tidy this up – avoiding the hard-coded category id by having something in the theme options admin to change the id for example. Also, as said earlier, there’s a lot of scope in playing with the plugin parameters to get exactly the slideshow you want…

Lastly – the record of the duplicates we kept – the method for omitting them from subsequent Loops of posts is here: Multiple WordPress query duplicates

We spend enough time on the blog content and then tend to forget about the comments part. Comments are the way to get people involved – build up a blog’s readership etc etc. A few, sensible, comments trickling in will freshen up a page’s content and make it not seem completely dead in the water to passing search engine crawlers…

And the good news, there’s plenty of comment-related plugins available to get the job done.

First up, though, before anything else – make sure your WP theme and wordpress version are capable of handling threaded- (definitely) and paged- (probably) comments.

The Plugins

Added Value for Comments

DoFollow
By default, WordPress slaps a nofollow attribute on any comment author’s web site link displayed – if you’re not sure what nofollow is, more info here. DoFollow removes this attribute from web site links in comments so search engines can follow them – offering an incentive for people to leave a sensible, or otherwise, comment as they pass by. Which is clearly going to attract spammers as well – always use together with comment moderation.

CommentLuv
An elaboration of the first – more incentives to leave a comment by displaying info about the commentator’s site, with links, such as a selection of their latest blog posts, tweets or diggs.

Subscribe to Comments
Enables commentators to sign up for email notification of subsequent comments – so they can keep in the flow of the discussion.
One operating annoyance with this setup – not the fault of the plugin – involves the dicks who comment using an email address they’ve slapped a spam authentication filter on – so that the poor old WP webmaster gets an email demand for authentication for every subsequent comment until they get round to deleting the offender – a little knowledge being a dangerous thing etc.

Displaying Comments

Twittar
Displays, as an alternative to Automattic’s gravatar, the comentator’s Twitter avatar – if existent…

GD Star Rating
Does depend on the context of your blog, as to whether a comments rating system has value – might be overkill for the average blog…

Gravatar Signup
Adds a checkbox to the comment form for users who don’t have a Gravatar, giving the option to then go on and sign up for one. Prevents the march of grey men down blog comments…

Easy Comment Uploads
Allows a commentator to upload images or other files, togehter with adding their comment – with lightbox display for all added images. It’s obviously wise to be conservative about which file-types you let visitors upload – especially for non-image types.

Ajax Comment Preview
Runs the comment text through the WordPress filters to show a preview – can be useful if commentators are likely to be adding code snippets etc.

Not “comments” plugins as such, but… There are lots of ways of displaying and defining “Popular Posts” – simplest is to go for the posts with the most comments, for example:-

Most Commented Widget
Adds a sidebar widget displaying an ordered list of the posts/pages with the most comments – shows where the action is.

Top Commentators Widget
Appeal to their vanity… and gain spammers.

Anti-Spam Comment Plugins

There’s always Akismet, but there’s also:

Bad Behavior
Attempts to filter out bots by analyzing HTTP requests. Does seem to make a significant difference in server load, monthly bandwidth, for well-established blogs.

OpenID
Asks commentators to sign in before commenting, using their OpenID.
(Update: doesn’t seem 100% functional at the time of writing…)

One small warning – quite a lot of the plugins offered in the WordPress plugin repository are broken or obsolete, due to the arrival of threaded and paged comments. They (probably) won’t break the whole install if you run them, but don’t be too surprised if they don’t do what they’re supposed to…

There’s no point in hacking around with the WordPress core code. You still see people doing it sometimes and happily showing off their results, but it just isn’t a good idea. Nobody else can use it without making the same hack(s), which aren’t carried through an automatic update anyway.

WordPress action hooks allow you to access the functions of the core WP code, without messing around with that code. It’s the basis for most plugins (the whole business essentially started out as the plugin API), but themes are using them more and more and there’s no reason not to… do_action/add_action are also the means of getting external scripts, CSS, javascript/jQuery correctly on the page.

WordPress pre-dates PHP5 and the improvements available in terms of Object-Orientated Programming (OOP). So, while there are obviously classes and objects in there, everything has a flow – once the PHP engine has compiled the code, it’s run from top to bottom – it’s procedural, as they say.

Instead of adding a method to a class, or extending a class with another class, there are points in the action where the possibility of doing something is left open – action hooks – either predefined, because they’ve been put in the core code, or you can create your own.

The means of doing it involve a couple of functions…

do_action() and add_action()

Simply, do_action() is the function to create an action hook.

Whereas add_action() is tacking actions onto a given hook and always refers to a function that will called at that point.

<?php do_action( $tag, $arg ); ?>

<?php add_action( $tag, $function_to_add, $priority, $accepted_args ); ?>

The $tag is the action hook itself, a description of “where” – at what point in the action…

As an example, we can create an action hook that outputs some content on the home page just before the Loop of posts is output.

so in home.php

 <?php

 do_action( 'before_the_index_loop' ); 

    if (have_posts()) : while (have_posts()) : the_post();
     //etc etc
?>

and in functions.php

add_action( 'before_the_index_loop', 'my_helloworld_display' );

function my_helloworld_display(){

 echo "<p>This is my hello to the world</p>";

}

At the point where it reaches the action hook ( ‘before_the_index_loop’ ) put there by the do_action, it finds a function (my_helloworld_display) to call and calls it.

(Or you could put this in index.php and test whether it’s running as the home page by using is_home().)

Priority

Everything has an order – lower to higher – and if you don’t specify it, the default value of an action is 10.

So here, as an example, we can add an action earlier in the document flow that’s actually going to be run after the next add_action.

add_action( 'my_helloworld', 'my_second_helloworld_display', 20);
add_action( 'my_helloworld', 'my_helloworld_display');

function my_second_helloworld_display(){
 echo "<p>Hello again to the world</p>";
}

function my_helloworld_display(){
 echo "<p>Hello to the world</p>";
}

Will produce:

Hello to the world
Hello again to the world

Accepted arguments

In, say, header.php, we can place a hook with some arguments:

do_action( 'my_details', get_bloginfo('name'), get_bloginfo('description'));

While in functions.php we’re going to expect 2 arguments to be passed to the function.

add_action( 'my_details', 'my_details_display', 10 ,2);

function my_details_display($name, $description){

 echo "<p>This is the name of my blog: {$name} and this is its description: {$description}</p>";
}

(Of course, this is just for the very simple example of it, to show how arguments are passed to any function referenced by an add_action – the whole process could have been short-cut just by putting bloginfo(‘name’) on the page…)

In practice, it can be slightly tricky to find out the what and how many of arguments are being passed to predefined action hooks – that’s when you do have to look into the core code.

And just for experiment (on a development site, don’t leave lying around on anything live)

add_action('wp', 'my_vardump');

function my_vardump($query){
	global $post;
	print_r($query);
	print_r($post);
}

Just to see what’s available to play with…

There are a lot of action hooks strewn around the place in WordPress code already – not all of them are terribly well-documented, (it’s a large job). The thing to do is to consult first the Codex for the main list of hooks and then experiment, adding your own hooks and making use of those already there. At least, action hooks do simplify the whole process – it’s only one line of code to comment out if things start going wrong.

Some thoughts on Twitter and how it affects the average WordPress blogger presently :- how to get value out of it, what to avoid and how to maintain a decent etiquette – it does seem to have grown slightly in the last year or so.

Success requires 2-way communication. “Broadcasters” – you know the ones… Their profile says 3 following 12,455 followers – they’re not being a success via Twitter, they’re trading off an established reputation.

It would be nice not to have to do the work, but if you’re starting at the bottom… you’ll have to do the work, no one else will. Follow those who follow you.

Twitter is networking, linking, creating connections, so there’s logic in not just tweeting your own content.
If someone tweets your content tweet about theirs and/or retweet them. People do respond well to being talked up – shameless, I know, but we are creatures of vanity. Giving someone a positive mention can pay a dividend. You can give them a recommendation at MrTweet and elsewhere, and there’s always #followfriday.

Note that there are 2 competing factors with retweeting someone else’s content.

1. You want to keep retweets vaguely accurate to your niche, obviously
2. But you’ll want to introduce your followers to someone/something new – they’ll think of you as authoritative, god forbid…

Try to keep a handle on what you retweet, it’s all too easy to get carried away by the urge to fill up the timeline and look busy. So careful who you recommend and retweet because it all reflects on you. Avoid the gimmicks of you follow me, I’ll follow you etc etc. looks tacky….

And do watch out for shortened urls – don’t display or retweet anything you haven’t first checked, and that definitely includes anything that arrives in a comment.

The nature of Twitter now is that nobody can read all their tweets – so a little bit of duplicate tweeting for your own content has its value. Too much and the risk is obvious, so maybe if you’re tweeting up a new blog post, mention it a couple of times on the day and then again a couple of days later, no great harm in that. Schedule – a little bit. Socialoomph, CoTweet and others have the means to schedule your priceless content.

But definitely – we’re not always as good at this as we’d like to be – make some reply to your @mentions, if they’re not completely auto-generated.

On the other hand again, it’s more difficult, and probably not efficient, to keep up with all your direct messages – far too many of these are auto-generated marketing drivel. So there’s probably no good reason to DM somebody if you want to make sensible contact – you might try tweeting an @mention as well to indicate you sent a DM…

Don’t bother to get annoyed if someone makes no response – they may be far too busy with other things, they may be grateful but not inclined to fill up their timeline with mutual congratulations, they may be a bit of a tosser. Who knows… Don’t take it personally, get on with what’s next…

And lastly – waste no time on the pointless building of followers. There are good and bad followers, but the vast majority are meaningless followers. Yes, I know there are a few things around the web that reward huge metrics, but you’re sending out a tweet that even if noticed is never going to be in the sphere of interest of the noticer – what’s the point?

My guess, and that of others, is that Twitter is starting to fight a battle with its signal-to-noise ratio, other options such as FriendFeed seem to have their advantages (for how long…?) so it is up to you to keep it relevant…

Intrepid is a free WordPress theme, two-column with a right sidebar, compatible with WordPress version 2.8 upwards, with threaded and paged comments. 3 styles of pastel shades to choose from – blue-green, green-brown and purple-gray as default… You can also replace the header completely with your own image.

Version 1.1 has been tested on Firefox 3, Internet Explorer 6 & 7, Google Chrome, Opera 9.

Features

• jQuery dropdown pages menu – configure the item order and exclude pages
• Add your own logo in the header
• 3 pre-defined color schemes (so far…)

Demo: Intrepid demo

Download: Intrepid WordPress Theme v1.1 – intrepid.zip (Compatible with WP > version2.8)

This theme is released under the terms of the GPL licence.

Our free themes are supplied “as is” – sorry, but we don’t have the resources to offer support for email enquiries or comments about individual installation/customisation. You’re free to use and modify them as you wish, but we would ask you to retain the credit link in the footer.

With WordPress 2.9 comes a revised image thumbnail system – previously, support for posts with attached thumbnails was a little haphazard (it is a fiddly business in terms of the programming), but this is a significant step forward.

The need is for a series of images, of given size, associated with a series of posts – maybe for a front page with post excerpts and their images, or for a featured posts slideshow. Before 2.9, every theme developer had a different way of doing it – some with patent recipes for determining (guessing) which thumbnail was attached to which posts, while other themes required the web admin to add a thumbnail custom meta field manually, a bit tiresome.

add_theme_support()

Firstly, you do have to explicitly declare the new thumbnail system in functions.php – and best to wrap it up in an “if function exists” to avoid problems for older WP installs.

// to prevent  WP < 2.9 breaking
if (function_exists('add_theme_support')) {
add_theme_support( 'post-thumbnails' );
}

This produces a whole new little widget on admin post edit pages. In terms of admin, you can now attach a thumbnail image to a post using this widget, (or by adding an image via the media gallery, as before), and then taking the “Use as thumbnail” option

Usage

Now, you have the has_post_thumbnail() and the_post_thumbnail() template tags available – so in the post loop, say for home.php

<?php if ( has_post_thumbnail()) { ?>

	<div class="thumbnail">
		<a href="<?php the_permalink(); ?>">
		<?php the_post_thumbnail(); ?></a>
	</div>

 <?php	} ?>

has_post_thumbnail() tests whether a thumbnail exists for the post – if so, go on to display it with the_post_thumbnail(). You could also add an else here and go to display a default image if there isn’t a thumbnail

So far so good – but what size are the thumbnails going to be?

Sizing Thumbnails

This is where the complications arrive – but the good news there’s now various ways to control the whole system, giving you a better chance of getting what you want, fairly painlessly… There’s 3 main ways of doing it.

First, you can specify the image dimensions directly as variables in the template tag

	the_post_thumbnail(array(150,90));

Note that the variable is an array. This method is fine enough if the theme is simply using one size of thumbnail – it does give some odd results if you start elaborating, with different sizes on different pages, so…

Secondly, back in functions.php

if (function_exists('add_theme_support')) {
add_theme_support('post-thumbnails');
set_post_thumbnail_size(150, 90, true);
}

The set_post_thumbnail_size gives a default, here 150px width, 90px height – the 3rd variable is the “hard-crop” flag mode. 2 ways to go here, box-resizing (flag= false) and hard-cropping (flag=true).

Box resizing = shrinks an image until it fits the width or height value you’ve specified. So with this method, you always get the whole image in the thumbnails, but the thumbnails themselves might turn out to be different sizes, width or height.

Hard-cropping = the image is cropped to match the aspect ratio – width : height – and then shrunk to fit. So here you get all thumbnails the same size, but they may be missing cropped parts top/bottom or left/right. In practice, for general theme development, this is usually the best way to go.

Thirdly for sizing, you can use add_image_size()

if (function_exists('add_theme_support')) {
	add_theme_support( 'post-thumbnails' );
	set_post_thumbnail_size( 150, 90, true ); // default thumbnail size
	add_image_size('index-thumbnail', 120, 75); // for front page thumbnails
	add_image_size('single-post-thumbnail', 300, 180); // a different thumbnail size on single post pages
}

Now, you’ve done all the hard work and can be used very simply like this:

	<?php the_post_thumbnail('index-thumbnail'); ?>

Here, you have the most control over what’s going on.

I suspect there may be one or two refinements in the pipeline, but these methods have made it much easier to handle thumbnails in themes – not least you won’t have to show users how to add custom fields manually. Good effort….

By default, WordPress loads the version of jQuery that comes with the package. But there is an alternative way of doing it and that’s to use the AJAX Libraries API at Google Code – use their bandwidth, why not…

A few lines added to your functions.php in the theme you’re building and you’re ready to go.

wp_register_script() – the useful point is that you can use this function to access scripts hosted elsewhere…

Just add this code to your functions.php file:

add_action('template_redirect', 'js_head_load');

function js_head_load(){

if(is_admin()) return;

wp_deregister_script('jquery');
wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js');
wp_enqueue_script('jquery');
// and then any other scripts to register and queue...
}

Notice the first line of the function ensures that the jQuery isn’t loaded on WP admin pages - if a script isn’t needed, don’t load it on the page – and in this case jQuery in noConflict mode can cause the admin rich text editor and the widget drag and drop interface to go awry..

The advantages:-
You’ll be able to update the version your site is using quickly and easily, probably a good thing.

Google Code tends to have a policy of only including versions demonstrated to be stable, jQuery 1.2.4 and 1.2.5 didn’t make the grade

The user may already have it cached in their browser via some previously visited site instead of downloading from a location on your site (and if enough sites do it, the chances are that much greater that they will have a copy in the cache).

Not just jQuery – check out jQuery UI
http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js
And MooTools, which seems seriously under-used in conjunction with WordPress
http://ajax.googleapis.com/ajax/libs/mootools/1.2.4/mootools-yui-compressed.js

Always grab the minified version.

And lastly, one disadvantage:- googleapis.com does go down very occasionally – but then again a site ought to function, more or less, without javaScript.