Как настроить смартфоны и ПК. Информационный портал
  • Главная
  • Windows 7, XP
  • Как добавить кнопку нравится в фейсбук. Как добавить кнопку «Мне нравится» от Facebook

Как добавить кнопку нравится в фейсбук. Как добавить кнопку «Мне нравится» от Facebook

Кнопка Facebook «Like» позволяет рассказать про статью в самой популярной социальной сети в мире.

Устанавливаем кнопку «мне нравится» для Facebook

Заходим на сайте Facebook в раздел «Like Button ». Либо вручную, внизу страницы заходим в пункт «Разработчикам », выбираем раздел «Web ». На следующей странице заходим в «Integrate Facebook Into Your Website ». Далее, слева в меню выбираем вкладку «Core Concepts », в ней раздел «Social Plugins ». Заходим в пункт «Like Button ».

Заполняем следующую форму:

Значения:

  • URL to Like — адрес страницы, которой будут ставить лайки. Лучше оставить пустой, в таком случае автоматически будет подставлен адрес страницы, на которой находится кнопка
  • Send Button дополнительная кнопка, которая позволяет отправить статью друзьям. Лично я убрал ее
  • Layout Style — позволяет выбрать стиль кнопки. Попробуйте поменять, пример кнопки сменится автоматически
  • Width — ширина кнопки. Однако, сколько я не менял, кнопка оставалась прежней
  • Show Faces — если включить, то будут показаны аватарки тех, кто нажал кнопку
  • Font — позволяет выбрать шрифт надписи на кнопке
  • Color Scheme — выбор между светлым и темным оформлением. По мне, темное вообще не смотрится
  • Verb to display — выбираем надпись на кнопке:»Мне нравится» или «Я рекомендую»

После заполнения всех полей нажимаем на кнопку «Get Code». Появляется окно с кодом. Первую часть вставляем в шаблон после открывающегося тега body:

Default

//

//

if (d . getElementById (id ) ) return ;

js = d . createElement (s ) ; js . id = id ;

js . src = "//connect.facebook.net/ru_RU/all.js#xfbml=1" ;


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

Хотя, сама кнопка «Подписаться» на фан-страницах появилась еще 2 года назад , но ранее она почти ни на что не влияла, ее никто не замечал, и она то появлялась, то исчезала.

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

Причина №1. Кнопка «Подписаться» теперь есть на всех фан-страницах в Facebook, она не убирается из настроек и ей присвоен очень важный функционал.

Причина №2. Facebook стал показывать статистику количества подписчиков отдельно. А, как показывает практика, это значит, что Facebook будет отдавать приоритет функции подписок все больше с течением времени.

Возможно даже такое, что кнопка «Нравится» будет полностью убрана, как механизм подписки на Страницу и кнопка с названием «Нравится» останется только под публикациями. А механизм подписки возьмёт на себя полностью кнопка «Подписаться».

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

Причина №3. Теперь пользователи нажимая кнопку «Подписаться» на фан-странице могут получать новости в Ленту, не будучи фаном этой Страницы.

То есть значимость такого явления как «количество фанов» начинается уменьшаться.

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

Сделаем эксперимент №1. Зайдите на Страницу fb.com/Love.is.comic и нажмите кнопку «Нравится».

Вы увидите, что вы одновременно и стали фаном, и подписались. В этом случае в вашем профиле будет указано, что вам нравится эта Страница и вы сможете читать ее в Ленте.

А теперь нажмите «Больше не нравится». После этого нажмите кнопку «Подписаться».

Вы увидите, что вы подписались на фан-страницу, но вы не стали ее фаном. В этом случае в вашем профиле будет отсутствовать информация о том, что вам нравится эта Страница или вы на нее подписаны, но вы также сможете ее читать в Ленте.

Сделаем эксперимент №2. Зайдите на Страницу fb.com/comic.fotos . В начале нажмите кнопку «Нравится» (кнопка Подписаться нажмется автоматически и ее название изменится на «Подписки»), а затем наведите мышку на кнопку «Подписки» и отпишитесь.

Вы увидите, что вы остались числиться фаном этой Страницы (это будет по-прежнему отображаться в вашем профиле), но отписались от ее новостей.

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

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

