Как создать индивидуальную ленту Facebook в WordPress

Хотите создать индивидуальную ленту Facebook в WordPress?

Настраиваемая лента позволяет показывать сообщения с вашей страницы Facebook или группы на вашем веб-сайте WordPress. Это может сделать ваш сайт более привлекательным и побудить посетителей следовать за вами на Facebook.

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

Зачем создавать индивидуальную ленту Facebook в WordPress?

Facebook с почти 3 миллиардами активных пользователей в месяц является крупнейшей социальной сетью в мире. Как владелец веб-сайта, вы, возможно, уже создали страницу или группу в Facebook, где взаимодействуете со своей аудиторией.

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

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

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

Если вы используете пиксель ремаркетинга/ретаргетинга Facebook на своем веб-сайте, вы также можете показывать таргетированную рекламу своим посетителям.

Сказав это, давайте посмотрим, как добавить пользовательскую ленту Facebook на ваш сайт WordPress.

Установка пользовательского плагина ленты Facebook

Лучший способ добавить пользовательскую ленту Facebook на ваш веб-сайт WordPress — использовать плагин Smash Balloon Custom Facebook Feed.

Этот плагин позволяет отображать контент и комментарии Facebook прямо на вашем сайте и даже объединять сообщения из нескольких каналов Facebook. Это также позволяет легко отображать мощное социальное доказательство, встраивая обзоры Facebook и сообщения сообщества на ваш веб-сайт.

Первое, что вам нужно сделать, это установить и активировать плагин Smash Balloon Custom Facebook Feed. Для получения дополнительной информации см. Наше руководство по установке плагина WordPress.

В этом посте мы будем использовать профессиональную версию Smash Balloon, поскольку она позволяет показывать видео и фотографии в вашей ленте Facebook, выбирать различные макеты, фильтровать ленту в зависимости от типа публикации и многое другое.

Тем не менее, есть также бесплатная версия, которая позволяет вам создавать собственную ленту Facebook для WordPress, независимо от вашего бюджета.

После активации вам нужно будет перейти в Facebook Feed »Настройки и ввести свой лицензионный ключ в поле «Лицензионный ключ».

Вы найдете эту информацию в своей учетной записи на веб-сайте Smash Balloon.

После ввода ключа нажмите на кнопку «Активировать».

Подключите свою страницу или группу Facebook к WordPress

Smash Balloon Custom Facebook Feed позволяет создавать несколько каналов с разных страниц и групп Facebook. Вы даже можете объединить каналы, чтобы создать собственный канал.

Чтобы создать свой первый канал, перейдите в раздел « Лента Facebook» »Все каналы и нажмите «Добавить новый».

Smash Balloon позволяет отображать сообщения из вашей хроники, фотографии, видео, альбомы, события и многое другое. Для этого руководства мы создадим ленту «Временная шкала» Facebook, но вы можете выбрать любой тип ленты.

После выбора типа фида нажмите кнопку «Далее».

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

Чтобы начать, нажмите «Добавить новый».

На следующем экране выберите, создаете ли вы ленту со страницы или группы Facebook.

Затем просто нажмите «Подключиться к Facebook».

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

Сделав свой выбор, нажмите кнопку «Далее».

Как только вы это сделаете, Facebook покажет всю информацию, к которой будет иметь доступ Smash Balloon, и действия, которые он может выполнять.

Чтобы ограничить доступ Smash Balloon к вашей учетной записи Facebook, просто нажмите любой из переключателей, чтобы переключить их с «Да» на «Нет». Просто имейте в виду, что это может повлиять на контент, который вы можете показывать в пользовательской ленте Facebook.

Имея это в виду, мы рекомендуем оставить все эти переключатели включенными.

Когда будете готовы, нажмите «Готово».

Через несколько секунд вы должны увидеть сообщение о том, что вы успешно связали свой веб-сайт WordPress с Facebook. Теперь вы можете нажать «ОК».

После этого Smash Balloon автоматически вернет вас на панель инструментов WordPress.

Как создать индивидуальную ленту Facebook в WordPress

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

Если вы случайно закрыли всплывающее окно, не паникуйте. Вы можете просто обновить вкладку, чтобы снова открыть всплывающее окно.

Как только вы это сделаете, вы вернетесь на страницу Facebook Feed »All Feeds .

Как и раньше, нажмите кнопку «Добавить новый», а затем выберите тип пользовательской ленты Facebook, которую вы хотите создать, например «Временная шкала», «Фотографии» или «Видео».

Затем нажмите «Далее». Теперь в разделе «Выберите источник» вы увидите свою группу или страницу Facebook в качестве опции.

Идите вперед и выберите страницу или группу, а затем нажмите «Далее».

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

