Кнопки социальных сетей для сайта: способы установки

Кнопки социальных сетей для сайта – необходимый элемент продвижения ресурса. Не учитывать их роль – значит остаться далеко позади, так как сейчас количество переходов на сайт через соцсети учитывается даже при построении поискового рейтинга. Поэтому поговорим о том, как установить социальные кнопки на свой сайт или блог.

Лирическое отступление

Социальные сети из невинной забавы и способа общения бывших и настоящих школьников превратились в мощный инструмент добычи трафика. Теперь соцсеть – это не только общение. Можно сказать, это отдельная категория СМИ, в которой происходит постоянное движение информации.

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

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

Как уже стало понятно, кнопка — это ни что иное, как ссылка, ведущая на скрипт публикации в соцсети. Все популярные социальные сети пошли навстречу владельцам сайтов, предоставив им уже готовые варианты кнопок для установки. Все что нужно — скопировать готовый HTML-код, предоставляемый «социалкой» и скопировать его в исходный код своей страницы.

Фейсбук и его «лайки»

screen==480

Для получения заветной кнопки «Мне нравится» (или ее англоязычного варианта «Like») нужно пройти по ссылке и указать нужные настройки в диалоговой форме. После этого будет сгенерирован код для вставки в свою страницу. Кстати, поддержку тэгов Open Graph, если это возможно, тоже стоит обеспечить.

1

Кнопки «Сохранить» и «Мне нравится» от Вконтакте

Схема установки кнопки «Сохранить» идентична — пройдя по ссылке, нужно выбрать дизайн кнопки, ввести адрес страницы и получить готовый код. В нижней части страницы настроек представлена прямая ссылка для размещения кнопки на сайтах без поддержки JavaScript.

2
В режиме настроек для размещения еще одной кнопки от Вконтакте – «Мне нравится» можно задать, помимо всего прочего, размеры этой кнопки. Также владельцу ресурса предоставляется возможность после установки кнопки посматривать полный список пользователей, которые поделились ссылкой на его страницу.

3

Социальные кнопки для «Одноклассников» и «Мой мир»

У вебмастера есть уникальная возможность без особых усилий поставить сразу две кнопки — «Нравится» от социальной сети «Мой мир» и «Класс» от «Одноклассников». Если нет необходимости в двух кнопках одновременно — легко можно выбрать одну из них.

На странице настроек пользователю предлагается выбрать дизайн, размер кнопок, способ размещения счетчика.

4Воробышек

Устанавливая социальные кнопки для сайта, не следует «гнаться» за количеством — лучше учитывать популярность соцсетей. Например, установка кнопки соцсети «My Space», популярной на Западе и практически неизвестной на наших просторах, не приведет к желаемому результату.

А вот если среди потенциальной целевой аудитории сайта много пользователей «Твиттера», нужно обязательно установить любую из его кнопок.

Настройка кнопки проста до безобразия. Радует также русскоязычная инструкция на странице настроек. Однако генератор кода учитывает довольно мало вариантов оформления счетчика, поэтому, если не устроят стандартные предложения, часть кода придется прописывать вручную.

6Кнопка от Google+

Хочешь не хочешь, а мнение поисковика Goоgle при продвижении сайта следует учитывать. Чтобы лучше продвигать ресурс в этой поисковой системе, нужно установить кнопку «+1». Места много она не займет, но положительно повлиять на рейтинг может. Настройка кнопки интуитивно понятна и практически не отличается от других подобных операций.

5

А как, чтобы все и сразу?

Каждый из вышеперечисленных вариантов, хоть и является оптимальным, однако требует загрузки отдельных библиотек JavaScript (у каждой соцсети они свои).

Если же хочется установить на сайт код, который позволит публиковать ссылки на страницу сразу в нескольких соцсетях, можно воспользоваться специальными сервисами.

Например, сервис Pluso позволяет сгенерировать один код для нескольких социальных сетей. Кнопки при этом будут довольно-таки красивыми и функциональными. Возможен подсчет переходов по этим кнопкам, который будет отображаться на счетчике.

7
Яндекс располагает блоком «Поделиться» — здесь, как говорится, все «бедненько и чистенько». Настроек минимум, дизайн и возможности кнопок в целом ограничены, — но зато все работает.

