WordPress에 Facebook 그룹 피드를 추가하는 방법

게시 됨: 2021-04-20

사이트에 Facebook 그룹 피드를 추가하시겠습니까? 당신은 바로 이곳에 왔습니다. 이 게시물에서는 Facebook 그룹 피드를 WordPress에 쉽게 추가 하는 2가지 방법을 보여줍니다.

28억 명 이상의 사용자를 보유한 Facebook은 최고의 소셜 미디어 플랫폼 중 하나입니다. 개인과 기업에 광범위한 커뮤니티 옵션을 제공하고 사용자가 동일한 관심사를 가진 사람들과 연결하고 그룹을 찾을 수 있도록 합니다. 이러한 그룹과 커뮤니티는 개인과 비즈니스 소유자 모두에게 매우 유용한 것으로 입증되었습니다. 오늘날 이러한 그룹 중 일부는 사용자가 다양한 주제에 대해 토론하는 포럼이 되었으며 사람들이 서로 다른 제품을 판매하고 구매하는 장소도 되었습니다.

Facebook은 사용자와 비즈니스 모두를 성공적으로 수집했으며 이를 활용할 수 있는 방법이 있습니다. 이 가이드에서는 WordPress 웹사이트에 Facebook 그룹 피드를 추가하는 방법을 보여줍니다. 그러나 프로세스를 진행하기 전에 왜 그렇게 하는 것이 좋은지 살펴보겠습니다.

WordPress에 Facebook 그룹 피드를 포함하는 이유는 무엇입니까?

웹사이트에 Facebook 그룹 피드를 추가하면 많은 이점이 있습니다 . Facebook을 사용하면 그룹을 생성하여 비즈니스 또는 서비스에 대한 활성 커뮤니티로 전환할 수 있습니다. 이는 실제로 Facebook 그룹에서 직접 상호 작용할 수 있으므로 청중과의 참여를 높이는 가장 좋은 방법 중 하나입니다.

따라서 사이트에 그룹 피드를 추가하면 방문자가 토론을 팔로우하고 사이트에서 그룹을 방문할 수 있습니다. 이것은 또한 당신과 당신의 청중 사이에 더 많은 상호작용의 가능성을 증가시킬 수 있습니다. 게다가 마케팅 관점에서 페이스북 그룹을 현명하게 활용한다면 웹사이트 트래픽을 높이는 데도 도움이 될 수 있다.

그룹에 더 많이 참여하면 사이트에 대한 트래픽을 확보 하고 판매를 늘릴 수 있습니다 . 그룹 덕분에 귀하를 알고 업계에서 존경받는 권위자로 보는 사용자는 귀하로부터 구매할 가능성이 더 큽니다. 예를 들어, 우리의 경우 사람들이 WooCommerce 주제에 대해 토론할 수 있는 QuadLayers용 Facebook 그룹을 만들었으며 이것이 우리 웹사이트에 유익한 것으로 입증되었습니다.

이점을 더 잘 이해했으므로 이제 WordPress 사이트에 Facebook 그룹 피드를 추가 하는 과정을 살펴보겠습니다.

WordPress에 Facebook 그룹 피드를 추가하는 방법은 무엇입니까?

Facebook 그룹 피드를 추가하는 것은 매우 쉽고 두 가지 방법을 사용하여 추가할 수 있습니다.

  1. 공식 Facebook 페이지 플러그인 사용
  2. 전용 WordPress 플러그인 사용

1. Facebook 페이지 플러그인으로 Facebook 그룹 피드 추가

Facebook은 웹사이트에 소셜 미디어 옵션을 추가할 수 있는 다양한 사용자 지정 옵션을 제공합니다. 코드 조각과 함께 사용할 수 있는 많은 개발자 도구가 있습니다. 페이지 플러그인 은 이러한 도구 중 하나이며 WordPress 사이트에 그룹 피드를 쉽게 추가할 수 있습니다.

