Display Post Tags On Image Hover

This code enables you to overlay tags on image hover like this example :

You can choose the tags by tag id and swap out the default array of tag i.d’s on line 42 of the image-hover-effect.php file in the download folder.

This solution pulls a image from your images folder however it can also be used with the featured image. To do this, replace the following line of PHP code located on line 58 of image-hover-effect.php from this :

$image = sprintf( '%s/img.png', get_stylesheet_directory_uri() );

To this :

$image = genesis_get_image( array(
	'format'  => 'url',
	'size'    => 'large',
	'context' => '',
	'attr'    => array ( 'alt' => the_title_attribute( 'echo=0' ), 'class' => 'aligncenter' ),
) );

Includes CSS for media queries and is tested for mobile responsiveness as seen the following demo video.

Demo Video

Shows posts tags displaying on featured image hover and mobile responsiveness of the tags on smaller screens.

Here’s the download folder for registered users :