Как добавить социальные кнопки на WordPress
Эта статья будет полезна тем, кто хочет добавить социальные кнопки на WordPress без плагина. Очень часто я вижу, как на блогах понатыканы везде, где только можно, сверху и снизу статьи, в сайдбаре, в шапке и на всякий случай в футере, разных мастей социальные кнопки. Такой компот меня лично удручает, создается впечатление, что автор блога, не понимает предназначение этих самых кнопок.
Шапка, подвал или сайдбар?
Начнем с того, что кнопки соцсетей надо ставить на видное место, а это значит – шапка или верх сайдбара. Никто не будет скроллить в самый низ сайта, чтобы увидеть там кнопки. Какие именно ставить туда кнопки? Не нужно делать иконостас на все соцсети, где у вас есть аккаунты.
Признайтесь честно, что вы активны только в одной или максимум двух социальных сетях. Так зачем же вы посылаете вашего посетителя, например на Google+, где последняя от вас запись была 3 года назад.
Если вы активны только на фейсбуке, тогда и поставьте одну, но зато большую кнопку на фейсбук. Желательно рядом с кнопкой напишите, что увидит там посетитель или он может там сделать что-то осмысленное, например, оставить комментарий или записаться на курс.
Кнопки соцсетей для шаринга контента
Обратите внимание, что кнопки надо ставить под статьей, а не над. Зачем вы заставляете пользователя скроллить вверх, чтобы он поделился статьей, это же нелогично. Читатель скорее, нажмет на пагинацию и пойдет дальше, чем вернется назад. Вы просто глупо теряете трафик. Кстати ссылка на кнопке под статьей, видео, фотографиями, карточки товара, должна вести не на аккаунт, группу или страничку, а при нажатии должен срабатывать скрипт, запускающий процесс шаринга. В идеале набор с кнопками должен догонять читателя, находиться в зафиксированном положении при скролле, тогда больше шансов, что ваш контент расшарят.
Как добавить кнопки для шаринга на сайт
Самый простой способ, как помочь пользователям поделиться ссылкой на интересный контент, это воспользоваться конструктором блока «Поделиться» от яндекса.
Ссылка на конструктор: https://tech.yandex.ru/share/
Ссылка на документацию: https://tech.yandex.ru/share/doc/dg/add-docpage/
В документации подробно описано, как добавить блок с кнопками шаринга на сайт.
Как добавить социальные кнопки на WordPress
Понятное дело, что существует много плагинов для вставки социальных кнопок, но это слишком просто, куда интереснее будет выяснить, как добавить кнопки без плагинов.
Как добавить кнопки поделиться на WordPress
Конструктор сгенерирует код для вставки, где первая часть кода – это ссылка на скрипт share.js, который будет подгружаться с сервера Яндекса. Откройте файл functions.php и вставьте, следующий код, который безопасным способом подключит JS скрипт к сайту на WordPress.
//* Регистрация и подключение share.js
add_action( 'wp_enqueue_scripts', 'twentyseventeen_enqueue_scripts' );
function twentyseventeen_enqueue_scripts() {
wp_enqueue_script('ya-share2', 'https://yastatic.net/share2/share.js' );
}
Вторая часть кода – это блок div с классом 'ya-share2' и выбранные вами соцсети. Его, то вы и будете вставлять в файлы темы блога или прямо в запись в текстовом режиме редактирования.
Код для вставки под статьей
<div class="ya-share2" data-services="collections,vkontakte,facebook,odnoklassniki,moimir"></div>
Открываете файл single.php и вставляете код с кнопками, после строки вывода контента.
<?php the_content('Читать полностью'); ?>
Выбранные кнопки появились под статьей.
Где взять кнопки соцсетей?
Мне нравиться брать иконки с сайта:
https://www.flaticon.com/
Для примера нам хватит одной иконки: facebook, вбиваем в поиск на сайте flaticon.com название иконки, выбираем нужный цвет, размер и скачиваем в формате PNG.
Генерация кода на WordPress
Есть простой и элегантный способ, как получить готовый HTML код для вставки иконок в любом месте сайта. Добавить запись -> Добавить медиафайлы. Загружаем наши иконки в библиотеку файлов и жмем на кнопку Вставить запись.
В текстовом редакторе сгенерируется код, добавив ссылку на соцсети, этот код можно вставлять в любое место на сайте.
Меню социальных кнопок на Wordpress
В теме Twenty Seventeen, подключено нижнее меню социальных ссылок, куда можно добавить ссылки на ваши аккаунты в соцсетях. Вам надо в новое меню добавить произвольные ссылки с названием соцсетей и URL и сохранить.
WordPress вместо текстовых названий автоматически подставит иконки и поместит их в подвал сайта.
-
- Михаил Русаков
Комментарии (0):
Для добавления комментариев надо войти в систему.
Если Вы ещё не зарегистрированы на сайте, то сначала зарегистрируйтесь.