Отличные кнопки социальных сетей для сайта. Социальные кнопки на сайт


Кнопки социальных сетей на сайт

Привет! Сегодня у меня радостное событие - наконец-то я нашел нормальные кнопки соцсетей для сайта, которые меня устраивают на 100% (ну может не на 100, но на 99% - точно).

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

Что такое кнопки социальных сетей на сайте

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

Вам же одни плюсы: так как вместо одного человека о сайте узнали сразу десятки его знакомых. Эдакий социальный снежный ком.

Уверен, что каждый SEO-специалист понимает, почему важно привлекать релевантный трафик из социальных сетей. Тем более бесплатный.

Если в двух словах, то поисковики отслеживают любые ссылки, в том числе ссылки из соцсетей, они участвуют в ранжировании, разбавляют ссылочную массу - то есть если на сайт ссылаются «живые» люди из того же Вконтакте или Google+ неважно, это всегда дополнительный сигнал поисковикам, что сайт развивается естественно и интересен людям.

А значит стоит его ранжировать повыше :smile:

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

Естественно, просто "подключаю" - это как минимум, а как максимум - на конкурентные темы задействую плагин социального замка, чтобы еще и стимулировать аудиторию «лайкать».

Долой стандартные кнопки соцсетей!

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

Тут и share42.com, uptolike.com, те же социальные кнопки от Яндекса, короче есть много разных онлайн-генераторов по размещению кнопок соцсетей для сайта.

Но лично меня они не радовали. Внешний вид их всех без исключения оставлял желать лучшего.

Я даже «пилил» кнопки на своем блоге, чтобы они хоть немного выделялись и были не такие дубово-типовые.

Кнопки социальных сетей

Но так как они были допилены, то со временем не работали как мне хотелось , кроме этого важно было иметь еще и "плавающие" кнопки, чтобы всегда были под рукой, да и душа хотела чего-то поэлегантнее и сегодня я это нашел, потестировал и уже установил на все свои сайты.

Кнопки социальных сетей от uSocial.pro

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

Кнопки соцсетей от Usocial

Быстро глянул исходный код, погуглил и обнаружил авторский сайт - https://usocial.pro, на котором можно было бесплатно залогиниться через соцсети и сгенерировать кнопки основных соцсетей: Вконтакте, Google+, Твиттер, Одноклассники и т.п.

Интерфейс отличный: все на русском, интуитивный, разберется даже школьник. Приятно, когда все продумали до тебя - нет ничего лишнего, в то же время все что требуется 99% сайтам, присутствует и настраивается в два клика.

Генератор онлайн кнопки соцсетей

 

Особенно порадовала возможность делать именно «плавающие» кнопки соцсетей и при этом выбирать их положение: слева, справа и т.п.

Размещается код стандартно на сайте перед закрывающим тегом </body>, для этого понадобится доступ по FTP и знать, в каком файле у вас находится «подвал сайта», в WordPress это обычно footer.php в папке с шаблоном, уверен, что никаких проблем с добавлением возникнуть ни у кого не должно.

Кроме генератора кнопок соцсетей

Кстати, кроме непосредственно генератора кнопок соцсетей для сайта в usocial.pro есть еще пара фишек, вроде генератора социальных метатегов, кнопок like и всплывающего окошка с предложением вступить в группу.

Первые две фишки у меня вызвали сомнение в их необходимости, ведь кнопки поделиться в соцсетях будут «покруче» каких-то лайков, а генератор метатегов есть в любом уважающем себя SEO-плагине, типа All-in-One SEO Pack.

А вот всплывающее окошко - это интересно. В свое время я перерыл довольно много бесплатных плагинов и сервисов со всплывающими окнами, и у всех была одна беда - кривой интерфейс, нелепый дизайн, плохая поддержка.

Тут все выглядит отлично:

Подписаться на соцсети

Однако я всплывающие окна использовать не стал, ограничился только установкой кнопок социальных сетей на сайт, так как не люблю большие всплывающие окна в принципе, таймер в 20 секунд маловат,а для привлечения аудитории в группы мне хватает социального замка Social Locker Ultimate, он недавно обновился, стало еще больше офигенных штук в нем, вроде сбора емейл-подписчиков, улучшенной производительности и интерфейса.

