Archived topic
Featured Image Badge
5 replies · Started by Nikolas on March 30, 2021
Hi,
Is it possible to have the image caption posted inside the featured image container, with a "badge" -style like this?
https://pasteboard.co/JV0hPzQ.jpg
We have a lot of featured images where the photographer has to be mentioned.
Hi there,
first add this PHP Snippet:
add_action( 'post_thumbnail_html', 'db_auto_single_featured_description', 10 );
function db_auto_single_featured_description( $html ) {
$get_description = get_post(get_post_thumbnail_id())->post_excerpt;
if ( is_single() && !empty($get_description) ){
$html .= '<div class="wp-caption">'. $get_description . '</div>';
}
return $html;
}
Adding PHP: https://docs.generatepress.com/article/adding-php/
Then add this CSS:
.featured-image {
position: relative;
}
.featured-image .wp-caption {
position: absolute;
right: 20px;
bottom: 20px;
line-height: 1.2em;
padding: 5px;
background-color: #000;
color: #fff;
}
That's perfect!!
The only problem now is that if there is no caption added, you can still see a small black box.
Is it possible to hide the element if no caption is added?
Updated the PHP Snippet here:
https://generatepress.com/forums/topic/featured-image-badge/#post-1715146
That should fix that
That's perfect! Thank you so much. Really appreciate it :)
Glad to be of help.