What can I do if I set a gif as featured image? no thumbnail when i share on facebook

Question

My website it's for sharing content with front end post and users can post images/gifs/youtube , if a user(or me) post a gif it's directly set it to featured image and when I try to share that post it shows me a white image.

Also I have custom field for posting image and I can set images to go directly in custom field for showing it on the site but if i don't set anything for featured image instead of a white image I will have nothing.

I need thumbnail(not original image that it's uploaded when you make the post) of attached image to go into featured image and I don't know how to do that.

This problem I have it only with gifs..

Any solutions? Thanks.

Answer 1

It's because those GIF images exceeds the max-size supported by Facebook open graph ( 8Mb ).

Check the debugger for Open Graph here

For instance for post vbnvnvb , debugger show this error

Answer 2

With this code in header.php and some tweaks I fix it and I disable social yoast and activating another plugin open graph which let me choose what tags I want.

<?php
        global $post;
        $src = wp_get_attachment_image_src( get_post_thumbnail_id( $post -> ID ) , 'thumbnail' );
        if(strlen($src[0])){
            echo '<meta property="og:image" content="'.$src[0].'"/>';
            echo '<meta property="og:image:width" content="200" />';
            echo '<meta property="og:image:height" content="200" />';
            echo '<link rel="image_src" href="'.$src[0].'" />';
        }
    ?>

For me it's enough to take just thumbnail :)

I didin't tested in functions.php but I will.

Answer 3

The way around this is pretty simple, however. You can just install a plugin that automatically sets the featured image from the first image in a post. Of course that means you will need to make the animated image the first image, but at least it’s a workaround.

There are a number of plugins that will let you automatically set your first image as the featured image. I tried two and the both worked: Autoset Featured Image and Automatic Featured Image Posts.

Something else I found was that I didn’t even need to download the gif. I could just insert it with the URL.

One last note: In order to try to get a little more wiggle room with the positioning of images, I did try inserting an animated gif first, publishing the post to get it featured, and then going back in and inserting another image on top of it. But both plugins I tried took the new first image and made it the featured image, which is what they should do, of course. But I thought I’d give it a try.

Answer 4

If you need to control the image that is used when shared to facebook, might I suggest doing the following within Yoast SEO:

1. Once the plugin is installed, you will have a Yoast SEO settings panel below your post and page editor.
2. On this panel there is a social tab. Within this tab you are given the ability to edit the image used when users share via Facebook and Twitter.

As an added bonus, you can control the title and description as well.

*EDIT 4-24

I have a portfolio site that uses animated gifs as featured images and I had to use the plugin Animated GIF Resize

Sometimes there is not a simple function that can be added unfortunately.

*EDIT - Tested and works when sharing link to posts with featured image from gif to Facebook.