Блог
Анны Фёдоровой Как зарабатывать в интернете и на своём блоге?

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

2014.05.28
Автор:

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

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

как установить кнопки социальных сетей на блог

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

Зачем они нужны?

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

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

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

Первый способ — установка кнопок социальных сетей без плагинов вручную.

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

Кнопка Мне нравится от ВКонтакте

Для начала авторизуйтесь в контакте. Вводим в адресную строку  http://vk.com/dev/Like и попадаем на страницу. В поле «Сайт/приложение» выбираем «Подключить новый сайт», и заполняем поля, так же когда мы устанавливали  виджет комментариев Вконтакте. Выбираем один из вариантов внешнего вида кнопок, высоту и название.

Полученный код кнопки социальной сети Вконтакте, который вы увидите ниже — нужно вставить в шаблон (тему) вашего блога.

как установить кнопки соц.сетей на сайт

Идём в админку и нажимаем «Внешний вид» — «Редактор» и открываем header.php. Первую часть кода вставляем прямо перед закрывающим тегом </head>. А вторую часть кода в файл single.php после строчки <?php the_content ('Читать запись полностью &raquo;'); ?>. Если вы такую не найдёте – ищите что-нибудь подобное.

Кнопка от Twitter

Переходим сюда — https://about.twitter.com/resources/buttons. Первым делом в правом верхнем углу меняем английский язык на родной.

как установить кнопки социальных сетей на блог

Выбираем кнопку и разбираемся с настройками. Первые две настройки оставляем по умолчанию. Счётчик рекомендую тоже оставить. В графе «с помощью» можно ввести свой логин в твитере. И в конце выбираем язык «Русский». Копируем код и вставляем в single.php в тоже место, куда вставляли кнопку Вконтакте.

Кнопка от Facebook

Переходим сюда https://developers.facebook.com/docs/plugins/like-button. Здесь так же выбираем нужное оформление, думаю разберётесь. При выборе параметра, внизу увидите как кнопки будут выглядеть. После выбора нажимаем Get Code. Первый кусок кода ставим в header или footer, а второй в single.

Кнопка от Google+

Идём сюда https://developers.google.com/+/web/+1button/#customize-snippet.

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

Здесь всё тоже самое. Выбираем размер кнопки и ставим русский язык. Первую часть кода в single.php. А вторую часть кода в header.php или футер перед закрывающим тегом </body>.

Как установить кнопки с помощью плагина Social Share Buttons for WordPress

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

Этот плагин даёт возможность установить кнопки: Facebook, Twitter, Yandex, Mail.ru, Вконтакте, Одноклассники, Google+, Google Buzz и Livejournal.

Заходим в админку блога и нажимаем «Плагины» — «Добавить новый». Потом в поиск вводим Social Share Buttons for WordPress и нажимаем «Поиск плагинов». Жмём «Установить» и в плагинах ищем Social Share Buttons и нажимаем «Установить».

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

Потом появляются настройки плагина на русском языке в админке вордпресс в разделе Share Buttons.

Разберем всё по порядку:

1). Главные настройки

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

2). Share настройки

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

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

3). Like настройки

Здесь предложено установить дополнительные кнопки «like», которые дублируют основные кнопки, только отличаются оформлением. Чтобы добавить кнопку Like социальной сети Facebook и Вконтакте нужно зарегистрировать свой API ID в этих сетях. И вписать в графу «Обязательное поле». Переходите по представленной ссылке и создаёте приложение, которому будет дан API ID.

Дальше, если вы не нуждаетесь в дополнительных кнопках, то просто снимите галочки в разделе «Включение/Отключение».

Сохраняем изменения и на этом настройка плагина Social Share Buttons for WordPress закончена. Теперь смотрим, что получилось и при желании можно всё изменить в любой момент.

Третий способ — идём на сервис по адресу: http://api.yandex.ru/share/

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

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

Копируем код и вставляем его в файл single.php, который находиться в административной панели – «Внешний вид» — «Редактор». Прежде чем туда лесть сделайте копию этого файла.

Я вставила код после строки php the_content, чтобы мои кнопки отображались в конце каждого поста. Вы можете поэкспериментировать с местом вставки кода и посмотреть – где у вас на блоге кнопки будут смотреться лучше всего.

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

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

P.S. Читайте меня в твиттере и подписывайтесь на обновления блога!

С уважением, Анна Федорова


Комментариев: 1

  1. Евгений

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

    Ответить

Оставить комментарий: