Добавляем виджет сообщества Фейсбук на сайт

1 Star2 Stars3 Stars4 Stars5 Stars (Оставлено голосов: 10, оценка: 5,00 из 5)
Загрузка...

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

На нашем блоге мы уже рассказывали, как добавить виджет Одноклассников и виджет ВКонтакте на свой блог, а также не упустили возможность и рассказали, как добавить виджет Google+ на свой сайт. Сегодня мы подробно рассмотрим, как установить на свой блог виджет сообщества Facebook. Возможно, для многих мы не откроем ничего нового и будем рассказывать очевидные вещи, но как показала практика, не все об этом знают.

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

Как поставить виджет группы Facebook на сайт

Любой виджет представляет собой простую мини-программу, состоящую из специального кода. Разместив его на странице вашего блога, вы получите не только украшение, но и полезный функционал облегчающий доступ к разнообразной информации.

Давайте разберемся, где брать код виджета сообщества Facebook. Для этого необходимо перейти в раздел для разработчиков на страницу плагинов и выбрать необходимый нам плагин — Page Plugin:страница плагинов facebook

Настройка плагина Page Plugin

Facebook Page URL — в этой строке необходимо указать адрес вашего сообщества или группы в фейсбуке.
Width — задаем ширину виджета. В зависимости от места расположения виджета на вашем сайте, этот параметр может быть у всех разный. Я взял 250, так как этот размер хорошо вписывается в сайдбар моего блога.
Height — задаем высоту виджета. Здесь тоже на ваше усмотрение.
Use Small Header — если вы поставите галочку напротив этой настройки, то в таком случае в виджете будет использоваться небольшой заголовок. Решил оставить как есть.
Hide Cover Photo — отметив эту настройку галочкой, из виджета исчезнет обложка вашей группы. Думаю, не стоит ее убирать, с обложкой виджет выглядит более привлекательно.
Show Page Posts — используя эту настройку, в виджете будет отображаться колонка с последними записями из вашего сообщества.
Adapt to plugin container width — адаптация плагина к ширине контейнера. Пробовал убирать и оставлять галочку, изменений в виджете не заметил.
Show Friend’s Faces — оставив галочку напротив этой настройки, в виджете будут отображаться лица ваших подписчиков.

После совершения необходимых настроек, нажмите на кнопку Get Code. Система сформирует вам два кода:код виджета сообщества facebook

Первый код необходимо вставить сразу после открывающего тега <body>, делается это один раз. Находится данный тег в файле header.php.(«Внешний вид» — «Редактор» — «Заголовок»)

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

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

Советуем прочесть следующие статьи:

Поделиться в социальных сетях