Выводы и итоги

Сервис получился неожиданно "взрослым", продуманным, профессиональным. Возникает желание его использовать - а что еще нужно от сервиса.

Что можно было бы пожелать разработчикам? Лично мне не хватило в мобильной версии галочки «показывать кнопки соцсетей» сразу в свернутом виде - а так они прилично места занимают вот так:

Кнопки соцсетей на мобильном

А хотелось бы по умолчанию вот так:

Кнопки социальных сетей на мобильном

Кликаешь на палец - открываются кнопки.

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

Ну и и развивать свой интересный продукт в дальнейшем.

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

moytop.com

вопросы и ответы по установке кнопок для добавления контента в социальные сети

Как установить кнопки PLUSO на сайт?
  1. Перейдите в конструктор
  2. Настройте вид и параметры кнопок
  3. Скопируйте и установите полученный код кнопок в HTML-верстку вашего сайта в том месте, где хотите расположить кнопки

Если вы используете одну из следующих CMS воспользуйтесь дополнительными инструкциями:WordPress, Joomla, Drupal

Какие сервисы лучше выбрать?

Это зависит от тематики вашего сайта. Однако советуем вам не ограничиваться стандартным набором сервисов. Дело в том, что 4 главные социальные сети дают не более 50% от всех кликов. Мы не видим смысла ограничиваться основными сетями, лучше дать пользователю полный выбор.

Можно ли разместить на одной странице несколько панелей с кнопками?

Да, такая возможность существует. Для этого необходимо у каждой панели с кнопками указать собственный url.

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

Да, такая возможность существует. Для этого в тэг HEAD вашего сайта необходимо вставить следующий код:

<meta property="og:title" content="Заголовок" /> <meta property="og:description" content="Описание" /> <meta property="og:url" content="Ссылка на страницу" /> <meta property="og:image" content="Ссылка на картинку" /> <meta name="title" content="Заголовок" /> <meta name="description" content="Описание" /> <link rel="image_src" href="Ссылка на картинку" /> Существует ли возможность настройки стиля кнопок через CSS?

К сожалению, на данный момент можно использовать только предложенные стили. Если у Вас есть пожелания или предложения по этому вопросу, пришлите их нам на почту [email protected]

Существует ли возможность установки кнопок под прокотолом https/ssl?

Да, сервис PLUSO поддерживает эти протоколы.

Поддерживает ли сервис PLUSO английский язык?

Да, в коде кнопок укажите дополнительный параметр data-lang="en".Доступны русский (ru), украинский (ua), белорусский (by) и английский (en) языки.Если вам нужны другие языки напишите на [email protected]

Будет ли доступен сервис статистики отслеживания нажатий?

Да, статистика доступна по ссылке http://share.pluso.ru/share/stats.

Будут ли добавлены индивидуальные счетчики для каждой кнопки?

Мы запланировали разработку такого функционала на ближайшее время. На данный момент вы можете воспользоваться только общим счетчиком.

Совместим ли сервис PLUSO со ссылками, написанными кириллицей?

Да, ссылки, написанные кириллицей, корректно работают с нашим сервисом.

Планируется ли расширение дополнительных сервисов?

Да, мы постоянно работаем над расширением возможностей наших пользователей.

Если вы знаете, какой сервис необходимо добавить напишите на [email protected]

Существует ли возможность добавления нашего сервиса в кнопки PLUSO?

Да, такая возможность существует. Для этого необходимо прислать заявку нам на почту [email protected], мы обязательно ее рассмотрим.

share.pluso.ru

Социальные кнопки для сайта. Лучщие сервисы кнопок социальных сетей.

Всем привет! Сегодня речь пойдет о пяти самых интересных сервисах, на которых просто и быстро можно выбрать внешний вид социальных кнопок для сайта и получить соответствующий код.

Кнопки социальных сетей

«Поделиться» от Яндекс

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

  • Вконтакте;
  • Facebook;
  • Twitter;
  • Одноклассники;
  • МойМир;
  • Livejournal;
  • Friendfeed;
  • Мой круг;
  • Google+.

Переходите на страницу сервиса «Поделиться» от Яндекс.

Яндекс Поделиться