К сожалению, сейчас Facebook не показывает администраторам, сколько фанов являются подписчиками, а сколько просто «статисты». Есть только одна метрика на данный момент, которая помогает оценить количество читателей — это Охват.

Приведу пример.
У вас есть 2 Страницы по 100 000 фанов каждая.

Но на одной 100 000 фанов-подписчиков.
На другой: 50 000 фанов-подписчиков, 50 000 фанов-«статистов» и 10 000 просто подписчиков.

Получается, что Фейсбук вам покажет, что у вас всего 100 000 фанов и всего 60 000 подписчиков. Но из этих данных не видно, что 50 000 фанов отписались от новостей.

По идее на первой Странице Охват должен быть примерно в 2 раза выше, чем на второй. Эта метрика может служить подсказкой.

Причина №4.

Функции, которые теперь остались у кнопки «Нравится» — это:
— стать фанов-подписчиком Страницы,
— разлайкать Страницу, то есть перестать быть фаном.

Функции, которые теперь появились у кнопки «Подписаться» — это:
— стать подписчиком, то есть получать новости с Ленту,
— отписаться от Страницы, то есть перестать получать новости в Ленту,
— установить новостям этой Страницы приоритет, то есть они будут показываться в Ленте новостей первыми,
— убрать приоритет,
— включить уведомления о новых публикациях Страницы,
— отключить уведомления.

Вы видите, что кроме просто функции подписки, Facebook дает возможность пользователям эту подписку настроить, чтобы видеть новости от данной Страницы чаще или наоборот реже.

Кроме того, вы как администратор фан-страницы начали видеть уведомления со словами «решил подписаться на страницу», что еще раз указывает на то, что Facebook добавляет важности функции подписок:

Поэтому, призыв «подпишитесь на нашу страницу» теперь звучит буквально и на 100% актуально.

Когда вы нажимаете на кнопку Like от Facebook на сайтах, в вашем профиле появляется полноценный анонс страницы (вместо предыдущей отметки о том, что вам что-то понравилось) — ссылка + цитата + картинка.

Ежели посмотреть на это со стороны вебмастера, то можно увидеть отличную возможность получить дополнительный трафик. Давайте рассмотрим, как можно максимально увеличить отдачу от этой кнопки. Для начала настроим параметры руками (далеко не для всех CMS есть модули/плагины, автоматизирующие процесс).

Генератор кнопок Like вы найдёте по адресу: http://developers.facebook.com/docs/reference/plugins/like/

Первый шаг — создаём саму кнопку.

URL to Like — можно задать свой URL, можно оставить поле пустым, тогда в качестве этого параметра будет стоять адрес текущей страницы (при вы боре XFBML формата кнопки — об этом ниже). Стоит заметить, что FB кнопка по приоритету выберет тот, что указан в теге canonical в head страницы.
Layout Style — три варианта оформления кнопки, подбираем наиболее уместное для вашего дизайна.
Show Faces — если поставить галочку то при заходе на сайт с кнопкой Like под ней будут показываться аватарки ваших друзей, которые уже «залайкали» данную страницу.
Width — ширина. Учитывая, что при включённом Show Faces вам понадобится больше места для кнопки, укажите допустимую ширину блока. Исключительно в пикселях, проценты не работают.
Verb to displa y — выбираем надпись на кнопке Like или Recommend.
Font — можно выбрать шрифт, аналогичный тому, что у вас на сайте.
Color Scheme — выбор светлой или тёмной цветовой схемы.

Настроили? Теперь жмём кнопку Get Code . В появившемся окне будет два варианта: iframe и XFBML. Если вы не указали URL to Like, то чтобы кнопка взяла в качестве этого параметра страницу, где она установлена — выбирайте XFBML. Лично я из эстетических соображений тоже предпочитаю XFBML, поскольку в неактивном состоянии он не растягивает страницу и не оставляет много пустого пространства, как iframe.

Полученный код можно руссифицировать, для этого в адресе http://connect.facebook.net/en_US/ меняем en_US на ru_RU

