Can't fix: 'og:image' property should be explicitly provided, even if a value can be inferred from other tags
HtmlFacebookWebVeloHtml Problem Overview
I have a website that triggers a warning when clicked through a link shared on facebook. The warning says: "Possible problem with this link We have detected that this link: http://www.sjap.online/ may be malicious. To keep your account and device secure, only follow links you trust."
I ran the facebook debug tool and I get the following error message:
Inferred Property
The 'og:image' property should be explicitly provided, even if a value can be inferred from other tags.
Inferred Property
The 'og:image' property should be explicitly provided, even if a value can be inferred from other tags.
I googled this issue and I understand it is caused by some lack of meta information in the site header, but my site's code has the following in the header:
<meta http-equiv="etag" content="2efdc27c8967f14e2c829e601f7a1228"/>
<meta property="og:title" content="South Jersey Aerial Photograpahy"/>
<meta property="og:type" content="website"/>
<meta property="og:url" content="http://www.sjap.online/"/>
<meta property="og:image" content="https://static.wixstatic.com/media/56a444_9273e80a60684dc8b38e56025059f356%7Emv2_d_3200_1800_s_2.png"/>
<meta property="og:site_name" content="South Jersey Aerial Photograpahy"/>
<meta property="og:description" content="South Jersey Aerial Photography is South Jersey's premier aerial photography and aerial videography company. Fully licensed and insured. Contact us today!"/>
<meta name="SKYPE_TOOLBAR" content="SKYPE_TOOLBAR_PARSER_COMPATIBLE"/>
I have no idea how to fix this error message. The property metatag is clearly there.
Html Solutions
Solution 1 - Html
In short, you should re-fetch your website information using this tool: https://developers.facebook.com/tools/debug/
Paste your URL and press Debug. Then either do Fetch, or press Scrape Again. This will refresh Facebook cache, and your html-page will be reloaded.
Some additional info: https://stackoverflow.com/a/44453472/4899346
Solution 2 - Html
Following the already mentioned link to the Facebook object debugger, make sure that your og tags are written RIGHT AFTER the opening <head> tag.
Not sure why this happens but I used to run into the exact same issue until I moved them right after it and then clicked once again on "Fetch new scrape information".
Hope this helps!
Solution 3 - Html
Ran into the same issue today. It would appear that it's a bug on Facebook's end.
Just by refreshing the Sharing Debugger will show me different error messages after each reload, including "Image Too Big", which clearly was not the case, and "Meta Tags In Body" which also was not correct.
As long as the correct image shows up in the Link Preview, I think you're good to go.
Solution 4 - Html
Check for og:url tag and see whether the url is correct or not. In my case the url was not correct and so it was causing this type of error.
Solution 5 - Html
Had same issue today
> 'og:image' property should be explicitly provided, even if a value can > be inferred from other tags
somehow my linter replaced "(quotation mark) to ”(right double quotation mark), therefore https://developers.facebook.com/tools/debug/sharing/ was showing issue,
cause of that, these meta properties were not visible to fb-bot. After this correction it works fine
Solution 6 - Html
If you're using a plugin like W3 Total Cache, Just purge your cache and go back to Facebook object debugger page mentioned by @Alex C and then click on Fetch new scrape information.
This solved the issue for me
Solution 7 - Html
Even if you have a proper OG tag on a page, can Facebook still ignored og:image value.
On my Magento 2 website, I use Magento 2 Facebook Open Graph by Magefan and had this issue too even all OG tags look good :-(
After I contacted them (magefan), they fixed the issue and released the module update v2.0.12
It turned out that Facebook only looks for og:image in the first 50Kbs of the page source. So if you are using inline CSS, or some JS in the the og:image will not be seen by Facebook. That was the reason in my case.
The solution is to put OG tags as high as possible in the node.
Solution 8 - Html
I had og:url content as http://... when my site always redirected to https://.... Updating this fixed the issue for me.
Solution 9 - Html
`<meta property="og:image" content="https://static.wixstatic.com/media/56a444_9273e80a60684dc8b38e56025059f356%7Emv2_d_3200_1800_s_2.png"/>`
<meta property="og:image:width" content="2500"/>
<meta property="og:image:height" content="1330"/>
1200 pixels x 627 pixels The most frequently recommended resolution for an OG image is 1200 pixels x 627 pixels (1.91/1 ratio). At this size, your thumbnail will be big and stand out from the crowd. Just don't exceed the 5MB size limit.
Double check your img file size.
Solution 10 - Html
Added the
<meta property="og:image:secure_url" content="https://abc/image.jpg" />
in order for the facebook debug to actually show my issue that the image was not 200x200. Corrected that and had to completely refresh the debug to resolve.
Solution 11 - Html
there is a code generator web site, copied and past your website URL, they will create for you your tag, just copied and paste it into your head :
https://www.opengraph.xyz/url/https%3A%2F%2Fbrodservices.com%2F/
Solution 12 - Html
I have had success by using https://developers.facebook.com/tools/debug/sharing/batch/ to invalidate the FB cache, then using https://developers.facebook.com/tools/debug/ to refresh it.
This seems to help if a page/post has been previously shared, say, and then an og image or other og element was added.