Галочками отметьте нужные пункты и выберете внешний вид блока. Код генерируется автоматически.

Google +1

Google +1 позволяет пользователям проголосовать за страницу вашего портала и рассказать о ней своим друзьям в социальной сети Google+. Чем больше голосов она соберет, тем лучше к ней будет относится Google, поэтому старайтесь выбирать размер для нее по-больше и располагать на видном месте.

Перейдите на страницу получения кода кнопки Google +1.

Кнопка g+1

Настройте размер и внешний вид кнопки, выберете русский язык. Расширенные настройки вам вряд ли пригодятся. Как видите, получит социальные кнопки от Яндекс и Google очень легко и быстро. Буквально два клика мыши, и все готово!

AddThis

AddThis.com предлагает разместить оранжевую кнопку Share (или оранжевый +), содержащую огромное количество всевозможных социальных сетей, закладок и сервисов. Самые популярные социалки можно вынести из общего списка и поместить отдельно рядом с Share. Помимо этого, сервис предлагает аналитику и статистику по активности читателей. Для доступа к ней на addthis.com следует зарегистрироваться.

AddThis

Переходите на данную страницу и выбирайте внешний вид панели:

Стиль

Код генерируется автоматически в правом окне.

Кроме этого, AddThis для самых популярных платформ предлагает отдельные расширения.

Get addthis for

Например, выбираем WordPress — самую популярную CMS для создания блогов. Для нее AddThis предоставляет бесплатный плагин и подробную инструкцию с картинками по его установке и настройке.

Share Pluso

Очень стильные и красивые социальные иконки предлагает сервис share.pluso.ru. Не сомневаюсь, что вы их уже много раз видели на всевозможных интернет ресурсах. Особенно красиво смотрятся черно-белые, которые прекрасно подойдут к любому дизайну.

Pluso

Share Pluso поддерживает более 20 основных сервисов, закладок и социальных сетей рунета. Добавьте к этому несколько служебных функций: печать, в закладки, отправить на email и так далее.

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

Share42

По количеству доступных социалок Share42, конечно уступает рассмотренному выше AddThis, но он подкупает красотой.

Share42

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

1. Выбираете социальные сервисы, размер иконок и порядок их следования (просто перетаскивая иконки мышью).

2. Далее идут параметры социальных иконок:

Настройки

  • Тип панели с иконками — горизонтальный блок легче разместить, но плавающий вертикальный смотрится гораздо красивее и всегда находится на экране, поэтому читатель его обязательно заметит.
  • Кодировка вашего сайта — если не знаете кодировку, оставьте как есть: UTF-8.
  • Язык подсказок у иконок — русский сайт, следовательно и подсказки должны быть на русском.
  • Добавить иконку сайта Share42.com — добавить к выбранным социальным кнопкам иконку, ведущую на страницу автора скрипта — Share42.com.
  • Ссылка на RSS вашего сайта — данная опция будет активна, если вы выберете иконку RSS ленты. Напомню, RSS ленту новостей своего сайта обязательно следует добавить в сервис FeedBurner от Google.
  • К вашему сайту подключен jQuery? jQuery — это библиотека языка JavaScript предназначенная для создания всевозможных визуальных эффектов. Если не уверены, подключена она или нет — галочку не ставьте.

3. Когда настройки пройдены, остается посмотреть на получившиеся социальные кнопки и скачать скрипт, если вас все в них устраивает.

4. Установка скрипта на сайт.

Распакуйте полученный архив и загрузите полученную папку share42 на сервер в корневой каталог. Для работы с ftp могу посоветовать использовать бесплатную программу — FileZilla.

Если вы все правильно сделали и папка со скриптом действительно загружена в корневой каталог, то ее адрес будет http://vash_site.ru/share42/. Укажите его в пункте 3 раздела «Установка скрипта на сайт».

Папка со скриптом

На четвертом шаге вам предлагается выбрать CMS своего сайта, если вы ее используете. В зависимости от отмеченного пункта, код ниже несколько изменятся.

Выбор cms

Теперь необходимо код из шага №5 вставить к себе на сайт. Для горизонтального блока социальных кнопок все просто — куда вставите, там он и отобразиться. С плавающим вертикальным несколько сложнее.

