WordPress. Самые лучшие кнопки социальных сетей

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

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

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

Но, во-первых, все было для блогов на Blogger/Blogspot, например отличная статья Кнопки социальных сетей для Blogger. Во-вторых, сегодня мне пришлось ставить кнопки на WordPress, и я была немного удивлена тем, что на большинстве блогов описаны очень сложные процессы установки, выкладка целых блоков кода кнопок, редактирование шаблонов и ещё много всего, тогда как для WordPress существует огромное множество всевозможных плагинов. И не могла я поверить в то, что до сих пор никто не смог реализовать кнопки социальные сетей в одном плагине.

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

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

  1. Кнопка Tweet от Twitter
  2. Кнопка Like (мне нравится/поделиться) Facebook
  3. Кнопка Нравится/поделиться от Вконтакте
  4. Кнопка В Мой мир от Mail
  5. Кнопка Класс! от Одноклассников

Встречайте, решение найдено.

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

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

Конечно, можно потратить целый день, прочитать кучу блогов и установить каждую такую кнопку в отдельности, а можно просто узнать заветное слово Social Share Buttons.

Что такое Social Share Buttons

Social Share Buttons – это обычный плагин для WordPress. И что самое приятное, придуман он русским разработчиком. Этим и объясняется то, что в этом плагине только самые популярные социальные сети именно русскоговорящего интернета. Мне очень понравилась эта разработка, и, естественно, что я не могла не поделиться своей находкой с вами, ведь меня читают не только пользователи Blogger, но и блоггеры, чьи блоги расположены на других платформах, и на WordPress в том числе.

Личный блог создателя плагина находится по этому адресу (ссылка на статью о последней версии плагина 2.2, от 5 декабря 2010г.), а сам плагин можно скачать на официальном сайте WordPress. Так же, кто пользуется WordPress, знают, что плагины, которые находятся на официальном сайте WordPress, доступны в поиске и установке, непосредственно, из админ-панели WordPress. Все телодвижения сводятся к нажиманию на кнопочки, и никакой правки кода.

Итак, какие действия, чтобы установить плагин Social Share Buttons.

Заходим в админку WordPress, переходим в Плагины – Добавить новый. В строку поиска вводим Social Share Buttons, и, лично у меня, он первым был в списке найденных плагинов, жмем ссылку Установить

Social Share Buttons

После установки, ссылку Активировать плагин

Установка плагина

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

  1. Скачать плагин на свой компьютер с официального сайта WordPress по этой ссылке.
  2. Через FTP или специальную панель хостера загрузить архив (и потом его распаковать или распаковать на своем компьютере и загрузить файлы на хостинг) в папку plugins. Полный путь: ваш_сайт/www/wp-content/plugins.
  3. В админ-панели WordPress на вкладке Плагины появится  Social Share Buttons, и уже там его активировать.

Теперь активированный плагин необходимо настроить. В меню Параметры появится ссылка Share Buttons, нажимаем и переходим в настройки плагина. На что необходимо обратить внимание в первую очередь.

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

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

Установка кнопок

На следующем шаге вы можете указать, какие кнопки показывать, а какие нет. Я оставила все кнопки, именно это мне и было нужно.

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

Хоть это и не обязательная настройка, но рекомендую указать свой ник в Твитере в пункте Другие настройки.

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

Дополнительный код кнопок

т.е. под блоком горизонтальных кнопок, будут так же и такие кнопки. Это уже на усмотрение каждого.

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

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

API код ВКонтакте

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

Также, ещё хотелось сказать, что в разных темах (шаблонах) у меня кнопки немного скакали, и была необходимость немного их ужать по ширине. В админ-панели WordPress можно отредактировать любой плагин. Мне же было проще залезть, непосредственно, через ftp в файл share-buttons-user.css, который находится в папке css. Возможно, вам вообще не потребуется ничего подгонять под дизайн своего блога.

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

UPD от 16 мая. На блоге появилась статья, как сделать точно также горизонтальные кнопки социальных сетей на Blogger.

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

Удачного вам развития и хороших выходных.


Запись опубликована автором в рубрике Как создавать сайты с метками , , .

