[Resolved] Add HTML on the right side of the featured image

Home Forums Support Add HTML on the right side of the featured image

  • This topic has 5 replies, 3 voices, and was last updated 1 year ago by David.
Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
  • #1210120

    Hi support team,

    Is it possible to add HTML (via a hook or anything) to the right side of a blog posts featured image?
    Below is an example of what I’m trying to achieve.

    Container is 1000px wide. Featured image is 600px wide and aligned to the left, above the post title. Now the added HTML would be 400px wide to fill the gap.

    Hope this can be done πŸ™‚

    Lead Developer
    Lead Developer

    Hi there,

    Would this be on single posts or the archives? It’s likely possible with a filter.

    Let us know πŸ™‚


    Hi Tom,

    That would be on single posts.

    Would it be possible to show custom fields inside that html?

    My goal is to create a small (400×400 px) window next to the featured image with some ratings in it.

    Customer Support

    Hi there,

    so this should get you started:

    add_filter( 'generate_single_featured_image_html', 'featured_image_custom_columns',25,1 );
    function featured_image_custom_columns($image_html) {
        // Get the Custom Field
        $your_custom_field = get_post_meta( get_the_ID(), 'your_custom_field', true );
        // If no featured image return default HTML
        if( $image_html == '' ) {
            return $image_html;
        } else {
            // else return custom content
            $custom_feature = 
            '<div class="feature-grid">
                <div class="feature-item">' . $image_html . '</div>
                <div class="feature-item">' . $your_custom_field . '</div>
        return $custom_feature;

    Then a little CSS to create the columns:

    @media (min-width: 769px) {
    	.feature-grid {
    		display: flex;	

    Hi David,

    Working as intended.
    Top notch support as always. many thanks !

    Have a good day and stay safe.

    Customer Support

    Awesome – glad to be of help πŸ™‚

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.