Мы будем использовать шаблон «По умолчанию», но вы можете использовать любой другой шаблон.

Выбрав дизайн, нажмите кнопку «Далее».

Теперь Smash Balloon создаст ленту Facebook на основе вашего источника и выбранного шаблона. Это отличное начало, но вы можете настроить отображение этого фида на своем веб-сайте.

Как настроить ленту Facebook

Плагин Smash Balloon Custom Facebook Feed дает вам множество способов настроить вашу ленту. Имея это в виду, стоит посмотреть, какие изменения вы можете внести.

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

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

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

Для начала вы можете изменить способ отображения ваших сообщений, нажав «Макет ленты».

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

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

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

Вы можете просмотреть, как ваши изменения будут выглядеть на настольных компьютерах, планшетах и ​​смартфонах, используя ряд кнопок в правом верхнем углу.

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

По умолчанию лента Facebook показывает меньше столбцов на смартфонах и планшетах по сравнению с настольными компьютерами. Это помогает удобно разместить весь ваш контент на небольших экранах.

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

Когда вы будете довольны внесенными изменениями, нажмите ссылку «Настроить» в верхней части меню.

Это вернет вас в главный редактор Smash Balloon.

Затем вы можете нажать «Цветовая схема» в меню слева и посмотреть на различные цвета, которые вы можете добавить в ленту Facebook.

По умолчанию Smash Balloon использует цветовую схему, унаследованную от вашей темы WordPress, но вы также можете выбрать «Светлая» или «Темная» или даже создать свою собственную цветовую схему.

По умолчанию Smash Balloon добавляет заголовок к вашей ленте, который представляет собой изображение вашего профиля Facebook и название вашей страницы или группы.

Чтобы изменить внешний вид, нажмите «Заголовок» в меню слева.

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

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

Далее идет экран «Сообщения». Здесь вы можете изменить способ отображения отдельных сообщений в пользовательской ленте Facebook.

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

По умолчанию Smash Balloon не включает кнопку «Нравится» Facebook в вашу ленту.

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

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

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

Когда вы довольны тем, как выглядит кнопка «Мне нравится», вы можете перейти к экрану «Загрузить еще кнопку».

Кнопка «Загрузить еще» побуждает посетителей прокручивать больше вашей ленты Facebook.

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

Другой вариант — полностью удалить кнопку «Загрузить еще», щелкнув переключатель «Включить», чтобы он стал серым.

Отключение кнопки «Загрузить еще» полезно, если ваша лента Facebook зависит от времени. При этом посетителям не нужно прокручивать ваши предыдущие посты, которые к ним не относятся.

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

Теперь вы готовы добавить ленту Facebook на свой сайт WordPress.

Как добавить свою собственную ленту Facebook в WordPress

Вы можете добавить свою собственную ленту Facebook с помощью блока, виджета или шорткода.

Если вы создали более одного пользовательского канала, вам необходимо знать код канала, если вы собираетесь использовать блок или виджет.

Просто зайдите в Facebook Feed » All Feeds и посмотрите на часть шорткода, помеченную как feed="" . Это значение, которое вам нужно добавить к блоку или виджету, так что запишите его.

На следующем изображении нам нужно использовать feed="1" .

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

Просто откройте страницу или пост, где вы хотите показать ленту. Затем нажмите значок «+», чтобы добавить новый блок, и начните вводить «Пользовательская лента Facebook».

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

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

Теперь вы можете добавить код feed="" в это поле. После этого нажмите «Применить изменения».

Теперь в блоке будет отображаться ваша пользовательская лента Facebook, и вы можете опубликовать или обновить страницу, чтобы она появилась на вашем веб-сайте.

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

Чтобы начать, перейдите в Внешний вид » Виджеты на панели инструментов WordPress. Затем нажмите синюю кнопку «+».

Теперь вы можете найти виджет «Пользовательская лента Facebook».

Затем просто перетащите его в область, где вы хотите показать ленту.

Опять же, Smash Balloon по умолчанию покажет один из ваших пользовательских каналов Facebook.

Чтобы отобразить другой канал, введите код канала в поле «Настройки короткого кода», а затем нажмите «Применить изменения».

Теперь вы можете нажать на кнопку «Обновить».

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

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

Просто перейдите в Лента Facebook » Все ленты и скопируйте код в столбец «Шорткод». Теперь вы можете добавить этот код на свой сайт.

Для получения дополнительной информации о том, как разместить шорткод, ознакомьтесь с нашим руководством о том, как добавить шорткод в WordPress.

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

Если вам понравилась эта статья, подпишитесь на наш канал YouTube для видеоуроков по WordPress. Вы также можете найти нас в Twitter и Facebook.