I am trying to share my blog post on fb and it doesn't display the image defined under og metatags. I tried debugging using fb debugger but even that shows the image as blank?
You could reproduce hitting below url in fb debugger
http://niyando.com/web/using-angular-js-with-rails/
I also checked and matched my image size conventions as per open graph documentation. Is there anything I missed?
Thanks
Answering my own question.
I am hosting jekyll based blog on github pages. For some weird reason naked custom domains do not work very well with github pages when you want to share posts on facebook. The preview just appears as blank.
I fixed this by adding www before my domain under cname file on github. I also has to reference og:image with a url prefixed with www.
Found the solution under comments on this blog.
http://ramsesoriginal.info/2015/03/21/facebook-open-graph-github-pages/
Related
I have just created a github page and written a blog. I tried sharing with Disqus's share option to Facebook but it's not loading preview and also says following.
Even though I copy the link and directly paste it, it's not working. But if I do the same (copy the link and paste) in LinkedIn it preview is generated finely. What could be the problem? I'm using Flexible-Jekyll theme. You can find the link to flexible-jekyll theme here and here's a link to my github repo.
I think the problem is caused by this line of code from the source code of 'Car detection with YOLO':
<meta content="https://crazz-zaac.github.io/crazz-zaac.github.iohttps://crazz-zaac.github.io/car-detection-with-yolo/" property="og:url">
The URL is incorrect in the the og:url property, but it is working fine in Twitter because you have provided different og:url property for Twitter.
Change it to the correct URL and I hope it will work,
<meta content="https://crazz-zaac.github.io/car-detection-with-yolo/" property="og:url">
I have been having some issues with metatags on my website. Open graph validators all recognise that I have meta data available on each page however neither facebook, twitter or linkedin seem able to pick it up.
Twitter specifically says: WARN: No metatags found
I recently changed all of our web page names from:
www.website.com/blogs.html to
www.website.com/blogs
and since then it seems that twitter etc are no longer whitelisted (the reason I say that is because the twitter card validator no longer gives me the green box that says it is whitelisted).
Here is an example of one of the pages that isn't working:
http://cuttsyandcuttsy.com/blogs/Mar-2018/its-more-than-just-a-font
I should probably point out that there is also a .htaccess file sat on the website redirecting people from the old blog posts to the new versions of them (website redesigned).
I have no idea why it's not picking it up or how to fix it but any help on the matter would be appreciated.
I can also provide the code if you need it.
Starting yesterday evening I noticed sharing links to my Blogger blog on Facebook wasn’t working right: images failed to load, the meta description was missing, various other errors. (Sharing links from other sites worked fine, so this seemed to be Blogger-exclusive.) Running the permalink through the Facebook Debugger returned 4–5 errors that hadn’t been there for previous links I’d shared, and some of these errors have since disappeared on their own. I figured FB had messed with their scraping system and that it would be rectified soon.
Presently, link-sharing works better, but a couple issues remain that I can’t explain or find any solution to: 1) Facebook tries to redirect my .com blog to .pe, and 2) it claims the meta property article:author is incompatible with the og:type, which is article.
Quick reference links:
Sharing Debugger readout for a random blog post (they all return the same errors):
https://developers.facebook.com/tools/debug/sharing/?q=https%3A%2F%2Fpreliator2.blogspot.com%2F2017%2F08%2F17-Isnt-it-the-thought-that-counts-124.html
Open Graph Object Debugger readout:
https://developers.facebook.com/tools/debug/og/object/?q=https%3A%2F%2Fpreliator2.blogspot.com%2F2017%2F08%2F17-Isnt-it-the-thought-that-counts-124.html
Scraped URL readout:
https://developers.facebook.com/tools/debug/echo/?q=https%3A%2F%2Fpreliator2.blogspot.com%2F2017%2F08%2F17-Isnt-it-the-thought-that-counts-124.html
For the record, I did some minor meta tag editing the day before this problem began, yet I validated the page when I finished and received no errors at the time (except for the missing fb:app_id, which I ignore).
1) Facebook Debugger redirects to blogspot.pe
My blog is at preliator2.blogspot.com. Every URL in the site source uses .com. There’s a simple script in the header that redirects any country-specific URLs (blogspot.ca, blogspot.ru, etc.) to .com for reasons of consistency and compatibility.
This has never caused a problem with Facebook sharing. Yet now, the Sharing Debugger gives me this (note the .pe domain):
Fetched URL https://preliator2.blogspot.com/2017/08/17-Isnt-it-the-thought-that-counts-124.html
Canonical URL http://preliator2.blogspot.pe/2017/08/17-Isnt-it-the-thought-that-counts-124.html
Redirect Path Input URL → https://preliator2.blogspot.com/2017/08/17-Isnt-it-the-thought-that-counts-124.html
302 HTTP Redirect → https://preliator2.blogspot.pe/2017/08/17-Isnt-it-the-thought-that-counts-124.html
og:url Meta Tag → http://preliator2.blogspot.com/2017/08/17-Isnt-it-the-thought-that-counts-124.html
And this is the link preview:
Further, on the Object Debugger page, fetching new scrape information gives me this error:
URL Follow Failed: There was an error in fetching the object at URL 'http://preliator2.blogspot.pe/2017/08/17-Isnt-it-the-thought-that-counts-124.html', or one of the the URLs specified via a redirect or the 'og:url' property including one of http://preliator2.blogspot.com/2017/08/17-Isnt-it-the-thought-that-counts-124.html.
To find the object, these are the redirects we had to follow
original https://preliator2.blogspot.com/2017/08/17-Isnt-it-the-thought-that-counts-124.html
302 https://preliator2.blogspot.pe/2017/08/17-Isnt-it-the-thought-that-counts-124.html
og:url http://preliator2.blogspot.com/2017/08/17-Isnt-it-the-thought-that-counts-124.html
302 http://preliator2.blogspot.pe/2017/08/17-Isnt-it-the-thought-that-counts-124.html
og:url http://preliator2.blogspot.com/2017/08/17-Isnt-it-the-thought-that-counts-124.html
For some reason, the Facebook scraped URL shows the canonical and other blog links as blogspot.pe, yet in my blog’s actual source, all links are .com. I have no idea why Facebook sees/adds all those .pe domains. The blog isn’t based in Peru.
2) Says article:author isn’t supported by og:type (article)
I also receive the following error from the Sharing Debugger:
The following properties are specified on the webpage but NOT supported for the specified 'og:type': article:author
Yet here are the relevant tags as they appear in the scraped URL:
<meta content="{FB_profile_URL}" property="article:author">
<meta content="article" property="og:type">
Last I checked, article:author is perfectly compatible with og:type article. The meta tags are in the <head> section. I don’t know whether this error is related to the strange .pe redirect issue.
How do I stop that nonsensical redirect and get FB to play nice with author/og:type meta tags?
Update:
Problem’s still occurring. I’ve also done a couple tests, with the following results.
A) I tried sharing a link from another Blogger-hosted site, specifically the Official Blogger Blog (https://blogger.googleblog.com/2017/03/share-your-unique-style-with-new.html). Worked without a hitch. This indicates the problem is specific to my blog.
B) The problem started only a day ago; link sharing worked just fine before then. So I dug up a backup of my blog template from a week ago and applied it to the blog. I then tried sharing a link again and rescraping. No change – even though link sharing worked without any redirects or other issues with this exact template just days ago. (I’ve since reverted back to the newer template, since evidently it doesn’t change anything.)
I still want to think the problem is on Facebook’s end, but this has been going on for almost two days now. If anyone has any ideas, that’d be greatly appreciated.
The problem has since been resolved. Turns it out it was something wonky on Blogger’s end (I was told as much on the Facebook bug forum) and it went away just under a week after it first began. The Debugger errors have disappeared and the blog no longer redirects to .pe.
If anyone else has similar problems (as I’ve seen on the Blogger forums), all I can suggest is to wait and see if they go away after a week or so.
I'm linking my website through another site (for example my linkedin page) and for some reason it doesn't show any default image, instead it has the default blank image. Linking other sites, I get it to show correctly. I read somewhere that it has to do with not having my site prefixed with www. by default. Is that relevant?
Here is my linked in page: https://www.linkedin.com/in/stefmoreau
As you can see some websites show with images but the last 2 don't. They also happen to not redirect to their www. prefixed version when viewing them.
Linkedin uses the Open Graph Protocol to get images. AFAIK it's not related to the "www" part.
Take great care with linkedin: they cache what their bot retrieves, and there's NO refresh for it you can trigger.
Hence, I'd advise to first get it right using e.g. Facebook's OG implementation as they at least have a tool to let you refresh what the crawler fishes up.
Linkedin doc
Facebook doc
my question is about a weird cache issue with facebook open graph. My server provides an html document with the properly meta tags for facebook share utility.
Provided meta tags are: og:url, og:type, og:title, og:image, og:image, og:description, og:site_name, og:updated_time.
Now the facebook url debugger brings the correct data, all fields have the correct data, but when i lanch the popup, with the url containing the html mentioned above, the image is wrong, it shows me an old image or the site logo... i thinks it is a cache trouble, and i don´t know how to solve.
I have tried some solutions but are bad solutions, like adding a timestamp at the end of querystring. This is bad because it reset the shared count.
Thanks a lot!