So I was delighted to discover that Antony Ribot had named the ThemeLoom as Responsive Site of the Month in the magainze’s Gallery section (p69, March 2012 edition).

It’s nice to get some recognition now and then for your hard work.

In case you hadn’t noticed the design which the Loom is currently wearing is a child theme of our recently launched Pure theme – one of our responsive WordPress themes.

Both Xi and Pure work like a treat, and look great.
Anthony Ribbot, .Net Magazine March 2012

A Google + Button as an example

This is in response to Kam’s question who asked if this code could be used to add a Google plus button to the Pure theme. (It will also work in Xi and any future framework themes).

The key to this is that with our framework themes you can use the livingos_share_btns action hook to add aditional HTML below the existing buttons.

Use the livingos_share_btns Action Hook

To add our Google+ button we first add a function and action hook to the functions.php file of our child theme.

function livingos_google_plusone() {
		echo '<div class="plusone"><g:plusone size="tall" href="'.get_permalink().'"></g:plusone></div>';
	}

add_action('livingos_share_btns','livingos_google_plusone');

This simply adds the HTML placeholder for the button and adds the function to the action hook. You could add any other buttons here the same way. Even just a simple image based button could go here if you wanted.

Add External Javascript libraries in the usual way

The Google+ button requires some javasrcipt too, which can be loaded into the theme using the standard WordPress wp_enqueue_script method. This code should also be placed in your functions.php file.

function livingos_google_plusone_script() {
	wp_enqueue_script('google-plusone', 'https://apis.google.com/js/plusone.js', array(), null);
}

add_action ('wp_enqueue_scripts','livingos_google_plusone_script');

That’s it you should now have something that looks like this sitting at the bottom of each post.

What if you wanted to replace all existing buttons?

To replace the buttons entirely you could also just redefine the function livingos_share_btns() in your child theme instead.

So for example if you wanted to dump twitter and facebook and just add the Google+ button you could just add this instead of the action hook above.

function livingos_share_btns(){
	echo '<div class="share-btns">';
	echo '<div class="plusone"><g:plusone size="tall" href="'.get_permalink().'"></g:plusone></div>';
	echo '<div>';
}

This simply overrides the existing code for display buttons and replaces it with our Google+ button. Like so..

Easy…?

Of course having done all this it is highly likely that we will just add this to the core code anyway, since Google+ buttons are all the rage. But at least you know now how to add any future buttons that may be needed.

And since you are looking at child of the Pure theme, you can now plusone this post below!!

Adding Feature Images to Posts and Pages in the new Mu

To set the image used by the theme for each post or page you must set a feature image in the WordPress post/page editor.

Existing Users

We recognise that there are lots of Mu users out there who have been using the theme for maybe a couple of years. Don’t panic – we have left support for the script in the theme.

All you need to do to reinstate timthumb and have it pick up all your post images again is to download the latest copy of the timthumb script from the official source here and drop the timthumb.php file into the themes \thumbs folder.

And all you need to do to ditch timthumb is delete it! The theme will then revert to WordPress native thumbs when timthumb is not present.

Switching Your Existing site to WordPress thumbs

So if your are upgrading from a previous version, you must delete the timthumb script or even the whole thumbs folder in order to benefit from the WordPress images. But you will also need to go back through all your old posts and set a feature image for each.

We hope this doesn’t inconvenience existing users too much, but timthumb has in the past represented a security vulnerability and while the latest version overcomes these issues, we have long recognised that the script offers few advantages over the native thumbnailing introduced into later versions of WordPress.

Our more recent themes do not use timthumb at all.

What’s New?

The biggest difference that users will notice is the new theme options page, which is a result of forging in parts of our new theme framework into the Mu theme. There are also other goodies, borrowed from the framework that drives our more recent themes like Pure and Xi. You’ll find a new Event Management post type and our Twitter Widget for example.

The latest version also includes a few fixes such as improving compatibility with plugins like JetPack.

Upgrading from Older Versions

Find out more or just head for demo now.

Oh and it is the first theme we have published here that isn’t named with a Greek letter. We ran out of letters!

But one of the problems of creating thumbnails, and this is true of timthumb as well, is that if your different image sizes have different aspect ratios, then the crop that is generated doesn’t always look great.

Problems with WordPress Image Editor

The WordPress image editor allows you to create a crop of your orginal image, but it only changes the deafult WP images sizes (thumb, medium, large etc) and doesn’t touch the custom sizes that themes like Xi rely on. The “save all sizes” option does not change the custom sizes. It is a little confusing, but it is only when you regenerate your thumbnails using a plugin or individually in the Media section of the dashboard are your images resized/cropped.

WordPress Image Editor does NOT save Custom Sizes

This is clearly a limitation of the current release of WordPress and perhaps it will be improved.

Use the Post Thumbnail Editor Plugin

This limitation has not gone unnoticed. We have come across one awesome plugin that allows you to create indivudally cropped images for each image size in your theme.

The tool is accessible from inside the Media section of the dashboard or from inside the Insert Media dialog. Clicking thumbnails brings up an interface that lets you manage your thumb edits.

Post Thumbnail Editor

This works pretty well, but be warned that if you at a future point, regenerate your thumbs, you will loose the individual crops.

But for now this is a really useful tool, for those looking for perfect crops in their thumbs.

Download the plugin here.

And so we have released an update to the Xi theme, which has now been tested with BuddyPress 1.5. There are a few additional features with BP 1.5 that are now visible in Xi.

Get version 1.7 of XI from the downloads area.

Updated in this version:

• added BuddyPress login/logout in sidebar
• update for BuddyPress 1.5
• fixed three-fourths column not sizing correctly
• updated single image size to same aspect as slider