Masonry and WP post_class();

masonry-init.js

/**
 * #content references the outer container selector
 * .post references in the inner containers selectors
 */

jQuery(document).ready(function(){
	jQuery( '#content' ).masonry({
		itemSelector: '.post',
		columnWidth: 320
	});	
});

styles.css

.code,
.design {
	border: 1px solid #999;
	float: left;
}
.code {
	width: 300px;
	height: 300px;
}
.design {
	width: 300px;
	height: 600px;
}

wp-masonry-fun.php

<?php
/**
 * Plugin Name: Masonry Demo
 * Plugin Description: Trying out some masonry js stuff
 * Author: Drew Jaynes
 * Version: 0.1
 * License: GPLv2
 */

class Masonry_Bits {

	/**
	 * Init
	 */
	function __construct() {
		add_filter( 'post_class', array( $this, 'set_some_post_classes' ) );
		add_action( 'wp_enqueue_scripts', array( $this, 'enqueue_masonry' ) );
	}

	/**
	 * Assign post classes
	 *
	 * Assigns post classes based on a custom field with the 
	 * key of 'type' and values of either 'code' or 'design'
	 *
	 * @uses get_post_meta()
	 * @param array $classes Post classes array
	 * @return array $classes
	 */
	function set_some_post_classes( $classes ) {
		if ( get_post_meta( get_the_ID(), 'type', true ) == 'code' )
			$classes[] = 'code';			
		elseif ( get_post_meta( get_the_ID(), 'type', true ) == 'design' )
			$classes[] = 'design';						

		return $classes;
	}

	/**
	 * Enqueue scripts
	 *
	 * @uses wp_register_script()
	 * @uses wp_enqueue_script()
	 */
	function enqueue_masonry() {
		// Masonry script
		// You can also host and enqueue it locally
		wp_register_script( 'masonry', 'http://cdnjs.cloudflare.com/ajax/libs/masonry/2.1.05/jquery.masonry.min.js', 'jquery', '2.1.05' );
		wp_enqueue_script( 'masonry' );
		
		// Our Masonry init
		wp_register_script( 'masonry-init', plugins_url( 'js/masonry-init.js', __FILE__ ), 'jquery', '1.0' );
		wp_enqueue_script( 'masonry-init' );
	}
}

new Masonry_Bits;

?>