I have wp site with pages displaying products in a grid format like a portfolio. My theme uses standard index.php page for the loop and a functions file to output the actual content depending on the type of post and settings. I would like to hover over the featured image in my portfolio grid layout to show another image that I have put in a custom field called "hover-thumb". I searched all over the net and below is what I have concluded is the best way but I cannot figure out why the hover image source is empty when I look at the outputted source code. The hover effect seems as though it would work if only the image would populate. I am not a programmer so this is very complicated for me. I hope someone out there could make this clear. I modified the code (in functions file) below by adding the php inside the et_overlay span tag below... (if you check site you will see the in the source code that the src="" is empty http://eyemajic.staging.wpengine.com/matte-finish/ thank you for any suggestions better yet, I would love to have this in my own functions file in my child theme but have no idea how I could just add my modifications or how much of the original code I would need to include in my function file.
<?php
$thumb = '';
$width = 'on' === $fullwidth ? 1080 : 400;
$width = (int) apply_filters( 'et_pb_portfolio_image_width', $width );
$height = 'on' === $fullwidth ? 9999 : 284;
$height = (int) apply_filters( 'et_pb_portfolio_image_height', $height );
$classtext = 'on' === $fullwidth ? 'et_pb_post_main_image' : '';
$titletext = get_the_title();
$thumbnail = get_thumbnail( $width, $height, $classtext, $titletext, $titletext, false, 'Blogimage' );
$thumb = $thumbnail["thumb"];
if ( '' !== $thumb ) : ?>
<a href="<?php the_permalink(); ?>">
<?php if ( 'on' !== $fullwidth ) : ?>
<span class="et_portfolio_image">
<?php endif; ?>
<?php print_thumbnail( $thumb, $thumbnail["use_timthumb"], $titletext, $width, $height ); ?>
<?php if ( 'on' !== $fullwidth ) : ?>
<span class="et_overlay"><?php $hover_image = get_post_meta($post->ID, 'hover-thumb', true); ?>
<img class="hover-img" src="<?php echo $hover_image; ?>" /> </span>
</span>
<?php endif; ?>
</a>