i have written a plugin for the elgg social networking platform which supports sharing links to other social networks.
mostly this is ok.
i am noticing though that facebook often shows incorrect images for the video thumbnails and other sites, such as google+ are ok.
the url i am passing in to the sharer page is correct and when i use the facebook debugging tool, i see the correct image - e.g. https://developers.facebook.com/tools/debug/og/object?q=https%3A%2F%2Fwww.infiniteeureka.com%2Fvideos%2Fwatch%2F6980%2Fwater-as-primary-healing-agent-dis-ease-is-commonly-due-to-dehydration
as an example - this is the url that the plugin currently outputs for facebook, when sharing a video on my site:
https://www.facebook.com/sharer/sharer.php?s=100&p[title]=water+as+primary+healing+agent+-+dis-ease+is+commonly+due+to+dehydration&p[summary]=description&p[url]=https://www.infiniteeureka.com/videos/watch/6980/water-as-primary-healing-agent-dis-ease-is-commonly-due-to-dehydration&p[images][0]=https%3A%2F%2Fwww.infiniteeureka.com%2Fmod%2Fvideolist%2Fthumbnail.php%3Fjoindate%3D1293022025%26guid%3D6980%26owner_guid%3D2%26size%3Dlarge
when i share this to facebook, i see a thumbnail for another video which i shared days earlier, which has a different url. (edit: i now notice that i can choose from 3 images in facebook and one of them is the correct one - so facebook is building an array of 2 incorrect images in some way and is defaulting to an incorrect one.)
anyone know?
I run into this problem often as well. Try to make your image around 1080px # 1080px and see if that helps. The other options is to try and lazy load all the other images so facebook doesn't pick them up as I presume the thumbnail you are referring to is on the page?
Related
I've seen this is a common issue here on stack but it seems that the answer is always dependent on the specific scenario. I'm looking for a fellow coder to give me that "AHA" moment.
Problem: Ads posted to my website do not show the og:image content when shared to facebook until the ad is shared at least 4 times
I have thought about/ tried the following things
Checking the image size to make sure it's not large (128kb) is the norm. I compress all uploads.
Giving the ad some time to marinate before sharing (perhaps the fb crawler takes a while to cache the page)
I tried using the debug crawler tool on fb to see if I could reproduce the problem and I indeed could.
I tried sharing the ad to my own page regardless of the missing image to see if the image showed up on my wall. It did not.
The image will not show up on ANY shares until someone has clicked on the share icon on an ad at least 4 times. It seems to me like it might be some latency issue on facebook's part.
What could cause og:image to only show on subsequent share clicks?
Edit
Here's a test ad.
https://www.jdmxchange.com/Classifieds/Details/6ae72690-14d8-4bab-b039-3a2d79923794
Reading https://developers.facebook.com/docs/sharing/best-practices I found this, which might be just what you're looking for:
Use og:image:width and og:image:height Open Graph tags
Using these tags will specify the image to the crawler so that it can render it immediately without having to asynchronously.
This means, if you set the width and height of your og:image with tags, the image will show straight away.
UPDATE
Actually debugging your URL shows like this URL is redirecting to another page, and then another. Which makes me suspect the Facebook crawler is not able to access the actual OG meta tags you're using.
As a random test, I would add OG metatags to that last URL and see if Facebook uses them. But the actual solution would be to use URLs which are actually reachable to FB (no credentials necessary).
I am developing a website ( https://last-mail.org ) and am trying to hook it up to Facebook's Open Graph API to have nice information and an image show when people share it on Facebook.
However, Facebook keeps complaining that something is wrong with my image:
https://developers.facebook.com/tools/debug/og/object?q=last-mail.org
telling me that Provided og:image could not be downloaded or is not big enough. Please use an image that's at least 200x200px and is accessible from Facebook. Image 'https://last-mail.org/images/forgetmenotlogo5.png' will be used instead.
I know:
The image is 1200px x 900px
I've tried both .jpg and .png formats
I've tried hosting it on the https:// (private_html) part of the site, as well as on the http:// (public_html) part of the site
It does show up in the previews on the OpenGraph debugger tool page.
Browsers have no problem with displaying the image.
Why is this image rejected? How can I fix this?
How does Facebook choose a preview image when the og:image tag is invalid? A friend and I were curious why a Facebook preview image didn't show up in the article — when we ran the URL through the Facebook debugger, it provided the following information.
Provided og:image could not be downloaded or is not big enough. Please use an image that's at least 200x200px and is accessible from Facebook. Image 'http://lostoregon.files.wordpress.com/2014/06/foodcarts.jpeg' will be used instead
Tangent: Running the debugger once appears to clear Facebook's cache, and on the next run Facebook grabbed the correct (since fixed?) image.
The one part of this I don't understand is: How did Facebook chose the http://lostoregon.files.wordpress.com/2014/06/foodcarts.jpeg image to use instead? When I look at the original page, foodcarts.jpeg isn't shown anywhere, which means either
Facebook has some secret sause for chosing from images it's seen before
Facebook picked an image that was on the page at the time, but is no longer there
Something else I'm not considering
Is this default image picking defined, deterministic behavior? If so, how does it work?
the error you describe is common enough, and the image may be all right, but Facebook probably has issues downloading it (it's too big). What happens when the image isn't good is that the get a cached representation of you page, and use the image you provided back then. If Facebook crawls many urls, and there's no image on your site, or there's no cached image, the system will pick the one you use more frequently (on all pages). At least, that's what I have seen.
I am trying to get some viral marketing with my page by alowing people to share a product with the product's image. This is a normal usecase (cliche even) however the image source is Adobe's Scene7. I have used the debugger tool facebook provides but the best they can tell me is that "The image referenced by the url of og:image tag could not be downloaded." I understand that Scene7 urls are very complex and there is a reasonable chance that this is what facebook is choking on but is there anyway around this limitation?
I cant provide an actual url (trade secrets, NDA, etc...) but the urls we are dealing with resemble http://s7d4.scene7.com/ir/render/company/product?fmt=png&resmode=sharp2&wid=350&obj=scr&show&obj=cc&decal&src=is{company/style?$text1=H&$name1=namelong&$color1=Blue}&res=150&show
If the URL isn't publicly available (ie: I open a freshly installed browser and am able to see your link) - our scraper won't be able to see that image either. I don't think there's any work around, given the details you shared, but if a thumbnail is ok from a legal point of view (a thumbnail would end up on Facebook either way), you could use public URLs for thumbnails of the images of your products.
It turns out the problem is that there is some automatic encoding occurring with the url that is not working with scene 7.
I have created a company blog and have begun implementing various social sharing plugins, had a look at integrating with OG and now Facebook won't pull any images when the page is shared.
The debugger tool says that it can find a suitable image (the featured image for each post) and when I share the same link to LinkedIn the images pull fine.
I can't work out for the life of me what might be wrong, again it's not that Facebook isn't pulling the right image, it's not pulling ANY.
Does anyone have experience with this/know what might be wrong?
Change your og:url value to http://www.chapman-freeborn.com/en/blog/ ( add the trailing / )
Also fill your og:image value so facebook will get that image...
Handy tool for debug : http://developers.facebook.com/tools/debug/og/object?q=www.chapman-freeborn.com%2Fen%2Fblog%2F
Docs: http://developers.facebook.com/docs/opengraphprotocol/
Cheers!