
Приветствую всех поклонников WordPress, блоговеденья, программирования и прочих искателей новых знаний!
В сегодняшнем посте я вновь хочу вернуться к вопросу миниатюр для соцсетей. Ранее в блоге уже публиковалась статья по этой теме: Изображение-миниатюра для соцсетей. В ней излагалось, как передать в соцсеть конкретное изображение. И был выложен пример кода, который передавал в соцсети со всех страниц блога одну и ту же миниатюру.
С недавнего времени ко всем новым статья я стал прикреплять изображения-миниатюры размером 150×150. Теперь у меня в блоге есть статьи и с миниатюрами и без них. Поэтому я решил доработать тот старый вариант кода по передаче изображений в соцсети таким образом, чтобы в случае наличия у поста миниатюры, в соцсеть передавалась именно эта миниатюра, если же пост опубликован без миниатюры, то передавалось другое, изображение.
Сразу выложу весь код, который у меня получился, а ниже все объясню. Код нужно размещать в файле header.php между тегами <head></head>.
Если используете плагины для кэширования, то после внесения изменений и их сохранения, нужно обязательно сбросить кэш.
1 2 3 4 5 6 7 8 9 10 11 12 13 |
<meta name="twitter:card" content="summary" /> <?php if(is_single() && function_exists("has_post_thumbnail") && has_post_thumbnail()): ?> <?php $thumb_arr = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'thumb'); ?> <meta property="og:image" content="<?php echo $thumb_arr[0]; ?>" /> <meta property="og:image:height" content="<?php echo $thumb_arr[2]; ?>" /> <meta property="og:image:width" content="<?php echo $thumb_arr[1]; ?>" /> <?php else: ?> <meta property="og:image" content="http://wordpress-life.ru/wp-content/themes/SmartMove/images/logo_soc.png" /> <meta property="og:image:height" content="200" /> <meta property="og:image:width" content="200" /> <?php endif; ?> |
Строка 3
В строке 3 прописана проверка: является ли отображаемая страница статьёй и есть ли у этой статьи миниатюра.
С помощью функции is_single() проверяем – статья или не статья;
has_post_thumbnail() проверяет есть ли у статьи миниатюра.
Но, дело в том, что поддержка миниатюр может быть изначально не включена в теме WordPress. Это подключение делается в шаблоне с помощью следующего кода: add_theme_support('post-thumbnails').
Поэтому, если поддержка миниатюр не включена в вашем шаблоне, то функция has_post_thumbnail будет не определена, что вызовет ошибку. Для этого нужна вот такая проверка существования функции has_post_thumbnail:
function_exists("has_post_thumbnail")
Таким образом, если отображаемая страница является статьей с миниатюрой, то выполняется код ниже до else (строка 8). В противном случае, если это не статья, или статья без миниатюры, то будет выполняться наш старый код (строки 9-11), который “говорит” соцсетям подхватывать единственное изображение logo_soc.png.
Строка 4
$post->ID – идентификатор (id, номер) статьи в базе данных;
Функция get_post_thumbnail_id($post->ID) – получает id миниатюры конкретной статьи;
Функция wp_get_attachment_image_src – возвращает массив с данными об изображении, id которого передается ей в качестве параметра;
0 элемент массива содержит url изображения
1 – ширину изображения
2 – высоту изображения
Получаем эти данные в переменную $thumb_arr и далее используем их в строках 5-7.
Код в строках 5-7 аналогичен коду в строках 9-11, только в 5-7 мы передаем данные миниатюры текущей статьи, а в 9-11 – данные изображения, подготовленного для статей без миниатюр и всех остальных случаев.
Надеюсь, все понятно объяснил. Задавайте вопросы, уточняйте.
Напоминаю, что на сайте активен конкурс 15 WMR за первый комментарий к статье.
Хотелось бы написать, что первый приз уже нашел счастливого обладателя, но автор первого комментария к вчерашней статье – Николай, отказался от денежного вознаграждения. Возможно, счел свой комментарий недостойным первого места, или посчитал приз незначительным. Что ж – это право каждого участника.
По поводу 15 WMR, напишу немного. Летом 2014 года я был в России, в Брянске. Проезд в маршрутке тогда стоил 14 рублей. Так вот не стоит пренебрегать 15 рублями. Можно ж их выиграть и поехать, например, на работу. А потом написать мне с работы: “Чувак, публикуй еще статью, мне вернуться домой надо!” =) Еще водителей можно поспрашивать: “Вы вебмани принимаете?”. “А у вас есть реферальная программа, если я друзей приведу покататься?”. =)
Ладно, у нас тут не камеди, а серьезный блог.
До новых, серьезных встреч!
Вставила код, но картинка так и не подхватилась при репосте. код удалила. В чём может быть ошибка. Вставляла перед закрывающим тегом. И попутно вопрос: в контакте тоже не хватает миниатюру. Поддержка миниатюр в теме есть. Сможете помочь?
Татьяна, у меня на сайте используется этот код. Можете проверить как изображение-миниатюра к статье подхватывается для репоста в соцсети, в том числе и Вконтакте.
Помочь, к сожалению, в ближайшее время не смогу.
Спасибо за ответ. Буду разбираться.
Кстати, сейчас попробовала у Вас и вконтакте всё хорошо, а фейсбук почему-то не подхватил
Странно. У меня все соцсети подхватывают изображение.
Огромное спасибо! Так долго искала решение =) Ваше подошло отлично!
Помогите пожалуйста с аналогичной проблемой. Миниатюра подхватывается везде кроме ВКонтакте, а нужно именно в нем. Причем без кода, который Вы указали(и с кодом тоже). Сначала думал из-за плагина(стоит AddToAny Share buttons). Поменял кучу разных, везде одно и то же – фейсбук подхватывает, мэйл.ру тоже, в контакте – нет. Потом думал из-за темы, поменял несколько разных, результат тот же. В верстке не силен, перерыл кучу информации, ничего не помогло. Уже не знаю куда податься).
C этой проблемой обратилась в службу поддержки Вконтакте, они её решают уже достаточно долго, вчера им напомнила, сказали, что ещё в процессе.
Здравствуйте Ольга. Я проблему решил с помощью плагина
WordPress Social Sharing Optimization – Manage Social Content / SEO and Media Easily
После его установки миниатюра появилась причем без добавления кода.
Благодарю от души, сейчас попробую.
Увы, не помогло. Кэш страницы сбрасывала.
Увы, не помогло. Кэш страницы сбрасывала. Может настроить как-то плагин надо?
Нет, настроек там вообще не делал. Я создавал темку на форуме:
https://ru.forums.wordpress.org/topic/%D0%9D%D0%B5%D1%82-%D0%BC%D0%B8%D0%BD%D0%B8%D0%B0%D1%82%D1%8E%D1%80%D1%8B-%D0%BA%D0%B0%D1%80%D1%82%D0%B8%D0%BD%D0%BA%D0%B8-%D0%BF%D1%80%D0%B8-%D1%80%D0%B5%D0%BF%D0%BE%D1%81%D1%82%D0%B5-%D0%B2%D0%BA%D0%BE%D0%BD%D1%82%D0%B0%D0%BA%D1%82%D0%B5?replies=6
Там подсказали про разметку, я начал методом тыка перебирать плагины с меткой open graph. Если честно, уже не надеялся, но вот этот плагин после установки решил проблему. Сейчас попробовал его отключить, миниатюры продолжили оставаться, только не те, которые нужны(например вообще от другой статьи). Обратно включил, все нормально стало. Может попробуете другие, вдруг помогут. Я сам в верстке и в языках php и html не силен. Поэтому искал решение именно плагином.