I'm working at Storify and we have an issue when we want to share some stories on Facebook.
We are using og meta tags to make sure the story is shareable in a nice way. Mainly, we use og:title, og:site_name, og:type, og:url, og:image and og:description.
For some stories, it works like a charm and it looks terrific, e.g. http://storify.com/elevour/smog-attacks-beijing-yet-again
But some stories, it doesn't work at all, e.g. http://storify.com/documentally/40-at-40
We use the same script for both, and OpenGraph.in can detect my og meta tags on every single story... http://www.opengraph.in/?url=http%3A%2F%2Fstorify.com%2Fdocumentally%2F40-at-40&format=html
Do you have an idea what it can be?
Is it a bug from Facebook?
Vinch, I'm getting quite inconsistent results when I run these links through the facebook debugger ( https://developers.facebook.com/tools/debug/og/object?q=http%3A%2F%2Fstorify.com%2Fdocumentally%2F40-at-40 ) it seems to have trouble parsing the urls. For the beijing link, it did successfully parse it the first time, but has returned an error on all subsequent tries, for the 40 link I get an error every time. Perhaps this has something to do with the way you're resolving urls on your server? When I run a user's url eg: http://storify.com/documentally/ through the debugger, it returns the generic og data from http://storify.com/ ...
The issue is with the facebook cache and solution is to refresh the facebook cache by going to the link. https://developers.facebook.com/tools/debug/og/object/
and pressing the button "Fetch New Scrape information".
Hope it helps
Related
I have a LAMP website which allows users to share a graph on Facebook. It was woking fine until May 1st but now whenever I try to share, I just get a grey box.
My site was using sharer.php to do the sharing and giving as the url a document which would generate a single graph, and in it's og:image and og:image:url tags I put a url which points to some code which generates an 800 x 400 png of the same graph. If I copy either url into a browser, they render exactly what I would expect, but if I post the same url to the Sharing Debugger tool, it gives me a blank image.
I have noticed that although clicking the Scrape Again button usually calls the url which renders the image as a png, every now and then it does not, but there is no indication as to why and the Scraped URL page shows exactly the page I would expect with the correct og:image tags.
I have tried changing from using sharer.php to the FB.ui 'share' method, but this has not fixed the issue.
I have also tried asking in the Facebook Developer Community but have had no response. I even tried to raise a bug with Facebook, but it won't let me.
This is driving me nuts. I just don't understand why it has suddenly stopped working. Have I missed something or has Facebook changed anything in the Sharer functionality? Is there any other way to debug this ?
Update: After a lot of tinkering I have found out that this only affects my account, and it affects anything I share on Facebook, not just things from my own site. Furthermore, it's only the preview of the shared page which is not working. What actually gets posted to Facebook is the correct image. I have tried multiple PC's and multiple browsers and it always fails even if I switch off all anti-virus/anti-malware/firewalls etc. Bizarrely, if I share from my phone, it works!
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).
Facebook seems to change things fast.. All existing questions I have seen are older than facebooks "big image" posts, that this question is (partially) related to.
I'm testing Facebook interaction by including meta tags in my page to add a YouTube player as og:video on a page on my site.
All OG tags validate and I can successfully post links and get the video embeded. The problem I get is that while both the Facebook OG Debug Tool and the post does understand the title and description of the page, the post seems to behave strangely when played compared to a youtube link.
Look at the differences here: http://imgur.com/a/kOvkk
I have tried all combinations and order of OG tags I can think of, but I cannot seem to get the same result from my page link as I get from the YouTube link. And since the Facebook Debugger Sees the exact same values, I can not see how they are interpreted so differently..?
Here is the OG Debugger Comparison: http://i.imgur.com/dqok8aG.png
Has anyone else experienced this, or is familiar with the inner workings of Facebook?
The pages used to test are these, although the one on my site might have changed when you read this.
Solved it! The behaviour is triggered by the size of the og-image, and even if I still cannot understand why the youtube link behaves differently with the exact same image url, I can workaround it by manually setting a smaller og:image.
Result: http://i.imgur.com/g5pIN2b.png
I am trying to share this url via facebook(change RANDOM_STRING with any random string because of facebook cache):
http://www.ikposta.com/blog/goster/72/test_RANDOM_STRING
at first try facebook will decide picture which is there is a men. Refresh facebook page and try again share with same url at this time picture will be changed and you will see keyboard image which is correct image.
og:image tag is always correct why this is happening ?
How can I prevent ?
Run your URL through the Facebook Object Debugger to make sure that your OG image tag is correctly being picked up by Facebook. This will also force a re-cache of the image.
I ran it through quickly and there were a couple errors that came up. Primarily missing URL and title OG tags. You'll want to have these to avoid circular redirects. See here: Debugged
I would personally remove that cache bust all together. It's confusing Facebook because it looks like a directory. If anything, use a query string.
Upon sharing a link on Facebook with og:image and og:video tags it will, under the right conditions, consistently display the wrong thumbnail image. Our clients are having this problem but unfortunately I cannot consistently replicate the conditions under which this issue occurs.
Go to the QVC UK Facebook page and look for video shares (example post). You'll see that the thumbnail for the video is the QVC logo when it should be the image given in the og:image tag. When putting the link through Facebook's debug tool the correct image is displayed with no content warnings or errors. This only seems to be happening when the URL is shared for the first time as subsequent shares will display the correct image. The image is present on our CDN before the URL is shared on Facebook. When I did manage to luckily replicate this issue; running the debugger before sharing on Facebook did not seem to solve the problem.
Am I missing something obvious, is there something wrong with my meta tags or could this be a potential facebook bug?
I've seen that multiple people are recording the same sort of problem on Facebook however only this bug has been left open (as of June 21st). In a related bug report Facebook mention that their crawlers don't only look at the image in the og tag but also look for other relevant images within the page.
Is it possible that it is seeing the QVC logo used so many times on the page that it decides to randomly overwrite the one specified?
Thanks
-- UPDATE
This only seems to be a problem when sharing to Facebook pages as opposed to a user's timeline. Changing the image URL seems to have temporarily fixed the problem. This looks like a Facebook bug