Cacher is the code snippet organizer for pro developers

// Step 4
// Add the following in child theme’s style.css:
/* Masonry Grid on Category Archives
--------------------------------------------- */

/* horizontal gap */
.gutter-sizer {
	width: 2%;
}

.grid-sizer,
.masonry-page .content .entry {
	/* Width of each column in % = (100 - (2 × horizontal gap in %)) / number of columns */
	width: 32%; /* 3 columns */
	margin-bottom: 2%;
	padding: 0;
	/*overflow: hidden;*/
}

a.category-block {
	display: block;
	position: relative;
}

a.category-block img {
	-webkit-box-shadow: 0 2px 5px rgba(162, 152, 143, 0.5);
	-moz-box-shadow: 0 2px 5px rgba(162, 152, 143, 0.5);
	box-shadow: 0 2px 5px rgba(162, 152, 143, 0.5);
	vertical-align: top;

	-o-box-shadow: 0 2px 5px rgba(162, 152, 143, 0.5);
}

a.category-block .overlay {
	position: absolute;
	z-index: 3;
	top: 50%;
	left: 50%;
	width: 100%;
	padding: 30px;
	opacity: 0;
	color: #fff;
	line-height: 1.3;
	text-align: center;
	-webkit-transition: opacity 0.15s ease-in-out;
	-moz-transition: opacity 0.15s ease-in-out;
	-ms-transition: opacity 0.15s ease-in-out;
	-o-transition: opacity 0.15s ease-in-out;
	transition: opacity 0.15s ease-in-out;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);

	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
}

a.category-block:after {
	display: block;
	position: absolute;
	z-index: 1;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	opacity: 0;
	background: rgba(0,0,0,0.6);
	content: "";

	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
}

a.category-block:hover:after,
a.category-block:hover .overlay {
	opacity: 1;

	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=1);
}

.overlay .entry-title {
	margin-bottom: 20px;
	color: #fff;
	font-size: 28px;
}

.more-link {
	margin-top: 10px;
	margin-bottom: 0;
	font-style: italic;
}

@media only screen and (max-width: 1200px) {

	.grid-sizer,
	.masonry-page .content .entry {
		width: 48%;
	}

}

@media only screen and (max-width: 1024px) {

	a.category-block .overlay {
		position: static;
		opacity: 1;
		color: #333;
		-webkit-transform: none;
		-moz-transform: none;
		-ms-transform: none;
		-o-transform: none;
		transform: none;

		filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
	}

	.overlay .entry-title {
		color: #333;
	}

	a.category-block:after {
		display: none;
	}

}

@media only screen and (max-width: 768px) {

	.grid-sizer,
	.masonry-page .content .entry {
		width: 46%;
	}

	.gutter-sizer {
		width: 4%;
	}

}

@media only screen and (max-width: 500px) {

	.grid-sizer,
	.masonry-page .content .entry {
		width: 100%;
	}

	.gutter-sizer {
		width: 0;
	}

}

// Step 3
// Create a file named category.php in the child theme directory having the following:

<?php

// Force full width content
add_filter( 'genesis_pre_get_option_site_layout', '__genesis_return_full_width_content' );

// Add custom body class to the head
add_filter( 'body_class', 'sk_body_class_masonry' );
function sk_body_class_masonry( $classes ) {
	$classes[] = 'masonry-page';
	return $classes;
}

// Load and initialize Masonry
add_action( 'wp_enqueue_scripts', 'sk_enqueue_masonry' );
function sk_enqueue_masonry() {
	wp_enqueue_script( 'masonry-init', get_stylesheet_directory_uri() . '/js/masonry-init.js' , array( 'jquery', 'masonry' ), '1.0', true );
}

// Reposition breadcrumbs
remove_action( 'genesis_before_loop', 'genesis_do_breadcrumbs' );
add_action( 'genesis_before_content', 'genesis_do_breadcrumbs' );