ProfitCentr - рекламное агентство
  • https://plus.google.com/110001891884689885189 Юра Фомин
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)

    По-моему дизайн виджета сообщества от фейсбук немного изменился, раньше он выглядел по иному, сейчас более симпатичен. И по-моему раньше он состоял из одного кода, а сейчас два. В общем статья полезная, многим будет наглядным пособием.

    • http://housezarabotok.ru admin
      VA:F [1.9.22_1171]
      Rating: 0 (from 0 votes)

      Да, тоже это заметил. Сейчас какой-то другой стал. А вот насчет кода не могу точно сказать.

  • http://facebook.com/profile.php?id=100007335191798 Irina Davidyuk
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)

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

  • https://www.facebook.com/app_scoped_user_id/538376136313836/ Наталья Хайдельберг
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)

    Спасибо интересная статья и очень полезная. Но у меня не получается, подскажите что делаю не так.

    Ссылку группы когда вставляю в форму пишет «Ошибка не действительный адрес страницы Фэйбук»

    • http://housezarabotok.ru admin
      VA:F [1.9.22_1171]
      Rating: 0 (from 0 votes)

      Здравствуйте, Наталья. Дело в том, что виджет воспринимает ссылки только сообществ типа «Страница», а при размещении ссылок на группы подобного типа, появляется ошибка. Я тоже сперва хотел разместить ссылку на свою группу, в итоге пришлось размещать другую, которую Вы можете видеть сейчас на моем блоге.

  • http://vk.com/id142253571 Lee Lou
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)

    почемy на сайте виджет сдвигает вправо? на 3-4 см где-то, какой бы размер не yказывали

    • http://housezarabotok.ru admin
      VA:F [1.9.22_1171]
      Rating: 0 (from 0 votes)

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

  • https://www.facebook.com/app_scoped_user_id/132390987120365/ Пьер Фошар
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)

    А где найти файл header.php.

    • http://housezarabotok.ru admin
      VA:F [1.9.22_1171]
      Rating: 0 (from 0 votes)

      В админ панели сайта: «Внешний вид» — «Редактор» — «Заголовок»

  • https://www.facebook.com/app_scoped_user_id/552385778260708/ TheCapelia DanceStudio
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)

    Скажите пожалуйста — т. е. изготовление таким образом виджета для ГРУППЫ фейсбука вообще невозможно? Почему же тогда на мою страницу система ругается так же?

    • http://housezarabotok.ru admin
      VA:F [1.9.22_1171]
      Rating: 0 (from 0 votes)

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

  • https://plus.google.com/102781012970430147930 Андрей Кисляк
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)

    Спасибо за подробную инструкцию по размещению плагина на сайт. Оказывается ничего сложного в процессе установки и настройки плагина «Страница» нет.

  • http://vk.com/id8540462 Серёга Сергеевич
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)

    норм статья

  • http://facebook.com/profile.php?id=100007999412840 Elena Maslova
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)

    Подскажите, почему так. Мой сайт zd****ivo.ru я поставила первый код в header, сразу после body, второй код в правый сайдбар и у меня появилось только название группы. Хотя при насстройке плагина на фб я вижу картинку . После этого, я зашла на другую вкладку кода IFrame увидела там шаг2, взяла код оттуда и поставила в сайдбар, картинка появилась. Поясните, я правильно сделала?

    • http://housezarabotok.ru admin
      VA:F [1.9.22_1171]
      Rating: 0 (from 0 votes)

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

  • http://facebook.com/profile.php?id=100007999412840 Elena Maslova
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)

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

    • http://housezarabotok.ru admin
      VA:F [1.9.22_1171]
      Rating: 0 (from 0 votes)

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

  • http://facebook.com/profile.php?id=100007999412840 Elena Maslova
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)

    Картинка шире не становится,хотя, я поменяла размеры. А что Вы можете сказать о том что, pr-cy.ru пишет, что ссылка на страницу группы в фб не найдена. Что еще нужно сделать?

    • http://housezarabotok.ru admin
      VA:F [1.9.22_1171]
      Rating: 0 (from 0 votes)

      Думаю со временем добавится статистика на тот сервис о вашей группе. Не все сразу, у меня тоже не сразу там появилась.
      Не знаю, должна меняться. Вы не меняйте код целиком, а пропишите ручками ширину виджета в самом коде, который размещен в сайдбаре.
      А с лентой новостей разобрались. Смотрю, там небольшие изменения, настройки уже на русском языке. Впрочем ничего не поменялось, если ранее использовали настройку «Show Page Posts» то теперь так, смотрите:

  • http://facebook.com/profile.php?id=100007999412840 Elena Maslova
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)

    А, точно, у них и раньше руками нужно было менять, спасибо огромное!

  • https://www.facebook.com/app_scoped_user_id/1313049025401101/ Ирина Торопина
    VA:F [1.9.22_1171]
    Rating: 0 (from 0 votes)

    Здравствуйте. Нужен совет. Есть достаточно большая группа на Фейсбук. Именно группа, а не страница. И, как у многих, виджет пишет «ошибка URL».Что делать? Набрать группу более 1000 чел. не просто, а теперь всё сначала? Или технически можно группу на Фейсбук полностью перенести на страницу? Или как-то URL всё-таки прописать, чтобы ГРУППА отражалась на сайте?

    • http://housezarabotok.ru admin
      VA:F [1.9.22_1171]
      Rating: 0 (from 0 votes)

      Здравствуйте, Ирина! Технически это сделать невозможно. По крайней мере, на данный момент я не знаю, как сделать, чтобы на сайте вместо страницы могла отображаться группа фейсбук.

      • https://www.facebook.com/app_scoped_user_id/1313049025401101/ Ирина Торопина
        VA:F [1.9.22_1171]
        Rating: 0 (from 0 votes)

        Жаль… На некоторых сайтах я видела кнопку «Нравится» и она чудесным способом переносила людей в группу… а может быть это была страница? Просто так и не различишь: группа это или страница. Наверное только написание кода вручную может решить задачу показа группы на сайте и перехода на неё.

        • http://housezarabotok.ru admin
          VA:F [1.9.22_1171]
          Rating: 0 (from 0 votes)

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