In the members-only support forum, a user wanted to know how the title can be displayed on top of featured image below the header in Dynamik like this:
In this tutorial I show how Featured image (if present) for singular entries can be set as background for a hero section with the entry title appearing on a dark overlay near the bottom of image. If an entry does not have featured image set, it will continue to appear in the regular way.
Summary of steps:
- Create a new conditional that says "if this is a singular entry having a featured image".
- Add a custom hook box to hook a function having the code to check for the above conditional and if true, remove the title from its default location and add a hero section with background-image inline CSS property set to the entry's featured image.
- Add the needed CSS so the featured image is fills the hero section.
