I also ran into the same problem. I created a child theme and I added the filter code to functions.php as you suggested and it shows up in the raw HTML but I still cannot click on the picture. If I remove the class figcaption, it will work but then the slide out text is below the image. I created a new class called divina-mobile and added it to the permalink so I could style it. Below the function is as far as I got with CSS. Any suggestions would be appreciated.
add_filter( 'post_thumbnail_html', 'my_post_image_html', 10, 3 );
function my_post_image_html( $html, $post_id, $post_image_id ) {
$html = '<a class="divina-mobile" href="' . get_permalink( $post_id ) . '" title="' . esc_attr( get_the_title( $post_id ) ) . '">' . $html . '</a>';
return $html;
}
.divina-mobile {
display: block;
height: 100%;
width: 100%;
}
.divina-mobile:hover {
border: solid white 1px;
}
Update: I just realized that links cannot be nested and that’s why it’s not working. Can you suggest a solution that avoids this problem?