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.

  • what's your site url? Also can you clarify what do you mean by custom field for posting image ?
    – bravokeyl
    Apr 23 '16 at 17:36
  • 9tanks.com , custom field and featured image works same but featured image show when share on facebook but some gifs are white image on share to facebook and that it's annoying i.imgur.com/nNDGuuj.png
    – I.Alex
    Apr 23 '16 at 17:49

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

enter image description here

  • I wish be that but no.. if you download that image into your pc : 9tanks.com/wp-content/uploads/2016/04/… you will see has: 4.57 MB ...
    – I.Alex
    Apr 23 '16 at 18:14
  • Yes, Alex , you are correct, i see the same but why open graph is behaving like that.I have to check that.
    – bravokeyl
    Apr 23 '16 at 18:15
  • look : this gif has no problem but it's 800 kb : developers.facebook.com/tools/debug/og/object If i can manage to get thumbnail from attachament i can make thumbnail to go into featured image and original gif to go into custom field, I try so many times and can't make it work and sharing images on facebook are important.
    – I.Alex
    Apr 23 '16 at 18:19
  • check this same issue with open graph stackoverflow.com/q/36608780/2007486
    – bravokeyl
    Apr 23 '16 at 18:33
  • bravokeyl , on that post it's nothing to help me but thanks. If you look on website i upload more posts with image size title and what I can see if a gif has I think over 3mb will be a white image on facebook share. Why happens that when facebook say 8 mb ? I don't understand..tired of this problem
    – I.Alex
    Apr 23 '16 at 19:15

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.

        global $post;
        $src = wp_get_attachment_image_src( get_post_thumbnail_id( $post -> ID ) , 'thumbnail' );
            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.

  • I tested into functions.php and it's works. Good luck.
    – I.Alex
    Apr 24 '16 at 19:30

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.

  • Thank you but plugins like auto featured image doens't work with my front end post (no plugin) I fixed with a code and some tweaks.
    – I.Alex
    Apr 24 '16 at 13:08

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.

enter image description here

*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.

  • I know but problem is: on my website you can post from front end and users don't have that options just title and image.
    – I.Alex
    Apr 24 '16 at 13:07
  • Ah, I see. What is the name of the plugin you use for front-end posting. Sorry I missed that before! Apr 24 '16 at 13:14
  • It is integrated in theme. I will add my code bellow for anyone who has same problems.
    – I.Alex
    Apr 24 '16 at 13:19
  • I thought that may be the case. Is it a custom addition or part of a premium theme? Aside from that I don't think the theme is the best way to address this after looking at it more. I've edited my answer to include what I've done to achieve what you're looking for in the past. Apr 24 '16 at 13:25
  • yes it's from a premium theme.
    – I.Alex
    Apr 24 '16 at 13:26

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.