Title — заголовок поста.
Type — тут можно задать тип поста (скорее — тематику) — по идее используется в поисковых механизмах платформы, возможно также поисковиками, сотрудничающими с FB.
URL — можно задать свой адрес, но преимущество будет за тегом canonical.
Image — адрес картинки, которая будет использована для анонса.
Site name — название вашего сайта.
Admin — Facebook ID, если вы на странице настройки кнопки находитесь будучи залогиненым в FB, то ваш ID должен подставиться автоматически. Позволит смотреть статистику по работе кнопки, подробности — ниже.

Теперь у нас есть метатеги, которые ставим до тега страницы.

Стоит заметить, что можно создать одну привлекательную картинку для сайта и использовать её для всех кнопок Like ресурса. Это упростит задачу, однако если под каждую страницу делать свою картинку, получится более интересно для пользователя (ого, что-то новое, поду посмотрю! ).

Перейдём к автоматизации. Воспользуемся плагином для WordPress Facebook Like Button http://wordpress.org/extend/plugins/facebook-like-button/ — он упростит задачу для блогов на этой платформе. Это одно из оптимальных решений, не требующее правки шаблона, ручного прописывания параметров и т.д.

На странице настроек плагина вы найдёте следующие поля для заполнения:

AppID for XFBML version — здесь просят ввести AppID приложения, если будем использовать XFBML кнопку, чтобы получить этот AppID, надо будет привязать к аккаунту номер телефона, с нашими операторами это может стать проблемой (хотя на данный момент с Билайном и Мегафоном в Московском регионе всё ок, хотя недавно ещё не получалось). Впрочем, и без указания AppID плагин будет работать.

Type : XFBML или iFrame — выбираем формат кнопки, как уже заметил выше, XFBML удобнее.
Show in Home : показывать на главной странице.
Show in Pages : показывать на страницах.
Show in Posts : показывать в постах.
Show in Categories : показывать в категориях.
Show in Archive : показывать в архивах.
Position : выбираем позицию кнопки. Лучше ставить после контента.
Alignment : выравание кнопки по левому или правому краю.
Admin ID : если нам нужна статистика по работе кнопки указываем сюда свой ID (об это уже писал выше).
Defualt Imag e: сюда пишем адрес картинки для анонса по умолчанию Check to enable: ставим галочку, чтобы включить использование картинки.
Language : выбираем язык кнопки.

Layout Style : выбор вида кнопки.
Show Faces : показывать ли аватарки друзей.
Verb to display : слово на кнопке.
Font : шрифт.
Color Scheme : цвета.
Width : ширина.
Height : высота.
Container Class : если в таблице стилей есть элементы для оформления этой кнопки то здесь укажите название класса.

Если вы указали свой ID, то статистика через время будет доступна по адресу http://www.facebook.com/insights /

Чрезвычайно удобная вещь: можно узнать общее число Лайков на сайте, количество переходов с Facebook, демографию тех, кто лайкает ваши заметки (чтобы выявить активный костяк аудитории, с которым можно взаимодействовать)..com 0,02% — есть над чем работать.

В качестве постскриптума видео с фактами и Facebook:

Обсуждение:

Хотел было в один пост уложить несколько тем: поиск и добавление друзей, добавление блока «Мне нравится», реклама созданной страницы.

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

А в этом посте мы добавим блок «Мне нравится» или по «ихнему» «I like» от facebook на свой сайт, затем будем добавлять друзей к своему аккаунту в facebook и, в итоге, предложим своим, уже имеющимся, друзьям нашу страницу.

Добавление блока «Мне нравится»

Виджет от facebook представляет собой блок, состоящий из кнопки «Мне нравится» и фотографий тех пользователей, которые собственно на эту кнопку нажали. На примере установленного у меня блока (см. внизу) Вы можете видеть, как он примерно может выглядеть у Вас на сайте.

Этот виджет доступен только для страниц созданных в facebook. Если у Вас нет страницы, тогда Вам можно установить , без такого виджета. Тоже нужная вещь. Но страницу все же рекомендую создать и настроить, я об этом писа л в .

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

По пунктам:

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

На этом предлагаемые фейсбуком настройки заканчиваются, жмем кнопку «Get code»:

Появится всплывающее окно. В этом окне два вида кода. Я установил первый. Второй пробовал установить, выглядит не очень.

Вот код для моей страницы в facebook:

