Кнопки поделиться с разных сервисов: Блок «Поделиться» — Технологии Яндекса – Лучшие сервисы социальных кнопок для сайта – ТОП-5

Кнопки поделиться для продвижения сайта

Сегодня мы поговорим о пользе кнопок поделиться для продвижения своего сайта.

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

Для чего нужны кнопки поделиться

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

Сложно ли заставить пользователей нажимать поделиться?

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

{jllikelock}Вот этот текст был скрыт социальным замком. В данном тексте может быть ссылка, картинка да и все что угодно.{/jllikelock} 

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

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

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

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

Привет, друзья! Сегодня статья будет очень объемной, но в то же время необычайно полезной. Почему я решила написать эту статью? Дело в том, что меня постоянно спрашивают, как получить больше поклонников в ту или иную социальную сеть? Почему мало кто подписывается на мою страницу на Фейсбук? Почему никто не фолловит компанию в Твиттер?

Почти у каждой компании сегодня есть сайт и даже блог. А у вас есть сайт? Надеюсь, что да! Если еще нет, то об этом нужно срочно задуматься! Ну с блогерами и обладателями свободных профессий (консультанты и фрилансеры) и так понятно, у них обязательно есть свой адрес в интернете — веб-сайт. Друзья, проблема в том, что мало какие сайты реально оптимизированы под социальные сети. Они могут производить кучу очень полезного и интересного контента, но их никто не видит и не слышит. SMO (social media optimization) — слышали такой термин? Так вот этим самым СМО (оптимизацией сайта под соц. сети) никто и не занимается. А зря! Существует огромное количество способов, о которых знают специалисты, чтобы создать, что говориться, движуху на веб-сайте. Простые манипуляции + наличие идей и креативности могут существенно помочь вашей компании в продвижении. Это я вам гарантирую!

Итак, ниже я расскажу вам, как установить в сайт официальные социальные кнопки и виджеты . Это будут только официальные кнопки и виджеты — никаких сервисов и плагинов!

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

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

Выберите соц. сеть, кнопки которой вы хотите установить:

Виды социальных кнопок

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

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

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

Сайт разработчиков на Фейсбук: https://developers.facebook.com/docs/plugins

Кнопка «Нравится»

Как установить?

Установить кнопочку «Нравится» очень просто! Вам нужно перейти на сайт разработчиков на Фейсбук (как мы договорились, ссылка находится в начале этого раздела). Прежде, чем вы приступите к созданию новых кнопок и виджетов, вам необходимо создать новое приложение в меню «Apps». Это нужно сделать обязательно, так как без этого Фейсбук не даст вам создавать кнопки!

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

Итак, чтобы установить кнопку «Нравится», на странице разработчиков, в левой колонне, кликните на «кнопка «Нравится» (сеть) «. Теперь вам необходимо выбрать из предложенных Фейсбук опций, чтобы получить именно такой виджет, который вы желаете.

1) Url to Like — введите ссылку на страницу, публикацию, лендинг, для которой вы создаете кнопку «Нравится». Это может быть любой тип контента, даже изображение или видео. Главное, чтобы вы указали ссылку, которой будут делиться пользователи.

2) Width — Если место для кнопки у вас ограничено, то вы можете указать ширину виджета в пикселях. Кнопки сами по себе небольшие, но если вы выбираете стандартные кнопки, то текст занимает достаточно много места. Об этом я расскажу в следующем пункте.

3) Layout — Вид виджета. Фейсбук предлагает на выбор 4 варианта : стандартный (как на картинке), с большим счетчиком, с маленьким счетчиком и просто кнопки. Здесь все зависит от вашего вкуса, стиля сайта, имеющегося места под кнопки, а также желании показывать счетчики (т. е. сколько человек нажали на кнопку).

4) Action Type — вид действий, т. е. какой тип кнопки вы желаете установить: «Нравится» или «Рекомендую». Подробно о различиях этих кнопок — и вообще виджетах на Фейсбук — я писала в моем .

5) Show friends’ faces — если вы желаете, чтобы кнопки показывали посетителю вашего сайта аватарки его друзей, кто уже кликнул на кнопку «Нравится», то поставьте галочку в этом пун

Добавляем кнопки «Поделиться» для сайта

Здравствуйте, дорогие читатели блога nazyrov.ru. Сегодня у меня довольно заезженная тема, а именно – кнопки «Поделиться» для сайта. Зачем сайту нужны такие кнопки, думаю догадаться не сложно. Если у вас интересный материал, то пользователи будут им активно делиться в социальных сетях, а это мощная и абсолютно бесплатная раскрутка.

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

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