В последней строчке кода следует указать расстояние в пикселях от начала страницы (в примере 150) и от верха видимой области (в примере 20) до плавающей панели.

<script type="text/javascript">share42('http://site.ru/share42/',150,20)</script>

Далее его следует вставить «прямо перед или сразу после основного текста страницы». Для того же WordPress это сделать не составит труда: открываем поочередно шаблоны single.php, page.php и index.php и вставляем код сразу после строчки, отвечающей за вывод контента страницы. В моей теме WordPress она имеет вид:

?php the_content('Читать полностью'); ?>

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

Последнее, что следует сделать, это скопировать стили из шага №6 в файл стилей вашего сайта — с расширением .css. Чаше всего этот файл носит название style.css.

А теперь гвоздь программы — социальные кнопки с счетчиками, которые я использую в настоящий момент на своем блоге! Смотрятся просто шикарно! Доступны два размера — маленький и крупный. Между прочим, на икони с счетчиками люди нажимают гораздо охотнее. Это я даже по себе заметил. ;)

Социальные кнопки с счетчиками

О том, как их установить на свой блог, читайте в разделе «Важная информация» :

Данные социальные кнопки предоставляет нам поисковая система Яндекс. Да-да, наш Яша способен куда на большее, чем просто блок «Поделиться». Для функционирования кнопок нам потребуется задействовать два кода.

Первый код отвечает за функционал кнопок, его вставляем перед закрывающим тегом head, который в темах для WordPress располагается в шаблоне header.php.

<script src="//yandex.st/share/cnt.share.js"></script>

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

<div data-yashareLink="" data-yashareTitle="" data-yashareDescription="" data-yashareImage="" data-yashareQuickServices="yaru,vkontakte,facebook,twitter,odnoklassniki,moimir,gplus" data-yashareTheme="counter" data-yashareType="small"></div>

Обратите внимание на атрибут data-yashareType="small". Здесь задается размер иконок: small — маленький, big — большой. Все гениальное просто. :)

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

Со скриптом от Share42 разобрались, теперь давайте рассмотрим как лучше добавить на интернет ресурс код социальных кнопок от других сервисов.

Код кнопки состоит из двух частей:

1. Скрипта, заключенного между тегами имеющими примерно следующий вид:

<script type="text/javascript">...</script>

2. Блока, отвечающего за отображение иконок — весь остальной код.

Так вот, все используемые на странице скрипты лучше размещать в одном месте — в самом низу html кода страницы, перед следующими закрывающими тегами:

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

На этом все, спасибо за внимание. Берегите себя!

Лучший способ выразить благодарность автору - поделиться с друзьями!

Узнавайте о появлении нового материала первым! Подпишитесь на обновления по email:

Следите за обновлениями в Twitter и RSS.

fairheart.ru

Pluso X – экспериментальная версия лучших социальных кнопок

Настоящее пользовательское соглашение (далее — Соглашение) содержит условия, на которых авторы сервисов, размещенных на сайте «pluso.ru» (далее — Правообладатель) предоставляют заинтересованному лицу или заинтересованным лицам (далее — Пользователь) возможность использования данных сервисов (далее — Сервисы).

1. Общие положения

1.1. Загружая, копируя элементы Сервисов, приступая к использованию Сервисов Пользователь подтверждает свое согласие соблюдать условия Соглашения. 1.2. В случае если Пользователь не согласен с данными условиями, он не вправе устанавливать, копировать или иным образом использовать Сервисы. 1.3. Сервисы подлежат правовой охране в качестве компьютерных программ. 1.4. Все права на Сервисы принадлежат Правообладателю (соответствующим авторам в соответствующих частях), за исключением передаваемых по настоящему лицензионному соглашению или иным, заключенным в соответствии с действующим законодательством, соглашениям.

2. Права Пользователя

2.1. В соответствии с настоящим Соглашением Пользователь получает неисключительное право использования Сервисов, в том числе, в составе собственных сайтов в сети Интернет. 2.2. Количество сайтов, в составе которых Сервисы могут быть использованы каждым Пользователем, не ограничено. 2.3. Использование Сервисов для Пользователя является бесплатным. 2.4. Сервисы используются Пользователем в том виде, в котором они предоставляются Правообладателем, в соответствии с теми условиями, на которых они предоставляются. 2.5. Настоящее Соглашение не предоставляет Пользователю прав на внесение изменений в Сервисы, переработку Сервисов, передачу прав по настоящему соглашению иным лицам или любое иное использование Сервисов, которое прямо не предусмотрено настоящим Соглашением. 2.6. Сервисы должны использоваться Пользователем в соответствии с действующим законодательством.

