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

Какие полезности получим мы?

1) Увеличение количества посетителей на свой блог.

2) Улучшение индексации и ПФ (поисковые системы очень хорошо относятся к переходам из социальных сетей и анонсов ваших статей там).

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

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

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

2) Вконтакте — Наиболее динамично развивающаяся социальная сеть в Рунете. Присутствие ее на вашем блоге обязательно.

3) Google +1 — сравнительно молодая сеть, но успевшая удачно себя зарекомендовать. Многие эксперименты показали ее эффективность при использовании.

4) Твиттер – про эту сеть слышали практически все. Система микроблоггинга с каждым годом становится все более популярной и трафик оттуда можно получить весьма хороший.

Разберемся с технической частью и установим коды всех 4-х систем у себя на блоге:

Скрипт Facebook

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

настройки скрипта кнопки от Facebook

Готовый код для использования:

<div data-send="false" data-layout="button_count" data-width="450" data-show-faces="false"></div>
<div id="fb-root"></div><script>(function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) {return;} js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/ru_RU/all.js#xfbml=1"; fjs.parentNode.insertBefore(js, fjs);}(document, \'script\', \'facebook-jssdk\'));</script>

Скрипт Вконтакте

На этой странице сгенерируйте код. В принципе все просто, можно ничего не трогать в настройках которые предлагает нам система, а просто взять этот код и вставить себе на блог. Единственный момент – лично мне не нравится стандартная надпись – «Сохранить». У себя на блоге я использую надпись – «Мне нравится», но это уже на ваше усмотрение.

настройка скрипта кнопки от Вконтакте

Готовый код для использования:

<!-- Put this script tag to the <head> of your page -->
<script charset="windows-1251" type="text/javascript" src="http://vk.com/js/api/share.js?11"></script><!-- Put this script tag to the place, where the Share button will be --><script type="text/javascript">// <![CDATA[
document.write(VK.Share.button(false,{type: "round", text: "Мне нравится"}));
// ]]></script>

Скрипт Google +1.

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

скрипт кнопки от Google +1

Готовый код для использования:

<!-- Place this tag where you want the +1 button to render. -->
<div class="g-plusone"></div>
<!-- Place this tag after the last +1 button tag. -->
<script type="text/javascript">// <![CDATA[
window.___gcfg = {lang: 'ru'}; (function() { var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true; po.src = 'https://apis.google.com/js/plusone.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); })();
// ]]></script>

Скрипт системы микроблоггинга Твиттер.

кнопка Twitter

настройка кнопки Twitter

Сделать кнопку ретвитов вы можете на этой странице. Ничего сложного в конфигурации нет, на скриншоте все указано, только в строке — с помощью (Параметры) – укажите свое имя пользователя.

Готовый код для использования:

<a class="twitter-share-button" href="https://twitter.com/share" data-via="seofiveru" data-lang="ru">Твитнуть</a>
<script type="text/javascript">// <![CDATA[
!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");
// ]]></script>

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

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

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

Готовый код для использования:

<script charset="utf-8" type="text/javascript" src="//yandex.st/share/share.js"></script>
<div class="yashare-auto-init" data-yasharel10n="ru" data-yasharetype="button" data-yasharequickservices="yaru,vkontakte,facebook,twitter,odnoklassniki,moimir"></div>

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

Для вставки кода придется немного подкорректировать шаблон вашей темы. В консоле вашего блога, перейдите на вкладку Внешний вид – Редактор и откройте файл – «Одна запись» (single.php). В этом файле вставьте код социальных сетей, обычно после строчки:

<?php the_content(''); ?>

файл single.php

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