이것은 개발자에게 친숙한 접근 방식이므로 코딩 및 프로그래밍에 대한 기본 지식이 있는 경우 좋은 옵션입니다.

1.1. Facebook 그룹 피드 구성 및 사용자 지정

페이지 플러그인을 사용하여 Facebook 피드를 추가하려면 Facebook 개발자 커뮤니티의 플러그인 페이지로 이동하여 웹사이트에 표시할 Facebook 그룹 또는 페이지에 대한 링크를 추가하세요. 링크를 얻으려면 그룹의 Facebook 홈페이지를 열고 URL을 복사하기만 하면 됩니다.

그런 다음 Facebook 페이지 URL 텍스트 상자에 URL을 붙여넣습니다. 마찬가지로 웹 사이트에 그룹 피드를 표시하려는 방법에 따라 탭, 너비 및 높이에 대한 세부 정보를 추가할 수 있습니다.

페이스북 페이지 플러그인 페이스북 그룹 피드 추가

또한 더 작은 헤더를 사용하거나 표지 사진을 숨기거나 플러그인 컨테이너를 너비에 맞게 조정하거나 친구의 얼굴을 표시할 수 있습니다. 선택에 만족하면 사이트에서 피드의 실시간 미리보기를 볼 수 있습니다. 그런 다음 피드에 만족할 때까지 미리보기를 기반으로 추가로 변경할 수 있습니다.

1.2. 웹사이트에 대한 그룹 피드 코드 받기

그룹 피드 사용자 지정을 완료했으면 코드 가져오기 를 누릅니다.

이제 JavaScript SDK 탭에서 그룹 피드에 대한 두 세트의 코드 스니펫을 볼 수 있습니다. iFrame 탭 아래에 iFrame을 포함한 코드 세트도 표시됩니다. 이 코드를 복사하여 웹사이트에 붙여넣어야 합니다.

1.3. 웹사이트에 코드 추가

추가하기 전에 테마 파일에는 웹사이트에 대한 매우 민감한 정보가 포함되어 있습니다. 따라서 실수로 변경하거나 문제가 발생하면 사이트가 손상될 수 있습니다. 그렇기 때문에 변경하기 전에 웹사이트를 완전히 백업하고 하위 테마를 만드는 것이 좋습니다.

완료되면 첫 번째 JavaScript SDK 코드를 테마 파일에 추가해야 합니다.

자바 스크립트 첫 번째 코드 페이스 북 그룹 피드 추가

코드를 복사한 다음 WordPress 대시보드에서 모양 > 테마 편집기 로 이동합니다. 화면 오른쪽에 있는 header.php 파일을 열고 body 태그를 연 직후에 코드를 붙여넣고 파일을 업데이트 합니다.

코드와 테마 파일은 사용 중인 테마에 따라 약간 다를 수 있지만, 아래와 같이 보일 것입니다.

테마 편집기 페이스북 그룹 피드 추가

마찬가지로 두 번째 코드를 추가해야 합니다. 이 경우 웹사이트에서 그룹 피드를 표시하려는 위치에 배치할 수 있습니다.

코드 편집기를 사용하여 코드를 복사하고 원하는 대상에 붙여넣기만 하면 됩니다.

아이프레임

또는 iFrame 코드를 사용하려는 경우에도 동일하게 수행할 수 있습니다. 그러나 테마 파일에 복사하여 붙여넣을 필요는 없습니다. 코드 편집기를 사용하여 웹사이트의 원하는 위치에 붙여넣기만 하면 됩니다.

iframe 코드 페이스북 그룹 피드 추가

예를 들어, 이 데모에서는 텍스트 위젯을 사용하여 모양 > 위젯 의 오른쪽 사이드바에 추가했습니다. 그런 다음 사이트를 미리 보고 어떻게 보이는지 확인합니다.

그게 다야! 공식 Facebook 페이지 플러그인을 사용하여 Facebook 그룹 피드를 추가 하는 방법입니다.

