This tutorial will help you add the following features in your Genesis child theme.
#1 – Display Page Excerpts Below Entry Title
#2 – Display Post Meta Above Entry Title
#3 – Display Your Featured Image as Hero Image
#4 – Overlay Entry Title, Excerpts, Post Meta on Hero Image
Note: Before we start, head over to the images folder located inside your active child theme and add a fallback featured image with the following name: post-image.jpg
Add This Snippet to Your Functions File
https://gist.github.com/topleague/ff4905a975643f5a72773020b16db6ac
Note: If you want to use different color on your hero image, you need to change the value inside linear-gradient. For example, you can try out the following value: linear-gradient(rgba(0,0,0,.5), rgba(0,0,0,.9)) if you want to use a darker shade. However, you need to apply a contrasting color on your entry title, excerpts, and post meta. Check out this tutorial on linear-gradient if you want more customization.
Here’s How to Style It
https://gist.github.com/topleague/26b24ba731962b7172d5c67bc959355c
Note: You might want to tweak the CSS above depending on your needs.
That’s it. Let me know if you have any questions.
Comments
3 responses to “How to Overlay Entry Title and Excerpts on Featured Image in Genesis”
The page excerpts don’t work; can’t see where to input the excerpt on the page
It worked, but partielly
The post title do not align center, the excerpt neither
The post information above title do not displat.
So the tutorial is not really teaching the complete thing
Hope you could review and adjust the code for that
This works for me. THANKS! Some minor CSS edits will fix up the font size, placement, etc. One thing others may be having issues with is that && the_excerpt() in the initial if statement prevents the whole thing from rendering if there ISN’T an excerpt.