Кнопки поделится в соц. сетях от самых популярных сервисов

[aspan]Кнопки от Яндекс[/aspan]. Яндекс предлагает интересный и очень удобный конструктор для генерирования блока «Поделиться». Можно указать на выбор абсолютно любые популярнейшие социальные сети, а затем скопировать готовый код. Код представляет собой простой скрипт.

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

[aspan]share42.com[/aspan] – тоже мощнейший конструктор, позволяющий выбрать интересующие кнопки и настроить внешний вид блока «Поделиться». Если к сайту подключить библиотеку jQuery, то к кнопкам можно добавить счетчик, который будет подсчитывать количtство поделившихся.

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

[aspan]share.pluso.ru[/aspan] – я довольно долгое время пользовался именно этими кнопками. Кнопки «Поделиться» от Pluso отлично настраиваются под дизайн сайта. Можно выбрать любые интересующие соц. сети и понравившийся дизайн кнопок.

[aspan]uptolike.ru[/aspan] – позволяет сгенерировать блок с кнопками «Поделиться», при этом блок будет адаптивным для мобильных устройств. Внешний вид и цвет кнопок тоже хорошо настраивается в конструкторе.

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

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

И вовсе не стоит пугаться этого страшного слова. Добавить кнопку «Поделиться» при помощи API сможет любой, просто повторяйте действия, которые я опишу.

Кнопка «Поделиться» ВКонтакте

Для того, чтобы сгенерировать кнопку поделиться ВКонтакте для своего сайта, перейдите на [aspan]страницу виджетов ВКонтакте[/aspan].

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

Теперь, вам необходимо перейти по ссылке внизу страницы к подробной [aspan]документации виджета[/aspan], и подключить виджет согласно инструкции.

Facebook кнопка «Поделиться»

Кнопка «Поделиться» на фейсбук делается аналогичным образом. Для этого перейдите на [aspan]страницу конструктора[/aspan], в списке различных кнопок найдите кнопку «Поделиться» и выберете значение «Веб-платформа».

В появившимся конструкторе можете настроить внешний вид кнопки и получить код.

Код будет состоять из двух частей. Первую часть необходимо вставить после открывающего тега <body>. Этим кодом вы включаете SDK для JavaScript.

Вторую часть кода необходимо вставить в то место, где должна выводиться кнопка «Поделиться» на Facebook.

Делаем кнопку «Поделиться» в одноклассниках

Кнопка поделиться в одноклассниках вставляется так же при помощи небольшого куска кода. Чтобы получить этот код, перейдите на страницу [aspan]социальных виджетов одноклассников[/aspan], и в конструкторе настройте кнопку «Поделиться».

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

Вот мы и рассмотрели все наиболее популярные способы вставки кнопок «Поделиться» для сайта. Выбирайте тот способ, который больше всего подходит вам.

SeoTable | Кнопки "Поделиться"

Кнопки "Поделиться" используются для передачи информации о странице в ленту соответствующей социальной сети. Следует понимать, что Ваш пост в ленте увидят не все друзья. Все социальные сети по своим алгоритмам принимают решение, что именно показывать в ленте. В среднем порядка 10-15% друзей увидят Вам пост.

Алгоритмы везде разные, а логика одинаковая - показывать только интересные (данному пользователю) посты:

- если Вы увлекаетесь котиками и Ваши друзья увлекаются котиками - то Ваш пост о котиках увидят под 90% друзей

 +  = 90%

- если Ваш пост о собачках, а Ваши друзья увлекаются котиками - то Ваш пост о собачках увидят 5% друзей

  +  = 5%

Котики, они лучше 🙂

Кроме комментария пользователя типа "Хорошо-то как" в социальную сеть передается:  название страницы,  url страницы, описание страницы, картинка 

Для того, что бы передать пост с сайта в социальные сети, нам нужны две вещи:

а) скрипт, который будет показывать кнопки и передавать информацию

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

Наиболее популярные сервисы, которые предоставляют скритпы кнопок "Поделиться"

Яндекс, смотреть здесь https://tech.yandex.ru/share/
Плюсо, смотреть здесь Pluso.ru
Сервис http://share42.com/ru

Сервис share42 наиболее удобен:
- сервис отдает Вам исходники своих скриптов для размещения на хостинге, т.е. скрипт стартует с Вашего сайта
- вариант "вертикальный плавающий столбец" работает сразу
- для Joomla удобно выбрать позицию debug - кнопки разместятся за пределами шаблона сайта

В документации можно посмотреть настройки для работы кнопок.

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

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

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

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

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

