Как добавить кнопку «Нравится» Facebook в WordPress

Как добавить кнопку «Нравится» Facebook в WordPress

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

Даже если Вы не очень часто пользуетесь Facebook, Вы, вероятно, знаете о кнопке «Нравится (Like)». Теперь она имеет гораздо большее значение, чем первоначально предполагалось. Она стала способом измерения успеха во всемирной паутине. Один простой щелчок на кнопке может вызвать цепную реакцию, которая сделает Ваш пост очень популярным. Кнопка «Нравится» позволяет одним нажатием отметить содержимое сайта как понравившееся и поделиться им на Facebook. Но Вам придется поработать над этим.

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

Как добавить кнопку «Нравится» Facebook в WordPress

Да, это понятно, что сказать о чем-то и на самом деле сделать, это не одно и то же. Но не беспокойтесь, добавление кнопки «Нравится» Facebook на Ваш сайт проще, чем можно себе представить. Чтобы всё подготовить, потребуется некоторое время, но если Вы выполните все шаги, то у Вас будет своя собственная кнопка или поле «Нравится». Есть несколько способов добавления кнопки, поэтому Вам просто нужно выбрать тот, который Вы предпочтёте.

Создайте приложение Facebook

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

Создать приложение facebook

 

  1. Войдите в свой персональный аккаунт Facebook
  2. Посетите страницу Facebook for Developers
  3. В правом верхнем углу найдите меню «Мои приложения»
  4. Выберите «Добавить новое приложение»
  5. Заполните поле отображаемого названия своего приложения (например, «Кнопка Like») и введите Ваш адрес электронной почты
  6. Нажмите кнопку «Создайте ID приложения»
  7. Facebook запросит проверку безопасности — введите символы, которые Вы видите на экране.
  8. Пропустите сейчас выбор категории и откройте пункт меню «Настройки»/»Основное» приложения с левой стороны экрана

Этого будет более чем достаточно, чтобы Ваше приложение было готово для установки кнопки «Нравится» Facebook на Вашем сайте WordPress. Теперь Вы должны решить, будете ли Вы устанавливать плагин, который будет обрабатывать эту кнопку, или использовать программный код для ручной установки кнопки в записи и страницы.

Использование бесплатного плагина

Facebook требует, чтобы Вы использовали именно его приложение, чтобы показать кнопку «Нравится», и, кроме того, для решения задачи отображения кнопки потребуется использование дополнительного программного кода. Но Вы должны знать, что для облегчения выполнения этой задачи есть десятки простых плагинов WordPress, которые разместят кнопку «Нравится» Facebook на Вашем сайте. Однако, приготовьте свое приложение, так как все они запросят у вас ID. Без этого идентификатора Вы не сможете управлять своей кнопкой.

WP Like Button

ЦЕНА: Бесплатно

Плагин wp-like-button

 

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

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

Feed & LikeBox For Facebook

ЦЕНА: Бесплатно

Плагин facebook-by-weblizar

Наряду с кнопкой «Нравится» (Like Button) применяется также Like Box, который показывает Ваших последователей в Facebook и предлагает простой способ присоединиться к Вашим читателям и следить за новостями Вашего блога в Facebook. Виджет с Like Box (после установки плагина) размещается на боковой панели Вашего сайта. Вы можете настроить плагин так, чтобы отображались фотографии профилей Ваших последователей, последние записи и другие визуальные элементы: ширину, высоту и цветовую гамму. Если кто-то нажимает «Нравится» в этом боксе, то он автоматически присоединяется к Вашей странице в Facebook.

Если Вы подготовили ID приложения, Feed & LikeBox For Facebook сделает всё для Вас всего за несколько секунд.

  1. Перейдите к Плагины -> Добавить новый
  2. Осуществите поиск для «Facebook by WebLizar»
  3. Установите и активируйте плагин Feed & LikeBox для Facebook
  4. Перейдите к Внешний вид -> Виджеты
  5. Найдите виджет «Facebook Page Like Box» и перетащите его в любую виджетную область
  6. Заполните детали и скопируйте ID приложения из своего приложения Facebook

После сохранения настроек новый Like Box Facebook появится в виде виджета на боковой панели, в нижнем колонтитуле или в любой другой области, которую Вы, возможно, выбрали. На всякий случай, если Вы хотите отобразить бокс в своих записях и страницах, будет достаточно использовать шорткод [FBW] и плагин сделает все остальное.