< iframe src= "http://сайт/www.facebook.com/plugins/likebox.php?href=http%3A%2F %2F www.facebook.com%2F pervushincom&width=681&colorscheme=light&show_faces=true&stream=false&header=true&height=62" scrolling= "no" frameborder= "0" style= "border:none; overflow:hidden; width:681px; height:62px;" allowTransparency= "true" >

Помните, выше, я говорил о параметре height, настроить который нам не предлагается? Так вот, по-умолчанию этому параметру дается значение 62px, для моего блога этого оказалось маловато и я его изменил, сейчас он у меня равен 165px.

Настроенный код необходимо разместить в шаблоне нашего движка. Если у Вас, как и у меня, тогда в папке с темой (wp-content/themes/ваша тема) находим файл single.php. Этот файл отвечает за вывод одиночной записи. Открываем файл и после тега вставляем полученный код.

Само собой Вы можете установить этот код куда угодно. Например, можно выводить виджет в сайдбаре, тогда выставляем параметры widht и height в соответствии с шириной Вашей боковой панели и прописываем код в файл sidebar.php.

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

Добавление друзей

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

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

Добавлять друзей просто. Можно, конечно, назвать этот способ онанизмом, но это просто и бесплатно.

Переходим на страницу своего аккаунта в facebook. В колонке справа есть блок «Вы можете их знать», в котором выводится по два пользователя. В этом блоке, под каждым пользователем имеется ссылка «Добавить в друзья».

В большинстве случаев пользователи охотно соглашаются на наш запрос.

Что дальше? А дальше, когда у Вас уже будет «энное» количество друзей, можно им предложить нашу страницу. Для этих целей на странице в facebook имеется опция «Предложить друзьям». Она находится в меню слева, под эмблемой Вашей страницы (сайта, блога):

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

Ну что же, в этом посте все. Немного позже, возможно через недельку, опубликую пост по рекламе в facebook.

Кстати, а Вы не знаете методов продвижения страниц в Facebook помимо рекомендаций друзьям и рекламы?

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

Добавить кнопку «Мне нравится» от Facebook на свой сайт или блог можно с помощью специального кода , получить который можно на сайте Facebook Developers. Для этого нужно заполнить специальную форму:

Процесс получения кода состоит из следующих шагов:

  • поле URL to Like — адрес понравившейся страницы — следует оставить пустым чтобы адресу понравившейся страницы был присвоен адрес страницы, на которой находится кнопка
  • поле Layout Style позволяет выбрать стиль оформления кнопки (со счетчиком голосов или без)
  • поле Show Faces в значении True позволяет отображать аватары пользователей, которым понравился данный сайт или блог
  • в поле Width следует указать ширину плагина в пикселях
  • поле Verb to display отображает название кнопки «Like» или «Recommend» (в русскоязычном варианте «Нравится» или «Рекомендовать»)
  • в поле Font следует выбрать шрифт начертания текста
  • в поле Color Scheme следует выбрать одну из двух предлагаемых схем оформления кнопки: светлую или темную

После заполнения всех полей следует нажать кнопку «Get code» («Получить код»). Теперь чтобы добавить кнопку «Мне нравится» от Facebook на Ваш сайт или блог, Вам следует скопировать из открывшегося окна программный код.

В верхней части окна представлен iframe -код, в нижней — XFBML . Второй вариант более универсален.

Если поле адреса страницы (URL) осталось незаполненным, то после установки кода кнопки «Мне нравится» в html-код страницы пользователям, нажавшим эту кнопку будет «нравиться» именно эта конкретная страница.

Если выбран iframe-код для вставки его в сайт или блог на движке WordPress, то необходимо несколько изменить данный код. Для этого следует найти такой участок кода:

http%3A%2F%2Fexample.com%2Fpage%2Fto%2Flike

и заменить его следующим:

Если Вы хотите, чтобы посетителям "нравился" весь Ваш блог или сайт, то Вам следует заменить указанный участок кода на URL-адрес Вашего ресурса. Затем следует разместить код в шаблоне страниц сайта.

Если Вы хотите изменить язык кнопки (по-умолчанию сообщение на кнопке выводятся на английском языке), то Вам необходимо заменить часть URL в коде кнопки — задать локализацию. Так для включения русского языка следует заменить en_US на ru-RU в строке

Лучшие статьи по теме