Некоторые соцсети (например Твиттер) могут обрабатывать большие строки некорректно, поэтому длина строки будет зависеть от соцсети.

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

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

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

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

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

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

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

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

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

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

 

Следует обратить внимание, что в настоящее время социальные сети берут настройки не из атрибутов, а из мета тэгов стандарта OpenGraph - это стандарт микроразметки на сайте, почитать можно здесь

Для наших целей (корректно передать информацию в социальные сети и отобразить ее в ленте/хронике) нужно четыре основных тэга:

- название url

- название заметки/поста

- описание поста

- картинка

Без заполненных метатэгов стандарта Open Graph каждая социальная сеть формирует эти данные по разному (по своему внутреннему алгоритму).

<meta property="og:url" content="Адрес сайта"/> Показ в посте адреса сайта
<meta property="og:title" content="Наименование"/> Показ в посте наименования заметки (при отсутствии тэга иногда берется из Title)
<meta property="og:description" content="Описание"/> Описание заметки (при отсутствии тэга иногда берется из Description)
<meta property="og:image" content="Расположение картинки"> - обязательно с полным путем с http Адрес, где находится картинка (при отсутствии тэга каждая социальная сеть выбирает картинку для показа по разному, иногда первая по списку картинка в коде страницы)

 Для facebook есть специальный раздел, где можно проверить, как это все работает на странице - https://developers.facebook.com/tools/debug/, вводите адрес страницы своего сайта и смотрите, как эту страницу видит социальная сеть.

 

Заполняем все 4 метатэга в разделе head, смотрим на результат

FACEBOOK

VKONTAKTE

 МОЙ МИР

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

Конечно, мы не будем все это делать вручную, для своей CMS ищем плагин, который сделает большую часть работы (перепишет title / description в новые метатэги и т.д.)

И обязательно проверяйте (посмотреть итоговый код страницы) качество работы плагина, который Вы установили для Open Graph. Метатэги правильно называются <meta property="og:url" content="Адрес сайта"/>

некоторые плагины неправильно генерируют метатэги и делают их вида <meta name="og:url" content="Адрес сайта"/>

Часть соцсетей и так будет работать на этих кривых метатэгах, но FACEBOOK не будет их учитывать.

Примечание: в Одноклассниках можно в своей ленте поделиться одной и той же страницей ТОЛЬКО 1 раз. Вот такое ограничение. непонятно зачем. Т.е. понятно - что бы рекламой не забивали ленту, но можно было сделать 1 раз в неделю, например.

При повторной попытке Вы увидите:

И да, у Google+ Twitter свои метатэги (добавляем к CMS другие плагины). Стандартные метатэги OpenGraph учитываться не будут.

Google+

1 <meta itemprop="name" content="Название сайта"/>
2 <meta itemprop="description" content="Описание сайта"/>
3 <meta itemprop="image" content="https://website.com/image.jpg"/>



Twitter

1 <meta name="twitter:card" content="summary"/> 
2 <meta name="twitter:site" content="Название сайта"/>
3 <meta name="twitter:title" content="Название страницы">
4 <meta name="twitter:description" content="Описание"/>
5 <meta name="twitter:creator" content="автор"/>
6 <meta name="twitter:image:src" content="https://website.com/image.jpg"/>
7 <meta name="twitter:domain" content="website.com"/>


Для Instagram не существует возможности "поделиться" с сайта. В Instagram загружаются фото, сделанные сам пользователем. Но можно установить у себя на сайте виджет вида "Мы в Инстаграм", что посетители сайта могли сразу видеть Вашу представленность в данной социальной сети.

Вот здесь можно прочитать подробнее и как реализовать для ленивых 🙂
http://habrahabr.ru/post/223739/ Пишем Instagram виджет для сайта.
http://inwidget.ru/ Instagram виджет для сайта бесплатно. Inwidget.

Как добавить meta property на свой сайт?

Для сайта на HTML - вручную. Для сайтов с использованием CMS - через плагины.

Что должен "уметь" хороший и правильный плагин?

- поддерживать добавление метатэгов для всех типов социальных сетей (не только OPEN GRAPH)
  - небольшой плюс к SEO - при наличии метатэгов для Google+, сайт будет НЕМНОГО лучше показываться в выдаче Google
- иметь основные настройки для всего плагина (точнее для всего сайта)
  - по умолчанию брать заголовок их title
  - по умолчанию брать описание из description
  - по умолчанию использовать указанную картинку для всех страниц сайта
  - по умолчанию остальные тэги
- иметь возможность все вышеперечисленное редактировать у каждой страницы

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

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

 

 

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *