Поради щодо інтеграції facebook та twitter на сайт, веб-майстру

вбудовування віджетів

Основні принципи реалізації - це вбудовування Timelines ( «Шкала часу») Twitter і Facebook. кнопок "Подобається", "Поділитися" або "Твитнуть".

Facebook більш простий у використанні, ніж Twitter. тому що Facebook досі пропонує кілька плагінів, які можна використовувати без аутентифікації. Щоб використовувати плагін Facebook. вам потрібно зайти на сторінку для розробників Facebook. вибрати зі списку плагін, який вам потрібен, налаштувати його і отримати HTML-код для вставки на сторінку.

Наприклад, щоб інтегрувати віджет лайків, необхідно тільки назва сторінки. Зверніть увагу, що віджет лайків підтримується тільки на публічних сторінках Facebook і не працює на персональних сторінках. Налаштування віджета лайків дуже проста: все, що вам потрібно робити, це натискати "Далі" в майстра установки, встановлюючи прапорці.

Ви отримуєте фрагмент HTML-коду на основі iframe. готовий до вбудовування в будь-якому місці шаблона Razor або HTML. який ви використовуєте. Зверніть увагу, що за допомогою наведеного нижче прикладу коду ви можете легко перетворити панель лайків в список записів Facebook:

Панель лайків повинна бути пов'язана з ID додатки, тому ви повинні мати обліковий запис в Facebook і створити через неї додаток. Щоб включити панель лайків, вам необхідно вибрати ID додатки після запуску майстра установки. Також ви можете додати кнопку "Подобається" або "Поділитися" і також отримати код для вбудовування.

На малюнку 1 показані всі згадані вище плагіни Facebook в дії на сторінці, створеної за допомогою Bootstrap:

Поради щодо інтеграції facebook та twitter на сайт, веб-майстру

Малюнок 1: Віджети Facebook в дії

Крім цього віджет дозволяє використовувати атрибут href. вказує на профіль в Twitter. щоб вивести його в панелі. Але головне - це ID віджета даних. На малюнку 2 показаний вбудований timeline користувача Twitter.

Поради щодо інтеграції facebook та twitter на сайт, веб-майстру

Малюнок 2: Timeline Twitter

Панель timeline в Twitter містить кнопки "Стежити", "Твитнуть" і "Завантажити інші твіти". Я зустрічав повідомлення про проблеми, пов'язані з некоректною роботою панелі Twitter в різних версіях Internet Explorer (IE). в інших браузерах все працює нормально. Особисто я не використовую timeline в своїх додатках; проте, я зустрічався з деякими проблемами в IE при тестуванні демо-сторінок.

Для timelines в Facebook це робиться просто, а от для Twitter немає. Він стає практично некерованим при роботі з тисячами ідентифікаторів віджетів Twitter. Замість цього ми реалізували панель Twitter програмно.

Отримання доступу до timeline програмним шляхом

У тілі запиту ви пишете наступний рядок у вигляді послідовності байтів:

Відповідь в форматі JSON. який ви отримуєте від Twitter. передається в клас C #. ім'я якого є довільним:

Аргумент screen_name - це ім'я облікового запису Twitter. до якої ми отримуємо доступ; третій аргумент вказує максимальну кількість твітів, яке буде повертатися.

Цей код заснований на класах, які визначаються в Facebook C # SDK. Мова, який використовується для запиту - Graph API. і, відповідно до документації, вам може знадобитися POST або GET методи виклику об'єкта клієнта Facebook. Наприклад, щоб отримати фотографії користувача, потрібно використовувати наступний код:

Згідно з документацією Facebook. ви отримаєте потік JSON. який повинен бути вами оброблений. Зверніть увагу, що дані, які ви отримуєте з запитів, строго пов'язані з настройками конфіденційності профілю користувача, в тому числі, коли користувач це ви сам.

Щоб програмно відправляти повідомлення в Twitter. вам також буде потрібно зовнішня бібліотека, яка реалізує роботу з протоколом OAuth. Наприклад, для цього відмінно підійде TweetSharp.

Сьогодні практично жодна задача не може бути виконана без аутентифікації. Єдиним винятком є ​​використання віджетів. Аутентифікація вимагає більш складного коду, але це також допоможе в побудові власної мережі лояльних користувачів.

Переклад статті «Tips for Integrating Facebook and Twitter into Your Website» був підготовлений дружною командою проекту Сайтобудування від А до Я.

Схожі статті