// Reposition custom headline and / or description
remove_action( 'genesis_before_loop', 'genesis_do_taxonomy_title_description', 15 );
add_action( 'genesis_before_content', 'genesis_do_taxonomy_title_description', 15 );

// Remove entry header
remove_action( 'genesis_entry_header', 'genesis_entry_header_markup_open', 5 );
remove_action( 'genesis_entry_header', 'genesis_do_post_title' );
remove_action( 'genesis_entry_header', 'genesis_post_info', 12 );
remove_action( 'genesis_entry_header', 'genesis_entry_header_markup_close', 15 );

// Remove the post image
remove_action( 'genesis_entry_content', 'genesis_do_post_image', 8 );

// Remove the post content
remove_action( 'genesis_entry_content', 'genesis_do_post_content' );

// Add custom content
add_action( 'genesis_entry_content', 'sk_do_post_content' );
function sk_do_post_content() {
	// get the raw title
	$title = apply_filters( 'genesis_post_title_text', get_the_title() ); ?>

	<a href="<?php echo get_permalink(); ?>" class="category-block">
		<!-- Featured image -->
		<?php
			if ( $image = genesis_get_image( 'format=url&size=category-archive-thumb' ) ) {
			printf( '<img src="%s" alt="%s" />', $image, the_title_attribute( 'echo=0' ) );
		}
		?>

		<!-- Title and Excerpt Overlay -->
		<div class="overlay">
			<?php
				echo '<h1 class="entry-title">' . $title . '</h1>';
				echo '<div class="excerpt">' . get_the_excerpt() . '</div>';
				echo '<p class="more-link">More &raquo;</p>';
			?>
		</div>
	</a>
<?php }

// Remove entry footer
remove_action( 'genesis_entry_footer', 'genesis_entry_footer_markup_open', 5 );
remove_action( 'genesis_entry_footer', 'genesis_entry_footer_markup_close', 15 );
remove_action( 'genesis_entry_footer', 'genesis_post_meta' );

// Remove post content navigation (for multi-page posts)
remove_action( 'genesis_entry_content', 'genesis_do_post_content_nav', 12 );

// Add grid sizer and gutter sizer divs for responsive masonry
add_action( 'genesis_loop', 'sk_add_masonry_grid_sizer', 7 );
function sk_add_masonry_grid_sizer() {
	echo '<div class="grid-sizer"></div><div class="gutter-sizer"></div>';
}

// Modify the length of post excerpts
add_filter( 'excerpt_length', 'sp_excerpt_length' );
function sp_excerpt_length( $length ) {
	return 20; // pull first 20 words
}

// Replace the normal "[...]"" with an empty string
function new_excerpt_more( $more ) {
	return '';
}
add_filter( 'excerpt_more', 'new_excerpt_more' );

// Reposition Archive Pagination
// Moves .archive-pagination from under main.content to adjacent to it.
remove_action( 'genesis_after_endwhile', 'genesis_posts_nav' );
add_action( 'genesis_after_content', 'genesis_posts_nav' );

genesis();

// Step 2
// Create a file named say, masonry-init.js in child theme’s js directory (create, if not existing) having the following code:

jQuery(function($){

	var $container = $( ".content" );

	$container.imagesLoaded(function(){
		$container.masonry({
			// use outer width of grid-sizer for columnWidth
			columnWidth: '.grid-sizer',

			gutter: '.gutter-sizer',

			itemSelector: ".entry",

			percentPosition: true,
		});
	});

});

// In this tutorial I share how Masonry, which comes shipped with WordPress can be activated and used on Category archive pages in Genesis.

// We are going to display the featured images of Posts in the grid and set Post’s title and excerpt to appear when hovering on the images.

// While the tutorial has been written for Genesis Sample child theme it should work with minor adjustments in any Genesis child theme.

// Step 1
// Add the following in child theme’s functions.php:
// Register a custom image size for image thumbs on Category Archives
add_image_size( 'category-archive-thumb', 500, 0, true );