Вручную добавить кнопку «Нравится» Facebook

Если Вы не побоитесь нескольких строк программного кода, кнопку «Нравится» Facebook можно добавить куда угодно, даже не устанавливая дополнительные плагины. Разработчики всё специально подготовили для пользователей, поэтому достаточно открыть специализированный инструмент и задать несколько настроек по своему выбору.

Настроить кнопку

Конфигуратор кнопки Нравится

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

  1. Перейдите на страницу Facebook for Developers
  2. Перейдите по странице к разделу Конфигуратор кнопки «Нравится»

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

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

Просто установив флажок, Вы можете включить кнопку «Поделиться». Вам решать, но поскольку это может помочь Вам получить дополнительные висты, предлагается включить эту кнопку.

Получить код

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

Как Вы заметите в новом окне, есть два разных способа добавления программного кода на Ваш сайт. Поскольку метод JavaScript SDK требует, чтобы Вы добавили на свой сайт два разных фрагмента программного кода, он больше подходит для опытных пользователей. Вместо этого намного проще использовать метод iFrame, но в этом случае убедитесь, что Вы ввели URL-адрес той страницы, где будет располагаться кнопка «Нравится»:

Способ IFrame для кнопки Нравится Facebook

  1. Переключитесь на вкладку iFrame
  2. Скопируйте весь программный код
  3. Перейдите к Внешний вид -> Виджеты
  4. Добавьте новый виджет Текст
  5. Вставьте программный код в редактор виджета

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

Если Вы понимаете суть содержимого файлов WordPress и знаете о рисках при изменении программного кода непосредственно из редактора внешнего вида, Вы также можете добавить программный код в любой нужный файл шаблона. Например, можно перейти во Внешний вид-> Редактор и найти шаблон single.php. Там Вы в программный код можете добавить кнопку и показывать ее в каждой записи в любом предпочитаемом месте.

На всякий случай, если метод iFrame у Вас не работает, или Вы хотите встроить кнопку «Нравится» с помощью JavaScript SDK, вот что нужно сделать:

Способ SDK JavaScript для кнопки Нравится Facebook

 

  1. Переключитесь на вкладку SDK JavaScript
  2. Скопируйте программный код из шага №2
  3. Включите JavaScript SDK в свою страницу в текстовом редакторе один раз, лучше всего сразу после открытия тега <body>.
  4. Скопируйте программный код из шага №3
  5. Разместите этот код везде, где Вы хотите, чтобы плагин появлялся на Вашей странице (например, виджет Текст)

Добавить кнопку «Нравится» в каждую запись с динамическим URL-адресом

Предыдущие методы работают неплохо, но они позволяют пользователю использовать только один конкретный URL-адрес, который Вам нужно указывать в настройках. Если Вы ищете способ добавить кнопку «Нравится» отдельно в каждую запись, Вам понадобится другой подход и модифицированный программный код:

  1. Перейдите к Внешний вид -> Редактор
  2. Начните редактирование файла single.php
  3. Скопируйте и вставьте следующий программный код в то место, куда Вы захотите:

<iframe src="http://www.facebook.com/plugins/like.php?href=<?php echo
urlencode(get_permalink($post->id)); ?>&layout=standard&show_faces=false&width=350&amp;action=like&amp;colorscheme=light"
scrolling="no" frameborder="0" allowTransparency="true" ></iframe>

Не забудьте сохранить изменения и перезагрузить Ваши записи, чтобы увидеть там кнопку «Нравится» Facebook. Теперь каждый пост получит свою кнопку, но самое важное изменение заключается в том, что URL-адрес будет создан динамически. Это означает, что каждый пост получит свой собственный URL. Поэтому, когда пользователь нажимает кнопку «Нравится», будет рассматриваться этот конкретный пост.

Заключение

Если Вы хотите добавить простую кнопку «Нравится» во все свои записи или просто показать Like Box, который будет привлекать пользователей Facebook, Вы просто обязаны создать эту функцию в своем блоге. Поскольку Facebook по-прежнему остается одной из самых популярных и активных социальных сетей, то Вам будет очень полезно добавить простую кнопку «Нравится» на сайт.

Пониманию и исполнению чего, собственно, и служит эта статья.

 

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