Как поставить кнопки Вконтакте, Facebook и Twitter на блог wordpress

Автор: | Рубрика: Блог на Wordpress | Обновлено: 2017-02-21
Просмотров: 4847
Добавление кнопки Вконтакте, Facebook и Twitter в wordpress блог

Всем привет! В этой статье вы узнаете, как добавить на свой сайт кнопки самых популярных социальных сетей - Твиттер, Вконтакте, Фейсбук.

Как добавить кнопку Twitter на блог wordpress?

  • Одним из вариантов будет кнопка для ретвитта от сайта Tweetmeme. На блоге wordpress можно установить специальный плагин, который добавит на Ваш сайт кнопку Twitter.
  • Также можно установить кнопку Twitter с официального сайта Твиттера. Настройка кнопки очень простая и займет несколько минут. Вам всего лишь нужно выбрать вид кнопки, текст твитта, ссылку страницы и язык. По умолчанию все, что нужно установлено. В поле ниже впишите свой аккаунт в Twitter.  Теперь скопируйте и вставьте полученный код в нужное место шаблона сайта.

Как добавить популярные социальные кнопки ВКонтакте, Twitter и Facebook

к оглавлению ↑

Как добавить кнопку Like (мне нравится) от Facebook

Для добавления кнопки Facebook необходимо добавить код:

 <iframe src="http://www.facebook.com/plugins/like.php?href=<?php the_permalink() ?>  &layout=standard&show_faces=false&width=450&action=like&colorscheme=light&height=35"  scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:35px;"  allowTransparency="true"></iframe>  

Можно изменить некоторые настройки. Например, ширину и высоту (width=450 height=35), включить или выключить аватары пользователей (show_faces=false - выключены). На моем блоге установлена высота блока 25.

Также на официальном сайте Facebook есть специальная страница, с помощью которой можно настроить кнопку для своего сайта и скопировать готовый код.

к оглавлению ↑

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

Для добавления кнопки Вконтакте необходимо установить плагин VK Share Button.  После установки плагина, Вы легко сможете настроить его на свой вкус.

Еще есть специальный виджет "Мне нравится" с помощью которого можно настроить кнопку Вконтакте.

Также можно, не настраивая плагин, вставить следующий код в шаблон страницы single.php:

<span style="color: #000000; font-weight: bold;">&lt;?php</span>  <span style="color: #b1b100;">if</span> <span style="color: #009900;">(</span><span style="color: #990000;">class_exists</span><span style="color: #009900;">(</span><span style="color: #0000ff;">'VKShareButton'</span><span style="color: #009900;">)</span><span style="color: #009900;">)</span>      <span style="color: #000088;">$VKShareButton</span> <span style="color: #339933;">=</span> <span style="color: #000000; font-weight: bold;">new</span> VKShareButton<span style="color: #009900;">(</span><span style="color: #009900;">)</span><span style="color: #339933;">;</span>      <span style="color: #b1b100;">echo</span> <span style="color: #000088;">$VKShareButton</span><span style="color: #339933;">-&gt;</span><span style="color: #004000;">the_button</span><span style="color: #009900;">(</span><span style="color: #009900;">)</span><span style="color: #339933;">;</span>  <span style="color: #000000; font-weight: bold;">?&gt;   </span>

Второй способ добавления кнопки Вконтакте "Мне нравится":

Перейдите на сайт Вконтакте, чтобы настроить внешний вид кнопки - ссылка

Подключите новый сайт, заполнив 3 строки своими данными и сохраните изменения. После этого выберите вид кнопки "Мне нравится".

Установка кнопки "Мне нравится"

Последний шаг - добавление кода в шаблон. Код состоит из двух частей. Первую часть нужно добавить в файл header.php перед тэгом </head>. А вторую - в файл single.php в то место, где должна отображаться кнопка.

Код кнопки Вконтакте для сайта

Если же не хотите возиться с установкой каждой кнопки социальной сети, то установите панель с кнопками социальных сетей. О том, как добавить кнопку Google +1 читайте тут.

http://twitter.com/goodies/tweetbutton

С уважением, Виктория – блог inetsovety.ru