8

Кнопки социальных сетей для WordРress и Joomla

Блоги, работающие на «движке» WordРress, можно обогатить кнопками с помощью плагина Social Share Buttons for WordPress — многофункционального решения с широким набором настроек. Кнопки социальных сетей для WordРress имеют идентичный внешний вид и функционал, как и для сайтов на базе других CMS.

Чтобы установить кнопки социальных сетей для Joomla, также следует скачать один из множества плагинов. Программа JL Like, в частности, характеризуется возможностью подсчета «лайков» и голосов без особого отягощения страницы.

Комментировать

КОММЕНТАРИИ

03.12.13 Ответить
эра:

как-то я не поняла, а дальше что делать?
сгенерировала код на несколько кнопок… а как в тамблер вставить?

07.03.14 Ответить
Евгений Балыбин:

Супер статья! очень помогла

11.07.14 Ответить
Игорь:

Добрый день.
Подскажите как у вас реализовано всплывающее окно приглашения в группу ВК при первом посещении сайта?
Есть где-то в открытом доступе инструкция как это реализовать или лучше заказать у фрилансеров?

11.07.14 Ответить
Игорь:

Спасибо

16.09.14 Ответить
Ника:

Шикарная статья, установила на свой сайт кнопки ))

14.10.14 Ответить
цуа:

@Игорь: для вордпресса я находил какой-то плагин (искать по «Vk»). Там есть какая-то функция отвечающая за это. Не помню точно.

29.11.14 Ответить
Андрей:

спасибо ребята отличная статья

09.12.14 Ответить
Ольга:

Я у себя на блоге поставила соцкнопки, но у меня какая-то непонятная заморочка с ними — если пытаюсь репостить вконтакте статью, то очень часто не подхватываются картинки из статьи для превьюшки или только часть из них берется.
Стоят кнопки от яндекса и еще какие-то, но у обоих эта проблема (при чем по разному срабатывает на одной и той-же статье даже)
Можете подсказать в чем может быть проблема?

22.12.14 Ответить
Салават:

@Игорь: добавлю от себя копеечку:
Посадил себе uptolike, а в настройках, которые сам ресурс доходчиво объясняет, прописал «приглашение» свою группу «ВКонтакте».

10.03.15 Ответить
Ната:

А как вы сделал в правом сайдбаре на три соцсети виджет? Очень класно себе такой хочу!

10.03.15 Ответить
Wildo:

@Ната, это разработчик как-то запилил, не знаю

12.03.15 Ответить
Erika:

Помогите пожалуйста!

поставил лайк от фб, но не работает…

(function() {
var po = document.createElement(‘script’); po.type = ‘text/javascript'; po.async = true;
po.src = ‘https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName(‘script’)[0]; s.parentNode.insertBefore(po, s);
})();

21.04.15 Ответить
Лелик:

@Wildo, генерируйте с помощью pluso нужные вам кнопки, вставляете в код, например, правого sidebar.php, если он у вас присутствует. У меня это после строчки «»
а вообще, наведите мышкой на место куда хотите вставить, а правой мышкой откройте код, а уже потом легко найти его по файликам и вставить.
Когда кнопки загружатся можно увидеть ниже или выше по строчке их необходимо вставить.
Как-то так)

08.06.15 Ответить
Валентин Лифанов:

Валидатор очень ругается на кнопки сделанные в ручную почему-то

24.09.15 Ответить
Вальдемар:

У меня на сайте кнопки такие есть но при открытии они почемуто появляются только после 3х секунд, можно ли чтото сделать? или это уже не исправить?

27.09.15 Ответить
Игорь Миронов:

@Вальдемар, скорее всего запрос до сервера кнопок идёт долго или с вашим хостингом/интернетом что-то не то. Советую попробовать другой сервис share-кнопок, например, http://goodshare.ru/ — сам пользуюсь, работают быстро даже на самом дешёвом тарифе моего хостинга (хостюсь на 1gb).

28.07.16 Ответить
Дима:

Спасибо! С PLUSO отлично подсобили. То что надо за 5 сек.