3. Права Правообладателя

3.1. Правообладатель вправе в одностороннем порядке в любой момент, не уведомляя при этом Пользователя вносить в настоящее Соглашение изменения, которые будут обязательны для всех Пользователей, в том числе ранее принявших условия настоящего Соглашения. 3.2. Правообладатель вправе отказать в предоставлении возможности использования или прекратить текущее использование Сервисов (одного, нескольких, всех) для отдельных Пользователей или для всех Пользователей. 3.3. Правообладатель при условии сохранения надлежащего выполнения Сервисами своих основных функций вправе одновременно выборочно направлять конечных пользователей Сервисов по адресам партнеров. 3.4. Правообладатель не несет ответственности за содержание ресурсов, к которым конечные пользователи Сервисов получают доступ по адресам партнеров. Переходя по данным адресам, конечные пользователи самостоятельно несут ответственность за свои действия. 3.5. Поскольку Сервисы представляют собой только лишь средство для работы с информацией, Правообладатель не несет ответственности за правомерность использования Пользователем Сервисов, а также за содержание сайтов или иной информации Пользователя, для работы с которой используются Сервисы.

4. Конфиденциальность информации

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

5. Иные условия

5.1. Сервисы предоставляются «как есть», без каких бы то ни было гарантий. 5.2. Правообладатель не несет ответственности за какие-либо убытки (ущерб или упущенную выгоду), возникающие в связи с использованием или невозможностью использования Сервисов. 5.3. В случае возникновения споров Правообладатель и Пользователь прилагают все усилия, чтобы разрешить их путем переговоров. 5.4. При необходимости связаться с Правообладателем используются контактные данные, указанные на сайте «pluso.ru».

x.pluso.ru

Блок «Поделиться» — Как добавить блок на страницу? — Технологии Яндекса

data-access-token Токен для снятия ограничения запросов на получение счетчика. Актуален и работает только для Facebook. Токен, полученный от Facebook.

Как получить токен см. в статье Маркеры доступа.

data-bare Признак того, что загрузка стилей отключена. Если добавить атрибут, соцсети будут отображаться в виде текстового вертикального списка. Наличие или отсутствие атрибута.
data-counter Признак того, что на кнопке соцсети отображается счетчик публикаций.

Внимание. На кнопке Твиттера счетчик публикаций отображаться не будет — Твиттер больше не поддерживает API с количеством публикаций.

Наличие или отсутствие атрибута.
data-copy Позиция кнопки Скопировать ссылку. Кнопка Скопировать ссылку может отображаться, если используется параметр limit.
  • first — кнопка вверху списка;
  • last — кнопка внизу списка;
  • hidden — кнопка не отображается.

Значение по умолчанию: last.

data-description Текст, которым нужно поделиться. Строка.

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

data-direction Направление списка кнопок.
  • horizontal — горизонтальное;
  • vertical — вертикальное.

Значение по умолчанию: horizontal.

data-hashtags Хэштеги. Актуальны и работают только для Твиттера. Строка, указывается без знака #.

Несколько хэштегов указываются через запятую, без пробела.

data-image Изображение, которым нужно поделиться. URL изображения.

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

data-lang Язык блока. Локализуются подписи кнопок соцсетей и кнопка Скопировать ссылку.
  • az — азербайджанский;
  • be — белорусский;
  • en — английский;
  • hy — армянский;
  • ka — грузинский;
  • kk — казахский;
  • ro — румынский;
  • ru — русский;
  • tr — турецкий;
  • tt — татарский;
  • uk — украинский.

Значение по умолчанию: ru.

