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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Комментарии

  • эра:

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

  • Евгений Балыбин:

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

  • Игорь:

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

  • Игорь:

    Спасибо

  • Ника:

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

  • цуа:

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

  • Андрей:

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

  • Ольга:

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

  • Салават:

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

  • Ната:

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

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

  • 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);
    })();

  • Лелик:

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

  • Валентин Лифанов:

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

  • Вальдемар:

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

  • Игорь Миронов:

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

  • Дима:

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

  • Олег:

    Как сделать такой блок соцсетей как у вас в сайдбаре?

Проекты

Новые статьи

Случайные статьи