사이드바 페이스북 그룹 피드 페이스북 그룹 피드 추가

2. WordPress 플러그인을 사용하여 Facebook 그룹 피드 추가

코딩 기술이 없고 핵심 파일을 편집하는 것이 불편하다면 플러그인을 사용하여 WordPress 사이트에 Facebook 그룹 피드를 추가할 수 있습니다.

사용할 수 있는 소셜 미디어 플러그인이 많이 있습니다. 이 튜토리얼에서는 Smash Balloon Social Post Feed 를 사용할 것입니다.

Facebook 그룹 피드를 WordPress에 손쉽게 추가하고 Facebook 그룹 피드에 대한 광범위한 사용자 지정 옵션을 제공하는 사용하기 쉬운 프리미엄 플러그인입니다.

이 플러그인을 사용하여 Facebook 그룹 피드를 추가하는 방법을 단계별로 살펴보겠습니다.

2.1. 플러그인 설치 및 활성화

먼저 플러그인을 설치하고 활성화해야 합니다. WordPress 대시보드에서 플러그인 > 새로 추가 로 이동하여 플러그인을 찾습니다. 그런 다음 지금 설치 및 활성화 를 클릭합니다.

samsh balloon 소셜 포스트 피드 설치 플러그인 페이스북 그룹 피드 추가

이 프로세스에 익숙하지 않은 경우 WordPress 플러그인을 수동으로 설치하는 방법에 대한 가이드를 확인하세요.

2.2. Facebook 그룹에 연결

플러그인을 활성화한 후 대시보드에서 Facebook 피드 탭을 열면 구성 탭이 표시됩니다. 여기에 Facebook 계정을 연결해야 합니다. Facebook 계정 연결을 눌러 계정을 자동으로 연결합니다.

그런 다음 웹 사이트에 Facebook 페이지를 표시할지 그룹을 표시할지 결정해야 합니다. 그룹을 추가할 것이므로 Facebook 그룹 을 선택하고 계속 을 누르십시오.

자동으로 Facebook 계정을 감지하므로 계속 사용하려는 Facebook 계정을 선택하기만 하면 됩니다.

그러면 Facebook 계정이 속한 모든 그룹의 목록과 그룹 ID가 제공됩니다. 표시할 그룹을 선택하고 이 그룹에 대해 토큰 사용 을 클릭하여 토큰을 가져옵니다.

그러면 Smash Balloon 앱을 추가하는 방법에 대한 팝업 메시지가 표시됩니다. 단계를 수행한 다음 완료 를 누릅니다.

팝업 메시지 페이스북 그룹 피드 추가

그런 다음 Facebook 그룹이 Facebook Feed WordPress 메뉴의 대시보드에 나열됩니다. 페이지 ID와 Facebook 액세스 토큰이 자동으로 채워집니다. 설정 저장 을 선택하여 Facebook 그룹 계정을 저장합니다.

스매시 풍선 대시보드 페이스북 그룹 피드 추가

또는 수동으로 계정 연결 버튼을 클릭하여 그룹을 수동으로 연결할 수 있습니다. 그러나 프로세스가 더 쉽고 빠르므로 그룹을 자동으로 연결하는 것이 좋습니다.

2.3. Smash Balloon 앱으로 Facebook 그룹 연결

플러그인이 원활하게 작동하도록 하려면 Facebook 그룹에 Smash Balloon 앱도 추가해야 합니다. 이렇게 하려면 Facebook 그룹 페이지로 이동하여 설정 을 엽니다.

고급 설정 관리 아래에 앱 편집 옵션이 표시됩니다. 편집 아이콘을 클릭하여 추가합니다.

Facebook 그룹의 모든 활성 앱이 표시됩니다. 앱 추가 를 눌러 그룹에 새 앱을 추가합니다.

앱 추가 Facebook 그룹 피드 추가

이제 Smash Balloon을 검색하고 선택하십시오.