data-limit Количество соцсетей, отображаемых в виде кнопок. Используется если нужно встроить в блок много соцсетей, а также чтобы блок занимал мало места на странице. Не вошедшие в лимит соцсети будут отображаться в pop-up по нажатию кнопки . Натуральное число или отсутствие атрибута.
data-nonce Идентификатор директивы Content Security Policy. Используется для подтверждения безопасности скрипта блока «Поделиться». Строка, сгенерированная сервером.
data-popup-direction Направление открытия pop-up.
  • bottom — вниз;
  • top — вверх.

Значение по умолчанию: bottom.

data-popup-position Расположение pop-up относительно контейнера блока. Значение outer может понадобиться в том случае, если из-за специфики верстки вашего сайта pop-up обрезается соседними элементами страницы.
  • inner — внутри контейнера;
  • outer — снаружи контейнера.

Значение по умолчанию: inner.

data-services Список идентификаторов социальных сетей, отображаемых в блоке. См. список идентификаторов поддерживаемых соцсетей. Несколько соцсетей указываются через запятую без пробела.

Значение по умолчанию: vkontakte,facebook,twitter.

data-size Размер кнопок соцсетей.
  • m — большой ;
  • s — маленький .

Значение по умолчанию: m.

data-title Заголовок, которым нужно поделиться.

Строка.

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

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

data-url Ссылка, которой нужно поделиться. Любой URL.

По умолчанию указывается URL страницы, на которой размещен блок.

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

tech.yandex.ru

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

РЕКОМЕНДУЮ ПОЧИТАТЬ

wildo.ru

вопросы и ответы по установке кнопок для добавления контента в социальные сети

Как установить кнопки PLUSO на сайт?
  1. Перейдите в конструктор
  2. Настройте вид и параметры кнопок
  3. Скопируйте и установите полученный код кнопок в HTML-верстку вашего сайта в том месте, где хотите расположить кнопки

Если вы используете одну из следующих CMS воспользуйтесь дополнительными инструкциями:WordPress, Joomla, Drupal

Какие сервисы лучше выбрать?

Это зависит от тематики вашего сайта. Однако советуем вам не ограничиваться стандартным набором сервисов. Дело в том, что 4 главные социальные сети дают не более 50% от всех кликов. Мы не видим смысла ограничиваться основными сетями, лучше дать пользователю полный выбор.

Можно ли разместить на одной странице несколько панелей с кнопками?

Да, такая возможность существует. Для этого необходимо у каждой панели с кнопками указать собственный url.

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

Да, такая возможность существует. Для этого в тэг HEAD вашего сайта необходимо вставить следующий код:

<meta property="og:title" content="Заголовок" /> <meta property="og:description" content="Описание" /> <meta property="og:url" content="Ссылка на страницу" /> <meta property="og:image" content="Ссылка на картинку" /> <meta name="title" content="Заголовок" /> <meta name="description" content="Описание" /> <link rel="image_src" href="Ссылка на картинку" /> Существует ли возможность настройки стиля кнопок через CSS?

К сожалению, на данный момент можно использовать только предложенные стили. Если у Вас есть пожелания или предложения по этому вопросу, пришлите их нам на почту [email protected]

Существует ли возможность установки кнопок под прокотолом https/ssl?

Да, сервис PLUSO поддерживает эти протоколы.

Поддерживает ли сервис PLUSO английский язык?

Да, в коде кнопок укажите дополнительный параметр data-lang="en".Доступны русский (ru), украинский (ua), белорусский (by) и английский (en) языки.Если вам нужны другие языки напишите на [email protected]

Будет ли доступен сервис статистики отслеживания нажатий?

Да, статистика доступна по ссылке http://account.pluso.ru/share/stats.

Будут ли добавлены индивидуальные счетчики для каждой кнопки?

Мы запланировали разработку такого функционала на ближайшее время. На данный момент вы можете воспользоваться только общим счетчиком.

Совместим ли сервис PLUSO со ссылками, написанными кириллицей?

Да, ссылки, написанные кириллицей, корректно работают с нашим сервисом.

Планируется ли расширение дополнительных сервисов?

Да, мы постоянно работаем над расширением возможностей наших пользователей.

Если вы знаете, какой сервис необходимо добавить напишите на [email protected]

Существует ли возможность добавления нашего сервиса в кнопки PLUSO?

Да, такая возможность существует. Для этого необходимо прислать заявку нам на почту [email protected], мы обязательно ее рассмотрим.

account.pluso.ru