WordPress. Самые лучшие кнопки социальных сетей: 92 комментария

  1. Konstantin Shavlov

    Я пользовался скриптом от addthis.com — несколько строчек кода в нужном месте шаблона, и вуаля — нет плагина, который занимает место. Да и выглядит вполне так ничего =)

  2. DgoKer

    Я поставил себе эти кнопочки, но не проверил. Проверял только лайки. Теперь вот решил проверить и как оказалось, работает только кнопка вконтакте, не подскажешь в чем проблема. Можешь посмотреть на моем блоге. На остальных кнопках ссылки вида url#twitter

  3. DgoKer

    Это второй вариант кнопок, эти рабочие их и оставил. Остальные не работают. Я решил не мучатся, эти тоже нормально.

  4. Руслан

    Сам долгое время искал подобный плагин. Ди и перепробовал несколько других вариантов.

    Остановился плагине SocialButtons. Понравился он мне тем, что помимо кнопок добаления статьи в социалки, ниже ещё можно поставить ряд кнопоку для добавления в друзья в этих сервисах.

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

  5. Kuzuxa

    О спасибо Катюша.А то у меня на блогах стоят только Твиттер и Facebook, а щас пойду этот плагинчик установлю.Чтоб и другие ещё были кнопочки.Спасибо за наводку

  6. Nikita

    Установил плагин и к себе на блог — выглядит неплохо. Надо бы красивости придать только, да какую-нидь надпись для привлечения внимания придумать: http://buzzman.ru/sneg-na-saite/

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

  7. Nikita

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

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

  8. SEO-Дилетант'ка

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

  9. Nomad

    Хороший виджет, но выбор кнопок странный. Ни на одном сайте я не видел нажатую кнопку «Одноклассники» просто потому что сервис не популярный. Зато здесь почему то нет единственного конкурента твиттера — Buzz, кнопка которого довольно популярна.

  10. SEO-Дилетант'ка

    Не вижу ничего странного в выборе кнопок. Выбраны именно те, которые имеют горизонтальный счетчик. Одноклассники тоже популярны, но все зависит от тематики. На seo блогах может и не популярны, на каких то других ситуация обратная. А что касается Buzz — вы первый человек, который говорит, что он популярный… В общем, сколько людей, столько и мнений.

  11. Дмитрий

    Уважаемая Екатерина. Поставил себе такой плагин. Супер. Но есть одно НО! В этом наборе кнопка «Класс» не рабочая какая то получилась! Из-за чего это может быть! Она нажимается, но никаких изменений нету. мой блог dimadrug.ru

  12. SEO-Дилетант'ка

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

  13. Denis Olin

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

  14. SEO-Дилетант'ка

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

  15. Kisalondon

    У меня после нажатия кнопки Класс выдает сообщение: «Ошибка обработки данных ресурса.» как можно это исправить?

  16. SEO-Дилетант'ка

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

  17. Ирина

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

  18. SEO-Дилетант'ка

    Да, что-то я тоже не нашла настроек, как удалить логотип. может проще тогда переустановить плагин. Или можете обратиться к разработчику. Ссылка не него есть в статье.

  19. Наташа Кузнецова

    Привет! Спасибо за инструкцию, супер панелька с кнопочками, НО у меня проблема с кнопочкой «одноклассники»- счетчик не работает, подскажи пожалуйста что делать? ! Ответь пожалуйста на e-mail, спасибочки!

  20. Наталья

    Все сделала, как написано. Не понятно как сделать так как у вас, в отдельном блоке чтобы было и в таком виде. Вы используете еще какой-то плагин? Как добиться такого результата?

  21. Tentopi00

    Добрый день , хозяйка блога!Очень хотелось бы знаить Ваше имя. ХОЧУ ОТ ВСЕЙ ДУШИ ПОБЛАГОДАРИТЬ ЗА ОЧЕНЬ ПОНЯТНЫЕ СОВЕТЫ. Я НОВИЧОК, САЙТ веду недавно, и благодаря Вам сама поставила первые плагины в своей жизни- социальные кнопки. теперь буду следить за Вашими статьями и с удовольствием получать сообщения об обновлениях в блоге.

  22. Михаил Бондаренко

    Большое Вам спасибо! Очень пригодилась ваша статья! Знаю одного куркуля, который продает блогерам слегка измененный этот плагин за 18$. Код API не пригодился т.к в последней версии плагина все работает. Во всяком случае у меня.

  23. Надежда Хачатурова

    Катя, не можете подсказать, что нужно настроить в кнопке «лайк» от фейсбука, чтобы она не выхватывала с собой в фейсбук картинки хаотично: от баннер партнерский кто-нибудь везет в профиле, то счетчик подписчиков. Я сразу и не обращала внимания.

  24. SEO-Дилетант'ка

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

  25. Надежда Хачатурова

    Какие стрелочки на «Мне нравится»? Только что здесь нажала — только окошко для комментария. А на фейсбуке у меня появляется какая — нибудь картинка. В данный момент это картинка Вашей статьи — W. А у меня все подряд, и счетчики, и баннеры. Может, вообще удалить?

  26. SEO-Дилетант'ка

    Надежда, давайте разбираться. Я так понимаю, мы говорим о разных кнопках. То, что вы сейчас нажали, это вы отправили через Дискус.
    Я так понимаю, если делается именно Like, то да, влиять на картинку не получается. А вот через кнопку Поделиться на картинки можно повлиять.

  27. Надежда Хачатурова

    Вот у Вас стоит кнопочка «мне нравится». Именно на такой у меня косяки. Раньше я даже не задумывалась, как она работает, пока не увидела, что моя статья катится по главной со счетчиком подписчиков. «Наехала» на исполнителя, объясняла про стрелочки, а потом однажды сама нажала «мне нравится» на своем блоге:)) — на фейсбуке был партнерский баннер как изображение к статье.

  28. SEO-Дилетант'ка

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

  29. Элеонора

    Извиняюсь за не грамотность, может Вы мне подскажете, а как в этом плагине удалить логотип сайта? А то плагин ко всем статьям одну только картинку предлагает, вместо иконки.  🙁  Заранее спасибо

  30. Никита

    Интересно еще, существует ли плагин для установки кнопок «Поделись статьей в социальных сетях», какие стоят у вас после поста. Мне кажется, они более полезны.

  31. Михаил

    Доброго времени суток! Установил плагин на блог, активировал. Иду в настройки, а он выдает ошибку «У вас недостаточно прав для доступа к данной странице»??? Ничего не понял! К тому же из семи кнопок работают только три.

  32. SEO-Дилетант'ка

     Посмотрите права на папку с плагином. И как у вас вообще стали работать три кнопки, если вас плагин не пускает в настройки? Все должно работать после того, как вы сделаете все настройки в плагине.

  33. Михаил

    ДВС! Не знаю как он работал, я его активировал он и заработал, на половину:) Я решил проблему кардинально — заново скачал и перезалил. Теперь все в норме. Спасибо за статью!

  34. FanniFen

    Катя, приветствую Вас.
    Такой вопрос, может, Вы подскажете:
    кнопки «мне нравится» (контакт, мэйл, фейсбук), которые столбиком располагаются, у меня они вплотную друг к другу, между ними нет промежутка. Как это исправить?

  35. FanniFen

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

  36. Fuck

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

  37. Андрей

    Спасибо Большое! Очень признателен за инфу! 
    Когда столкнулся с необходимостью, сразу закралась мысль, то есть наверное плагины 🙂

  38. Go2Load

    Опечатка в тексте:
    под любые нужны

    Над текстом: «Что такое Social Share Buttons.»

    P.S. Было бы удобнее уведомить про опечатку при помощи CTRL + Enter 🙂

  39. Сергій Філіппов

    А что писать в поле «Facebook API ID: You can register your «api_id» on this link» и чё делать, зайдя на этот линк?
    А вообзе плагин очень хороший. Большое человеческое спасибо!

  40. SEO-Дилетант'ка

     Когда я устанавливала этот плагин, такого не было. Вы устанавливаете более свежую версию? Я вообще не сталкивалась с тем, чтобы для Facebook нужен был API ID.

  41. Сергей

    Огромное спасибо за отличную подсказку о плагине соц.кнопок. Всё работает.

  42. Ruslang84

    Спасибо огроменное! Все получилось! На других блогах только куча рекомендаций по редактированию кода. http://artizba.info

  43. Ynikym89

    Здравствуйте! Скажите пожалуйста как можно сделать такой блок из подписчиков вконтакте как у вас снизу «Мы ВКонтакте».

  44. SEO-Дилетант'ка

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

  45. Андрей

    Спасибо за статью! Наконец то нашел то ,что мне надо .Все просто и доступно.Установил все себе ,доволен .Заходите смотрите 
    http://fatyanoff.ru/

  46. Alex

    Спасибо за подсказку!
    Действительно хороший плагин!
    В качестве благодарности — покликал по рекламе! 😉

  47. Daria Amosova

    О, спасибо большое! Только обустраиваю stand-alone блог и сложно пока сориентироваться где что искать, а тут все что надо и очень понятно объяснили

  48. Ирина

    Какой замечательный плагин! Я обычно вставляю коды с кнопками социальных сетей непосредственно в шаблон, а тут думаю, сэкономлю время, поставлю временно плагин, а подходящий всё не находился 🙂 спасибо за обзор этого плагина

  49. Валерий

    Установил плагин, активировал, все кнопки появились на блоге.
    Но! В консоли, в разделе Параметры, ссылка Share Buttons не появилась!
    В чём дело и как настроить плагин, все кновки мне не нужны и вид кнопок я хотел бы изменить и . д.

  50. Евгений

    А как в FB свой API получить? По ссылке перешёл и ничего непонятно…

  51. Алёна

     Подскажите а что у3 вас за плагин стоит. Мне очень понравился последний плюсик»добавить в закладки»

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

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