Facebook will not parse the og:image the first time a page is shared on Facebook - The solution to this is to include the og:image:width and og:image:height in the metadata. By default K2 does not include these 2 open graph parameters.

see "Pre Caching Images" here developers.facebook.com/docs/sharing/best-practices

Here is the fix for K2

/public_html/components/com_k2/views/item/view.html.php
After line 589 - insert the folllowing :

list($width, $height) = getimagesize($image);
$document->setMetaData('og:image:width', $width, 'property');
$document->setMetaData('og:image:height', $height, 'property');

/public_html/components/com_k2/views/itemlist/view.html.php
After line 738 - insert the folllowing :

list($width, $height) = getimagesize($image);
$document->setMetaData('og:image:width', $width, 'property');
$document->setMetaData('og:image:height', $height, 'property');

Note: This will only work with J3.6 or latter where you can add 'property' attribute using setMetaData. If you don't add 'property, then setMetaData will add a "Meta name=" rather than a "Meta property=" to the document - OG requires "Meta property="

Hello Adrian,

I have not noticed this issue before.
Care to make a PR github.com/getk2/k2 ?

A further Improvement:

Where the K2 category has no image there needs to be a default image loaded for Facebook

In the file : /public_html/components/com_k2/views/itemlist
after line 739 insert the following code

else
{
$image = $uri->toString().'images/facebook-like.jpg';
$document->setMetaData('og:image', $image);
$document->setMetaData('image', $image);
}
list($width, $height) = getimagesize($image);
$document->setMetaData('og:image:width', $width, 'property');
$document->setMetaData('og:image:height', $height, 'property');

This will load the specified file "facebook-like.jpg" from the "images" folder if the K2 Category has no image
It also appends the og:image:width and og:image:height for either scenario

Nice one Adrian,

Kudos :)

Thanks for the positive response.

I have one more scenario to tackle with the K2 category image. I usually make the category image have small dimensions ie less than the 200px x 200px minimum requirement set by Facebook.

I'd like to store 2 category images, one that's used as per standard K2 and a Larger one just for FB but that sounds like a major alteration that will impact many core files. I may have to settle for using a default image if the category image is too small. which im sure I can code in exactly where these changes are made.

I think a solution to address these FB foibles is something the K2 Development team should consider in the next release of K2

Since 200px is not a really large image, loading only the category's image and using CSS in order to downscale it a bit will not impact your site's performance imho.

Work fine?
I don't see te new og: image: width/heigh tag

In K2's parameters you can choose which image size you 're going to use for Facebook.