CODEWITHSUNDEEP
facebooksharepreview
user1925382
user1925382

Reputation: 41

facebook share url show preview details only on second time click

I have a share button on my site (I use AddThis tool) and Open Graph meta tags with article as a type:

meta property="fb:app_id" content="No"
meta property="og:image" content="LogoUrl"
meta property="og:image:type"       content="image/jpg"
meta property="og:image:width"      content="200"
meta property="og:image:height"     content="500"
meta property="og:url" content="LogoUrl"
meta property="og:title" content="title"
meta property="og:type" content="article"

My url looks like that: [mySite]/9095210/1811, so for every different url, I insert different thumbnail, title and description.

My images are from an absolute url.

The problem: I see the details in facebook share preview window, only after the second time I click on the share button. On the first time the facebook share window appears, but without any details. If I continue and share the link in the first time (as in the times after) I see all the details in my facebook. So, the problem in only in the facebook share preview window.

Anyone meet this problem already, and maybe can help?

Upvotes: 3

Views: 2349

Answers (2)

Jeffrey Levy
Jeffrey Levy

Reputation: 513

A similar issue is explained in the "facebook for developers" in sharing , best practices

Pre-caching images. When content is shared for the first time, the Facebook crawler will scrape and cache the metadata from the URL shared. The crawler has to see an image at least once before it can be rendered. This means that the first person who shares a piece of content won't see a rendered image. There are two ways to avoid this and have images render on the first Like or Share action:

  1. Pre-cache the image with the Sharing Debugger Run the URL through the URL debugger to pre-fetch metadata for the page. You should also do this if you update the image for a piece of content.

  2. Use og:image:width and og:image:height Open Graph tags Using these tags will specify the image dimensions to the crawler so that it can render the image immediately without having to asynchronously download and process it.

The third way, which is the way we do it, is to put in the link, and facebook responds with "fetching a preview" , close it and re-post. This works very well. I hope that I understood your problem correctly and that this helps you.

Upvotes: 0

Dániel Csorba
Dániel Csorba

Reputation: 11

I had the same problem, and the solution was the next:

You need to create an application in the facebook developer area: https://developers.facebook.com/apps

And need to put the application id to the the fb_init just like this:

js.src = "//connect.facebook.net/hu_HU/all.js#xfbml=1&appId=YOUR_APP_ID";

After providing the correct appliaction id, my problem has been solved.

Upvotes: 0

Related Questions