스매시 풍선 페이스북 그룹 앱 페이스북 그룹 피드 추가

마지막으로 추가 를 눌러 Facebook 그룹에 앱을 추가합니다.

스매시 풍선 추가 페이스북 그룹 앱 페이스북 그룹 피드 추가

2.4. Facebook 그룹 피드 사용자 지정

Facebook 피드 > 설정 에서 아래로 스크롤하면 Facebook 그룹 피드를 추가하기 위한 몇 가지 추가 설정을 찾을 수 있습니다. 표시할 게시물 수, 시간대, 페이지에 표시할 게시물 등 다양한 옵션을 변경할 수 있습니다. 필요한 사항을 변경하고 설정을 저장 하는 것을 잊지 마십시오.

또한 사용자 지정 탭 아래에 추가 사용자 지정 옵션이 있습니다. 여기에 사용자 정의할 수 있는 여러 섹션이 있습니다.

일반 섹션에서는 일반 정보, 게시물 유형, 헤더 레이아웃(예: 상자 및 페이지 플러그인)에서 다양한 옵션을 개인화할 수 있습니다.

일반 스매시 풍선 소셜 게시물 피드 사용자 정의 Facebook 그룹 피드 추가

또한 다양한 게시물 레이아웃을 사용자 정의하고 게시물 레이아웃 섹션에서 그룹 피드에 표시하거나 숨길 항목을 선택할 수 있습니다. 그러나 포스트 레이아웃은 플러그인의 프리미엄 버전에서만 사용할 수 있습니다.

스타일 게시물 섹션에서는 게시물 항목, 텍스트, 설명, 작성자, 날짜 등을 사용자 지정할 수 있습니다. 여기에서 이벤트 세부 정보, 댓글 상자 및 사후 조치 링크를 편집할 수도 있습니다.

기타 탭에서 사용자 정의 CSS 및 JavaScript를 추가하고 GDPR, 미디어(프리미엄) 및 기타 기타 설정을 편집할 수 있습니다. 마지막으로 사용자 정의 텍스트/번역 섹션에서 텍스트를 사용자 정의하고 웹사이트에 표시하려는 거의 모든 원본 텍스트를 번역할 수 있습니다.

맞춤설정이 끝나면 변경사항을 저장 해야 합니다.

2.5. 웹사이트에 Facebook 그룹 피드 추가

Smash Balloon을 사용하면 두 가지 방법으로 Facebook 그룹 피드를 사이트에 추가할 수 있습니다. 플러그인이 Gutenberg와 호환되므로 단축 코드 또는 Facebook 피드 블록을 사용할 수 있습니다.

블록 편집기를 사용하려면 피드를 표시할 페이지 또는 게시물을 열고 " + "를 클릭하여 새 블록을 추가합니다. 그런 다음 "맞춤형 Facebook 피드" 블록을 검색하여 선택합니다.

또는 게시물 및 페이지 이외의 다른 위치에 Facebook 그룹 피드를 추가하려는 경우 단축 코드를 사용할 수 있습니다. 피드의 단축 코드는 Facebook 피드 대시보드의 페이지 하단에 제공됩니다. 복사하여 웹사이트의 원하는 위치에 배치하기만 하면 됩니다.

단축 코드 페이스북 그룹 피드 추가

그런 다음 변경 사항을 저장하는 것을 잊지 마십시오. 그러면 프론트엔드에서 Facebook 그룹을 볼 수 있습니다.

보너스: Divi에 Facebook 그룹 피드를 포함하는 방법

WordPress 사이트에 Facebook 그룹 피드를 추가하는 다양한 방법을 보여 드렸습니다. 이제 Divi를 사용하여 그렇게 하는 방법을 살펴보겠습니다. 프로세스는 매우 유사하며 몇 분도 걸리지 않습니다.

테마 옵션의 통합 섹션에 있는 Facebook 페이지 플러그인의 코드를 복사하여 붙여넣기만 하면 됩니다. 단계별로 수행하는 방법을 살펴보겠습니다.

