Здравствуйте, сегодня поговорим о том, как добавить в сайдбар популярный виджет от социальной сети Facebook – Facebook like box с кнопкой “Нравится” (виджет страницы, “группы” Facebook).

Скачать исходники для статьи можно ниже

Как будет выглядеть данный виджет:

Или можно также добавить в данный виджет поток сообщений, будет выглядеть следующим образом:

Давайте же приступим к созданию данного виджета для своего сайта:

1. Первое, что нам нужно сделать – это зарегистрироваться на Facebook.

Думаю ничего сложно в данном пункте нет.

2. Создать страницу для своего сайта.

Вот здесь уже посложнее.

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

Переходим на главную страницу своего акаунта на Facebook – для этого в правом верхнем углу нажимаем на ссылку “Главная”:

После слева выбираем пункт “Создать страницу”:

Здесь выбираете тематику, особой роли она не имеет, для сайта можно выбрать “Общая идея или сообщество” – нажимаем на нее:

Заполняем название сообщества, ставим галочку на против “Я принимаю условия…” и жмем на кнопку “Начало работы”.

Далее появится следующее окошко:

Следующим шагом добавляете фото.

После вам предлагают разрекламировать вашу станичку (сообщество), а также добавить форму оплаты – здесь жмем “Пропустить”:

После нажатия кнопки нам покажут нашу готовую страничку:

Теперь нам нужно узнать ее url – его мы введем в конструкторе виджета “Мне нравится от Facebook”, о котором расскажу ниже.

Для этого опять переходим на главную страницу нашего акаунта на Facebook:

И слева жмем на нашу созданную страничку (выше мы назвали ее Mnogoblog.ru):

Заходим в нее и смотрел ее url в адресной строке браузера – должно быть что-то наподобие следующего:

https://www.facebook.com/pages/Mnogoblogru/129744797229565

Запоминаем его или записываем (или копируем в бувер).

И переходим к следующему шагу.

3. Заходим на страницу конструктора виджета Facebook – Like Box (Нравится или поделиться):

http://developers.facebook.com/docs/reference/plugins/like-box/

Вот так будет выглядеть данная страница:

Все теперь – в пункт “Facebook Page URL” вставляем url созданной нами выше странички, в данном примере – https://www.facebook.com/pages/Mnogoblogru/129744797229565

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

После жмем на кнопку “Get Code” (Получить код).

После появиться следующее окошко:

Здесь вам предлагаю код для вставки созданного виджета Facebook на сайт – самый простой способ – это IFRAME вставка, так что жмем на нее:

Копируем код и вставляем в сайдбар (текстовой виджет для wordpress) на своем сайте.

Для сайтов на wordpress – заходим в панель управления своим сайтом, в левом меню выбираем пункт “Внешний вид” и его подпункт “Виджеты”, ищем виджет с названием “Текст” и перетаскиваем его в сайдбар – в него вставляем код созданного нами виджета на Facebook-е.

Вот и все готово!!!