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







Здравствуйте уважаемый посетитель  моего блога  !

  • Сегодня речь пойдёт о социальных кнопках и как разместить их на своём блоге или одностраничном сайте.

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

Я испробовала на своём сайте несколько вариантов таких кнопок, это сервис и https://share42.com/ и плагин Social Share Buttons  https://wordpress.org/extend/plugins/share-buttons/. Но всё время мне что то не нравилось:

  • Кнопки от сервиса Share 42 не на все блоги почему то устанавливается, да и кнопки там какие то мутные
  • А в плагине  Social Share почему то не все кнопки работали, когда я кликала всё было нормально, а знакомые писали что кнопки не работают

Вот поэтому я всё таки остановила свой выбор на сервисе  AddThis   https://www.addthis.com/.И не только из-за этого, сами кнопочки работают безотказно и грузятся намного быстрее остальных. Их легко установить как на WP блог , так и на одностраничный сайт или виртуальную открытку.

А теперь к делу. Я сначала расскажу как поставить кнопки на одностраничник, а потом уже как это сделать на своём Вордпресс блоге.Заходим на сайт https://www.addthis.com/

Сначала выбираем дизайн кнопок, крупные или помельче, и нажимаем на Большую оранжевую кнопку

addthis

 

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

Дальше, нам надо скопировать код для того чтобы поставить кнопки на сайт

 

addthis3

 

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

 [stextbox id="grey" shadow="true"]<table width="300" border="0" cellspacing="1" cellpadding="20" align="center" bgcolor="#ffffff"> <tr><td>[/stextbox]

 

(на схеме он выделен — увеличение картинки по клику):

 

addthis4

 

Теперь ставим кнопки на свой WordPress блог, для этого нам даже не обязательно заходить на сайт этих кнопок. Достаточно набрать в нашей админке (в разделе Плагины, Установить новый)  AddThis. А потом просто активировать его из своей админки, как поставить плагин на сайт смотрите здесь. Далее заходим в Параметры, находим там наш плагин, кликаем на него и идём настраивать






 

addthis6

 

И перед нами откроется такая картина. Нам предлагают опять таки зарегестрироваться Красные стрелки (можете это сделать) а можете нажать Дополнительные параметры Зелёная стрелка. И выбрать как будут выглядеть кнопки над Вашими постами

 

addthis7

 

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

addthis8

И точно так же поступаем с нижними кнопками, то есть нажимаем Дополнительные параметры и выбираем вид кнопок. И нажимаем в самом низу «Сохранить изменения». Обновляем страницу блога и видим выбранные нами кнопочки

addthis9

 

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

addthis10

 

Теперь посмотрим как выбрать ещё социальные сервисы кроме тех, которые отображаются. Идём в статью, нажимаем на оранжевую кнопку

 

addthis11

Появляется выпадающее меню, в котором мы можем выбрать ещё соцсети или социальные закладки. Но это ещё не всё! Можно нажать ещё раз на оранжевую иконку под названием ЕЩЁ, уже в этом окне и сервис выдаст ещё кучу соцсетей и соцзакладок

addthis12

А ещё после установки плагина AddThis в разделе админки блога Виджеты, появляется новый виджет, который так же можно установить в сайдбаре блога и точно так же выбрать вид кнопок

addthis13

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

addthis14

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

addthis15

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

addthis16

После нажатия на эту кнопку, мы попадаем в магазин расширений Гугл Хром. Нужно нажать кнопочку «установить», после этого расширение установится в браузере. И Вы сможете точно так же пользоваться им, как и на своём сайте. То есть нажмёте на кнопочку на любом интернет ресурсе и сообщение о нём пойдёт в выбранную Вами соцсеть

addthis17

Как установить расширение в Гугл Хром Вы можете посмотреть в видеоуроке, на примере установки плагина для браузера RDS бар.

Итак, из этой статьи Вы узнали

  • Как легко и быстро поставить соцкнопки на одностраничный сайт
  • И как так же без заморочек установить такие же кнопки на свой блог

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

А какими сервисами для соцкнопок пользуетесь Вы? И какие у Вас есть вопросы по интернет технологиям для Вашего бизнеса.

Вы можете прочитать другие  статьи,
для этого воспользуйтесь Картой сайта.
А также получать новые статьи прямо на Ваш почтовый ящик.
Введите свой E-mаil:

 


С Уважением, Татьяна Чиронова   






  

Сохраните пост к себе на стенку в соцсети



 


А здесь можно публиковать анонсы постов по теме:  


 










На ту же тему
Обсуждение: 15 комментариев
  1. elenamerts:

    Я наверное, совсем тупая:( Так долго разбиралась в том, что Вы написали и устанавливала все эти кнопочки. И не всё получилось так, как хотелось. Вот как, например сделать так, чтобы нижние кнопки отображались только тогда, когда статья уже развернута? У меня они теперь торчат сразу после анонса. И на главной странице получилась разноцветная смесь.

    • Татьяна Чиронова:

      Елена извините, что долго не отвечала, напряжённое время было. Вам надо просто зайти Параметры AddThis Расширенные (или Передовые, это как браузер переведёт) и убрать галочку из первого пункта Домашняя страница.
      И вообще не бойтесь в этом разделе поэксперементировать, если что, то просто переустановите плагин, ведь на блог в целом он никак не повлияет.

  2. NataLia:

    Спасибо, Татьяна!

  3. Алексей:

    А я вот ввел в админке AddThis и плагин на аглицком установился. Не подскажите, как на русском поставить? (Внутри плагина пробовал сменить язык — не помогло). В принципе, с аглицким проблем нет, но все же удобнее

  4. Marina:

    Танечка- как же просто ты все объясняешь!!!!!
    Завтра поменяю немного кнопки по твоим урокам- и как всегда- передам дальше для «чайников»

    СПАСИБО!!!!!!!!!!

  5. Людмила и Владимир:

    Спасибо! Опробуем! А то открыток уже куча, а кнопки никак не установим)))

  6. Елена:

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

    • Татьяна Чиронова:

      Спасибо Лена!
      Я поэтому и написала такой подробный пост, что мучений приняла не мало от этих соцкнопок в своё время.

  7. Юлия:

    C виджетами я разобралась, мне он нравиться, жалко менять, но наверное придется.

    Все бесплатные шаблоны глючат или ссылок там полно зашифрованых.

    • Татьяна Чиронова:

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

  8. Леон:

    Спасибо за взаимность

  9. Юлия:

    Таня, спасибо, очень подробно и понятно.

    Мне наверное надо свою тему или менять или переустанавливать, потому что при настройке кнопки появляются и вместе с ними в шапке сайта появляется html код.

    • Татьяна Чиронова:

      Да Юля, я пробовла твой шаблон на тестовом сайте, и даже не смогла поставить туда виджеты, он глючный какой то

  10. Марина:

    Спасибо,Танечка! Я все хотела поставить соц.кнопки на открытку.Но ничего не находила пошагово.А здесь просто классный урок. Теперь я не только поставлю на открытку,но и в виджете.

Поделитесь своим мнением
Для оформления сообщений Вы можете использовать следующие тэги:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

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

Интернет технологии для вас © 2019 ·   Наверх