Add Text Overlay To Featured Image Hover On Single Posts

This code enables you to display text from various sources using different overlay effects when the featured image is hovered on single posts in Genesis.

By default, it displays the image caption and falls back to the image description otherwise displays the entry title title if no caption or description added which you can see in the following demo video.

Demo Video

Shows the image caption overlaying the featured image on single posts when added otherwise the image description displays. If none added, the single entry title displays on hover.

Tested using the Genesis Sample & Wellness Pro child themes by StudioPress.

Includes 2 code snippets, 1 for Wellness Pro which already includes code to add the featured image on single posts/pages & 1 for the Genesis Sample theme which doesn’t.

Based on this question from a member of the Genesis community :

Am using the Wellness Pro child theme on the genesis framework with the latest version of WordPress. Am wondering if there was any way to custom code the featured image so it displays a different custom caption for each featured image on the post page?

Code Installation

There’s 2 steps after you access the download folder for logged in users :

Step 1 : Copy 1 PHP code snippet from the functions.php file to the end of your child themes functions file.

Step 2 : Copy & paste the CSS from the style.css file to the end of your child themes style sheet and clear caching.

You can then add featured images to single posts and add a caption or description the the featured image attachment details input fields.

Register or login to access the download folder.

Related Tutorials

Join 5000+ Followers

Get The Latest Free & Premium Tutorials Delivered The Second They’re Published.