Превью для ссылок WordPress сайтов при использовании изображений в формате webp - Facebook, Telegra, VKontake

Недавно для одного из проектов заметили, что когда пользователи делятся ссылками на новости сайта, то Telegram и Facebook не "подтягивают" изображения-превью для ссылок.

После того, как начали изучать эту проблему, поняли, что пока еще соц.сети не "умеют" понимать изображения в формате webp. Мы же при разработке используем преобразование изображений "на лету" в формат webp для лучше оптимизации скорости отображения страниц и уменьшения "веса" страницы в Мб.

Выход из сложившейся ситуации был найден очень простой. Необходимо в текущую активную тему сайта на WordPress добавить в файл header.php следующий код:

	<?$social_image = get_the_post_thumbnail_url('', 'thumbnail');?>
<?php if(!empty($social_image)): ?>
	<meta property="vk:image" content="<?=$social_image;?>" /> 
	<meta name="twitter:card" content="summary_large_image"> 
	<meta name="twitter:image" content="<?=$social_image;?>"> 
<?endif;?>

И после проверить результат инструментами-отладчиками:

для Facebook - https://developers.facebook.com/tools/debug

для Telegram - существует бот https://t.me/WebpageBot