Divi 테마 설치

Divi를 사용하여 Facebook 그룹 피드를 추가하려면 먼저 Divi 테마 를 설치해야 합니다. WordPress 대시보드에서 모양 > 테마 로 이동하고 테마 컬렉션에서 새로 추가 버튼 또는 새 테마 추가 옵션 을 클릭합니다.

Divi는 WordPress.org 테마 저장소에서 사용할 수 없으므로 업로드해야 합니다. 테마 업로드 를 클릭하고 Divi 구매 시 다운로드한 zip 파일을 선택합니다.

테마 업로드 페이스북 그룹 피드 추가

지금 설치를 눌러 테마를 설치하고 설치가 완료된 후 활성화 합니다.

Facebook 페이지 플러그인에서 코드를 가져와 웹사이트에 붙여넣기

그런 다음 Facebook for Developers 페이지의 공식 Facebook 페이지 플러그인에서 코드를 가져와야 합니다. 이전에 설명한 것과 유사하게 그룹의 URL을 가져와 Facebook 페이지 URL 의 텍스트 상자에 붙여넣습니다. 피드를 사용자 정의하고 만족스러우면 코드 받기 를 누르십시오.

그런 다음 JavaScript SDK 탭 아래에 있는 첫 번째 코드 세트를 복사하고 WordPress 대시보드에서 Divi > 테마 옵션 으로 이동합니다. 통합 탭을 열고 <body 태그>에 코드를 추가할 텍스트 상자를 찾아 여기에 붙여넣습니다.

divi 테마 옵션은 페이스북 그룹 피드를 추가합니다.

그런 다음 두 번째 코드를 복사하고 코드 편집기를 사용하여 그룹 피드를 표시하려는 위치에 추가합니다.

또는 iFrame 코드를 사용하고 이전 단계를 모두 피할 수 있습니다. iFrame 탭을 열고 그룹 피드를 표시할 코드를 복사하여 붙여넣기만 하면 됩니다.

Divi Builder로 페이지나 게시물을 편집할 수도 있습니다. 그런 다음 원하는 위치에 텍스트 상자를 추가하고 Text(Code) 편집기 아래에 코드를 붙여넣고 변경 사항을 저장합니다.

마지막으로 프런트 엔드에서 Facebook 그룹 피드를 볼 수 있습니다.

divi 페이스북 그룹 피드 페이스북 그룹 피드 추가

결론

대체로 그룹 피드를 추가하고 방문자가 토론을 팔로우하고 사이트에서 그룹을 방문하도록 하면 청중과의 참여를 늘리고 사이트 트래픽을 높일 수 있는 좋은 방법이 될 수 있습니다.

이 자습서에서는 WordPress에 Facebook 그룹 피드를 추가하는 두 가지 방법을 보여주었습니다.

  • 공식 Facebook 페이지 플러그인으로
  • Smash Balloon 소셜 게시물 피드 사용

코드에 익숙하고 테마 파일 편집에 익숙하다면 Facebook 페이지 플러그인을 사용할 수 있습니다. 그렇지 않으면 Smash Balloon(또는 선호하는 다른 도구)을 사용하고 수많은 사용자 정의 옵션이 있는 그룹 피드를 추가할 수 있습니다.

또한 Divi에서 프로세스를 단계별로 보여주었습니다. Facebook 페이지 플러그인에서 통합을 위한 코드를 직접 추가하면 됩니다.

이 튜토리얼이 도움이 되었다면 흥미로운 다른 기사가 있습니다.

  • WordPress에 Facebook 위젯을 추가하는 방법
  • WordPress용 Divi 테마: 전체 검토
  • WooCommerce용 Facebook Shop: 전체 가이드

사이트에 그룹 피드를 추가했습니까? 어떤 방법을 사용하셨나요? 다른 방법을 알고 있습니까? 아래 의견 섹션에서 알려주십시오!