Новости

Корректное отображение изображения миниатюры для кнопки Like от Facebook

01.09.2018

Сейчас практически для всех сайтов довольно актуально интегрирование различных социальных служб, кнопок, призванных привлечь как можно больше посетителей. Все это довольно распространено и дает хорошие результаты. В данной статье я опишу как правильно установить кнопку Мне нравится от Facebook на сайт WordPress. Кнопка Like является отличным дополнением к сайту, она позволяет пользователю поделиться заинтересовавшим его материалом с друзьями. Установить кнопку можно здесь . Форма генерации кнопки выглядит так: Вставляя кнопку на сайт WordPress , поле URL заполнять не требуется. После нажатия кнопки Get Code, нам дается два кусочка кода, которые нужно разместить в Wordpress шаблоне.

13.6. Что делать, если в Facebook не отображается миниатюра.

Первую часть кода добавляем в файл header.php шаблона, желательно сразу после открытия тега <body>, вторую — в файл отвечающий за вывод страницы записи, обычно это single.php.

Однажды, на одном клиентском сайте на WordPress после ее установки, возникла проблема — Facebook не правильно захватывал изображение для постинга, то есть миниатюра к текущей записи игнорировалась и бралось постороннее изображение, это конечно же было не допустимо.

Новый руководитель и сборка Windows 10 Mobile 14356

Разработчиками Facebook, возможность возникновения такой проблемы была учтена и решается она с помощью Open Graph Tags . Для отображения нужной картинки между тегами <head> нужно поместить следующий мета-тег:

1	< meta property = "og:image" content = "http://www.mysite.ru/article_image.jpg" />

где article_image.jpg — изображение из статьи.

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

1	<?php global $wp_query ; $thePostID = $wp_query -> post -> ID ; if ( has_post_thumbnail ( $thePostID ) ) { $thumb_id = get_post_thumbnail_id ( $thePostID ) ; $image = wp_get_attachment_image_src ( $thumb_id ) ; echo '<meta property="og:image" content="' . $image [ 0 ] . '" />' ; } ?>

<?php global $wp_query; $thePostID = $wp_query->post->ID; if( has_post_thumbnail( $thePostID )){ $thumb_id = get_post_thumbnail_id( $thePostID ); $image = wp_get_attachment_image_src( $thumb_id ); echo '<meta property="og:image" content="'.$image[0].'" />'; } ?>

В результате, генерируется метатег с соответствующим посту урлом изображения миниатюры. На страницах, где миниатюр нет, метатег не выводится.

И еще, поддерживает или нет Vkontakte метатеги Open Graph Tags, точно не знаю, но при возникновении подобной проблемы можно попробовать применить данный метод.