|
|
Соціальні мережі давно вже стали одним з найпотужніших інструментів формування аудиторії для автономних інтернет-проектів. Статистика відвідувачів, які приходять із соціальних мереж, не перестає мене приємно дивувати. Наприкінці місяця я обов’язково проведу аналіз джерел трафіку для „Української блогосфери”, в якому Facebook вже посів своє надійне місце. Можливо – навіть опублікую результати цього дослідження на блозі.
Настільки несподівані і приємні результати роботи з соціальними мережами спонукають мене постійно шукати, що ще можна покращити і яким чином зробити взаємодію ще більш зручною для користувачів.
В одній із попередніх статей я писав про те, як встановити кнопку Like від Facebook на власний блог і навіть пояснював, як додати її у RSS-потік.
Клікаючи на кнопку Like, активні читачі вашого блога, транслюють статтю у власних Facebook-аккаунтах, що підвищує ймовірність залучення друзів користувача на ваш сайт. Власне, кнопка Like (подобається) була покликана замінити попередній варіант взаємодії у Facebook – широко розповсюджену кнопку Share (поділитися). Навіть в описі відповідного функціоналу у Facebook можна знайти інформацію про те, що варто обирати саме опцію “like”, а не „share”.
Втім, багато блогерів, і особливо тих, які давно користуються соціальними додатками Facebook, продовжують використовувати кнопку Share, при цьому додаючи ще й кнопку Like. Причина проста: кнопка Share та кнопка Like, мають хоч і схожий, та все ж різний функціонал.
Коли ви ділитесь (share), контентом, то стаття з’являється у вашій стрічці новин і всі друзі можуть бачити її. При цьому стаття оформляється заголовком, вашим коментарем, коротким змістом (зазвичай, перший абзац тексту статті) та медіаконтентом (малюнок, відео тощо). Ось як виглядає подібний запис у Facebook:
Коли ж ви натискаєте на кнопку Like – всі ваші друзі бачать оновлення вашого статусу:
При цьому якщо кільком вашим друзям сподобається один і той же матеріал – про це також буде повідомлено у вашому профілі. А якщо веб-майстер вбудує відповідний плагін у свій сайт – то користувачі будуть бачити не лише кількість людей, яким сподобався даний матеріал, але й фото користувачів та інформацію про те, кому з їхніх друзів у фейсбук він також сподобався.
Як поєднати функціонал кнопок “share” та “like” у Facebook
Не бажаючи перевантажувати інтерфейс блога численними кнопками та додатками, я зацікавився, а чи не можна поєднати функції likebutton та sharebutton в одній кнопці. Як виявилося, Facebook і тут не підвів своїх користувачів, додавши відповідний функціонал у плагін кнопки like при використанні її XFBML-версії.
На офіційній сторінці кнопки Like пропонується два способи інтеграції додатку у свій сайт. З першим з них – методом додавання через iframe – ми познайомилися у статті про кнопку Like. Цей метод простіший, оскільки не передбачає жодних додаткових налаштувань. Все що потрібно – скопіювати і вставити код у шаблон свого блога. Втім, цей метод є і менш функціональним.
Другий спосіб інтегрування кнопки Like – метод XFBML, є водночас більш гнучким і більш складним у налаштуванні. До того ж він вимагає використання інструментів JavaScript SDK.
Втім, переваги цього методу, як на мене, суттєво перевешують недоліки, пов’язані зі складністю інтеграції. Основна перевага полягає в тому, що кнопка Like, вставлена за допомогою методу XFBML, дає змогу користувачу додати вашу статтю у Facebook та прокоментувати її не покидаючи вашого сайту.
Коли відвідувач натискає на кнопку Like, перед ним з’являється віконце для коментаря (можете перевірити на будь-якій зі статей „Української блогосфери”). У випадку, якщо він залишить поле для коментаря порожнім – стаття буде опублікована як при стандартному „лайку” – тобто у вигляді оновлення статусу. Якщо ж користувач додасть до статті коментар, то окрім оновлення статусу стаття буде опублікована на його „стіні” із заголовком, коротким змістом та медіа-контентом (якщо він доступний) – тобто по-суті буде використано функціонал sharebutton.
Очевидно, що у другому випадку, коли відвідувач не лише ділиться статтею, але й коментує її – ефективність „лайку” буде набагато вищою, як і спроможність до залучення нової аудиторії.
Як інтегрувати кнопку Like, використовуючи метод XFBML
Код XFBML-версії кнопки потрібно вставляти в шаблон в тому ж місці, де ми вставляли б iframe. Якщо йдеться про вордпрес, то найдоречнішою буде інтеграція коду у single.php файл вашої теми.
Ось як виглядає XFBML- код кнопки Like:
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like></fb:like>
Перша його частина (<script src=”http://connect.facebook.net/en_US/all.js#xfbml=1″></script>) по-суті є інтеграцією бібліотеки JavaScript SDK, про яку ми згадували вище. Її потрібно залишити без змін за винятком мови локалізації en_US, яку ви можете замінити на власну. Наприклад, українська мова матиме такий вигляд: uk_UA.
Друга частина (<fb:like></fb:like>) – це інтеграція самої кнопки, і у ній ми можемо використовувати всі ті змінні, які доступні для iframe-реалізації і описувалися у попередній статті.
Наприклад, код:
<fb:like href="<?php the_permalink() ?>" show_faces="false"></fb:like>
згенерує кнопку з посиланням на матеріал WordPress (стандартний код для визначення url статті, на якій ви знаходитесь) та з вимкненим відображенням облич тих, кому сподобался стаття.
Зверніть увагу, що XFBML-версія коду автоматично визначає, на якій сторінці ви знаходитесь, і додає у Like саме URL поточної сторінки. Тому використовувати конструкцію href=”<?php the_permalink() ?>” не обов’язково.
UPD: у WordPress бажано все-таки використовувати пряму вказівку href=”<?php the_permalink() ?>” , оскільки в іншому випадку прямий лінк на статтю і лінк, скажімо, на конкретний коментар статті (який також видає текст статті) будуть сприйматися системою як два різні лінки. А нам це зовсім не потрібно.
Тобто, повний код для вставки кнопки Like методом XFBML в блог на вордпресі з українською локалізацією виглядатиме так:
<script src="http://connect.facebook.net/uk_UA/all.js#xfbml=1"></script><fb:like href="<?php the_permalink() ?>" show_faces="false"></fb:like>
Атрибути, які можна використовувати у коді для оформлення вигляду кнопки Like
- href – URL сторінки, яку ви «лайкаєте». XFBML-версія автоматично визначає URL сторінки, на якій ви знаходитесь, тому використовувати цей атрибут не обов’язково;
- layout – виляд плагіну з кнопкою (standard – кнопка, текст праворуч від неї і фото друзів внизу, використовується за замовчуванням; button_count – лише кнопка і кількість „лайків” праворуч; box_count – кнопка і кількість лайків вгорі);
- show_faces – показує обличчя друзів при значенні „true” і вимикає їх відображення при значенні „false”;
- width – ширина кнопки Like у пікселях;
- action – слово, яке відображатиметься на кнопці. Опції: “like” та “recommend”;
- font – визначає шрифт на кнопці. Опції: “arial”, “lucida grande”, “segoe ui”, “tahoma”, “trebuchet ms”, “verdana”;
- colorscheme – кольорова палітра плагіну. Опції: “light” або “dark”.
Якщо вам сподобалася стаття, буду вдячний за її підтримку у соціальних мережах (Twitter, Facebook, Google+ та вКонтактє)
Loading ...