Поделиться ссылкой на пост в соц. сетях
Получать уведомления о новых статьях на e-mail
Комментариев: 32 к статье "Как поставить кнопки Вконтакте, Facebook и Twitter на блог wordpress"
  • Ната Дегтярева 2016-03-29 в 09:09

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

    Ответить
  • Елена 2015-11-17 в 08:35

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

    Ответить
  • Виталий Охрименко 2015-05-28 в 13:01

    А как на счет сервиса Uptulike, я вывел кнопки соцсети именно через этот сервис и очень доволен ими

    Ответить
    • Игорь 2016-10-02 в 11:03

      Сейчас конечно проще.Зачем мудрить с кодом и плагин устанавливать, если можно через сервис все установить

      Ответить
  • seomodern 2014-06-14 в 16:08

    Не скопировались теги…

    Вот продолжение:

    над предпоследним тегом php endif.

    Виктория, добавьте возможность редактирования своих комментариев в течении хотя бы 10 секунд.

    Ответить
  • seomodern 2014-06-12 в 21:06

    Куда именно в single.php вставлять код?

    Ответить
    • seomodern 2014-06-14 в 16:05

      Уже разобрался. На своем блоге я вставил над тегами:

      Ответить
    • Виктория 2014-06-16 в 18:37

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

      Ответить
  • seomodern 2013-12-10 в 18:08

    Кнопки отображаются на всех страницах сайта?

    Я так понял, в статье описываются добавление кнопок лайков напрямую из соцсетей? А как напрямую добавить кнопки «поделиться» («репост»)?

    Ответить
    • Виктория 2013-12-10 в 19:33

      Это и есть кнопки поделиться, они устанавливаются при помощи специальных кодов и социальных сетей.

      Ответить
      • seomodern 2013-12-10 в 19:36

        А отдельно кнопки лайков для соцсетей существуют? Может вопрос глупый, но напрямую я кнопки социальных сетей пока еще не ставил.

        Ответить
      • Александр 2014-06-27 в 18:50

        Я тоже такого еще не делал было бы интересно почитать

        Ответить
      • seomodern 2014-06-27 в 20:43

        На скорую руку можно воспользоваться сторонними сервисами

        Ответить
  • Фидан 2013-11-30 в 13:43

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

    Ответить
    • seomodern 2013-11-30 в 19:30

      Специальный сервис можно использовать в самом начале, но лучше ставить кнопки напрямую. Я так и буду делать. Почему? Смотрите коммент к этой статье: http://inetsovety.ru/stilyne-knopki-sotssetey-ot-pluso/

      Ответить
      • Фидан 2013-11-30 в 19:58

        Спасибо))

        Ответить
      • Александр 2014-06-30 в 18:03

        Я тоже пользуюсь кнопками от этого сервиса. мне очень нравиться.

        Ответить
      • Люся 2017-05-31 в 18:45

        По приведённой ссылке в одном комментарии вы хвалите сервис плюсо, в другом говорите, что он плохо работает.

        Ответить
  • seomodern 2013-07-18 в 15:26

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

    Ответить
    • Александр 2014-06-27 в 18:52

      Я тоже не могу найти нормального шаблона, надеюсь что заработаю деньги нормальные и закажу разработку хорошего шаблона

      Ответить
      • seomodern 2014-06-27 в 20:44

        Решил пока кнопки от Яндекса оставить. Раньше пробовал ставить от других сервисов.

        Ответить
      • Александр 2014-06-30 в 18:04

        Я предпочтение отдаю кнопкам от сервиса Pluso, там очень большой набор соц сетей

        Ответить
      • Люся 2017-05-29 в 23:41

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

        Ответить
  • alf2012 2013-06-12 в 13:56

    По-моему, если уж ставить плагин — то один для всех кнопок, а не только Вконтакте. У меня стандартные кнопки социалок не очень вписываются в дизайн сайта — пришлось ставить плагин и менять в нем картинки. Жалко, что коды кнопок с официальных сайтов не позволяют вставлять свою картинку 😥

    Ответить
    • Виктория 2013-06-12 в 14:09

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

      Ответить
    • Люся 2017-05-31 в 18:46

      Один плагин для всех кнопок намного удобнее для блогера.

      Ответить
  • Юлия Андреевна 2013-03-07 в 18:34

    Спасибо за совет и плагин. Тоже себе поставила, очень удобно оповещать друзей о новой статье через соц. сеть.

    Ответить
    • Люся 2017-05-29 в 23:39

      Длина кнопки для Фейсбука по умолчанию 450 пикселей, по мне так большая длина.

      Ответить
  • Юлия 2012-12-20 в 13:04

    Отличная статья.Очень часто хочется чем-то поделиться,но не знаешь как.Все получилось,пользуюсь.Огромное спасибо автору.

    Ответить
  • Лео 2012-12-11 в 23:24

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

    Ответить
    • Люся 2017-05-29 в 23:36

      Лео, код работать будет, потому что код встраивается в файл php — single.

      Ответить
  • Андрей 2012-11-22 в 20:15

    Большое спасибо за хорошую статью! У меня все получилось и отлично работает))

    Ответить
Оставить комментарий
Нажмите, чтобы отменить ответ.

Комментарий появится после проверки. Комментарии, содержащие спам и ненормативную лексику будут удалены!