Как вставить социальные кнопки в статью | How to insert social buttons in article

 Несколько раз пробовал вставить социальные кнопки в само сообщение, но инструкции из Интернета не срабатывали. Нашел все-таки решение и спешу поделиться с Вами.

Для начала отключите встроенную в Blogger кнопку публикации сообщения в Google+. Тем более что она осталась теперь одна (раньше было 4 или 5).

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

Сохранить изменения.

Теперь расскажу, как вставить социальные кнопки  после текста статьи:

1. Делаем резервную копию шаблона Вашего блога.

2. Заходим в настройки блога >> Шаблон >> Изменить HTML.

3. Ставим курсор внутри рамки с кодом шаблона >> нажимаем Ctrl+F.

4. В строку поиска вставляем: <b:include data='post' name='post'/>

5. Нажимаем клавишу Enter и в шаблоне подсветится нужный нам код:

6. Ставим курсор в конец строки >> нажимаем Enter >> подводим курсор под начало строки <b:include.... и вставляем код выбранных Вами социальных кнопок.

Нажимаем Просмотр шаблона. Если кнопки появились, то сохраняем шаблон.

Вариантов внешнего вида кнопок много. Например, на сайте http://share.pluso.ru/ можно выбрать количество социальных сетей и закладок, форму, вид, фон кнопок.

Если же Вам некогда или просто лень :) заниматься выбором кнопочек, то я настроила для Вас 2 варианта. Можете взять любой код на выбор.

1. Квадратные  социальные кнопки без фона в две строки:

  

Код таких кнопок: 

<center><script type="text/javascript">(function() {

          if (window.pluso)if (typeof window.pluso.start == "function") return;

          var d = document, s = d.createElement('script'), g = 'getElementsByTagName';

          s.type = 'text/javascript'; s.charset='UTF-8'; s.async = true;

          s.src = ('https:' == window.location.protocol ? 'https' : 'http')  + '://share.pluso.ru/pluso-like.js';

          var h=d[g]('head')[0] || d[g]('body')[0];

          h.appendChild(s);

          })();</script>

        <div class="pluso" data-options="medium,square,multiline,horizontal,nocounter,theme=03" data-services="vkontakte,odnoklassniki,moimir,vkrugu,moikrug,yandex,facebook,twitter,google,blogger,liveinternet,livejournal,bookmark,yazakladki,googlebookmark,yahoo,bobrdobr,email,print" data-background="transparent"></div></center>

2.  Или вот такие круглые соцкнопки без фона:

Код этих кнопок: 

<center><script type="text/javascript">(function() {

          if (window.pluso)if (typeof window.pluso.start == "function") return;

          var d = document, s = d.createElement('script'), g = 'getElementsByTagName';

          s.type = 'text/javascript'; s.charset='UTF-8'; s.async = true;

          s.src = ('https:' == window.location.protocol ? 'https' : 'http')  + '://share.pluso.ru/pluso-like.js';

          var h=d[g]('head')[0] || d[g]('body')[0];

          h.appendChild(s);

          })();</script>

        <div class="pluso" data-options="big,round,multiline,horizontal,nocounter,theme=03" data-services="vkontakte,odnoklassniki,moimir,vkrugu,moikrug,yandex,facebook,twitter,google,blogger,liveinternet,livejournal,bookmark,yazakladki,googlebookmark,yahoo,bobrdobr,email,print" data-background="transparent"></div></center>

 Обратите внимание, что для выравнивания кнопок по центру я добавил в коды параметры <center>......</center>. Если будете настраивать свой вариант кнопок от pluso (или других разработчиков), то можете сами добавить этот HTML код.

!!! Для того, чтобы социальные кнопки читатель видел не на Главной странице блога (после анонсов статей), а после прочтения всего поста, нужно добавить условие: 
      
<b:if cond='data:blog.pageType == &quot;item&quot;'> код кнопок </b:if>   
Первая часть кода этого условия вставляется также, как и сами кнопки - см. выше шаги 4-6. Затем код выбранных Вами социальных кнопок. И заключительная часть </b:if>.