WordPress 웹사이트에 Facebook 로그인을 통합하는 방법

게시 됨: 2017-11-02

WordPress 웹사이트에 Facebook 소셜 로그인을 추가하는 것을 고려하는 데에는 여러 가지 이유가 있습니다. 우선, 사용자 경험에 좋습니다. 등록하려는 새 웹사이트나 앱에 대해 또 다른 사용자 이름과 비밀번호를 생성해야 하는 것이 얼마나 짜증나는 일인지 생각해 보세요. Facebook 로그인은 사용자가 자신의 Facebook 자격 증명을 사이트에 연결할 수 있도록 하여 해당 프로세스를 단순화합니다. 짜잔! 땀을 흘리지 않고 즉시 액세스할 수 있습니다.

또한 구현을 정말 쉽게 만들어주는 몇 가지 고품질 Facebook 로그인 WordPress 플러그인이 있습니다.

관련 항목: 좋아요 상자, 페이지 피드 및 이벤트를 위한 9가지 WordPress Facebook 위젯

그러면 당신에게 이익이 있습니다. WordPress에 Facebook 로그인을 활성화하면 사용자에 대한 풍부한 정보를 쉽게 사용할 수 있습니다. 물론, 당신이 요구하는 것에 욕심을 내고 싶지는 않습니다. 특정 정보에 대한 접근 권한만 요청해야 합니다. 그리고 이것이 사이트 속도에 영향을 미치지 않는지 확인해야 합니다. 즉, Facebook에 연결된 사용자로부터 다음 사항에 대해 알아볼 수 있습니다.

  • 이름(이메일을 개인화하는 데 적합)
  • 웹사이트에 가입하는 데 사용하는 가짜 이메일 주소가 아닌 실제 이메일 주소입니다.
  • 성별, 나이, 위치, 모국어 등 기타 개인 특성은 마케팅 활동을 개인화하는 데 도움이 될 수 있습니다.
  • Facebook의 '좋아요'에 액세스하면 알려진 선호도를 기반으로 사이트에서 더욱 개인화된 서비스를 만들 수 있습니다.
  • Facebook 친구 목록에 액세스하면 친구가 구매한 제품을 기반으로 추천을 제공하여 쇼핑 경험을 향상할 수 있습니다.

Facebook 사용자의 공개 프로필에서 얻을 수 있는 다른 정보도 있습니다. 그러나 위의 세부정보만으로도 귀하의 사이트(및 비즈니스)가 귀하의 소비자 기반을 통해 새로운 기회를 얻을 수 있을 것입니다.

따라서 사용자에게 웹 사이트에 대한 액세스 권한을 부여해야 하는 경우 Facebook 로그인 버튼을 사용하는 것이 좋습니다. 다음은 방문자를 위한 보안 환경을 유지하면서 개발자용 Facebook을 사용하고 플러그인, JavaScript 또는 PHP를 선택하여 Facebook 소셜 로그인을 WordPress 웹사이트에 통합하는 방법에 대한 빠른 Facebook 로그인 WordPress 튜토리얼입니다.

WP Buffs 팀은 웹사이트 소유자, 대행사 파트너 및 프리랜서 파트너가 Facebook 로그인을 웹사이트에 통합하도록 돕습니다. 1개의 웹사이트를 관리해야 하거나 1000개의 클라이언트 사이트를 지원해야 하든 우리가 도와드립니다.

WordPress에 Facebook 로그인을 통합하는 방법

Facebook은 WordPress 개발자를 위해 Facebook 로그인 통합을 매우 간단하게 만들었습니다. WordPress에 Facebook 로그인을 추가하는 것이 그 어느 때보다 쉬워졌습니다! 수행해야 할 작업은 다음과 같습니다.

1단계: 개발자 계정 만들기

이전에 Facebook 앱을 만든 적이 없다면 Facebook에서 개발자 계정을 설정해야 합니다. 여기서 할 수 있습니다.

개발자를 위한 Facebook

2단계: 새 앱 만들기

이제 Facebook for Developers 하위 도메인에서 귀하의 계정으로 새 앱을 만들 수 있습니다. 해당 버튼은 화면 오른쪽 상단에 있습니다. 클릭하세요.

3단계: 새 앱 ID 만들기

이 앱을 귀하가 만든 다른 앱과 구별하려면 새 앱 ID를 만들어야 합니다. 이름에 'Facebook'이라는 단어(또는 'face'가 포함된 모든 항목)를 사용하지 마세요. "새 로그인"과 같은 것이 필요합니다. 여기에서도 Facebook에 로그인하는 데 사용하는 것과 동일한 이메일을 사용해야 합니다.

그런 다음 앱 ID 만들기를 클릭합니다.

4단계: 제품 생성

Facebook 앱 페이지에서 앱 목록에 새 제품을 추가해야 합니다.

오른쪽 모듈에서 Facebook 로그인을 찾아 마우스를 올려 설정을 클릭하세요.

5단계: 기술 선택

이 로그인을 WordPress 사이트에 추가하므로 웹 버튼을 선택해야 합니다. 모바일 앱에 추가하기로 결정한 경우 이 프로세스를 반복하고 해당 옵션을 선택해야 합니다.

6단계: 웹사이트 입력

이 로그인 버튼을 사용할 위치에 대해 요청된 정보를 Facebook에 제공하세요.

7단계: SDK 복사

JavaScript용 Facebook SDK(소프트웨어 개발 키트)를 복사합니다. 이는 기본적으로 귀하의 사이트와 Facebook 간의 통신 라인을 여는 Facebook의 API입니다.

사용자로부터 수집할 수 있는 "권한"(기본적으로 Facebook이 사용자에 대해 수집하는 모든 세부적인 데이터 조각)을 설정하려는 경우 해당 정보를 수집하기 위해 특정 매개변수를 추가할 수도 있습니다. 귀하가 요청한 내용이 너무 지나친 경우 Facebook에서는 귀하에게 그 이유를 정당화해야 하며 이 앱의 사용을 승인하기 전에 이를 검토할 것이라는 점을 명심하세요. 그러니 현명하게 선택하세요.

8단계: 로그인 버튼 구성

로그인 버튼의 코드를 복사하기 전에 원하는 모양으로 구성했는지 확인하세요. 해당 설정을 업데이트하는 방법에 대한 자세한 내용은 여기에서 확인할 수 있습니다.

Facebook은 또한 더 높은 전환율을 위해 로그인 버튼을 단어로 표현하는 방법에 대한 유용한 팁과 스타일 가이드를 준수하는 데 도움이 되는 정보를 여기에서 제공합니다. Facebook은 이 페이지에서 원하는 대로 로그인을 업데이트할 수 있는 다른 방법을 제공하므로 사이트에 복사하고 저장하기 전에 코드를 원하는 대로 정확하게 조정할 수 있도록 주의 깊게 주의 깊게 읽어 보시기 바랍니다.

그런 다음 페이지에 버튼을 삽입하는 데 필요한 코드를 복사할 수 있습니다.

9단계: 대시보드 검토

이제 앱이 생성되면 대시보드에서 앱 ID 번호와 앱 비밀 코드(나중에 필요함)를 포함한 세부 정보를 확인할 수 있습니다. 또한 앱이 사이트에 게시되면 앱 분석에 액세스할 수도 있습니다.

10단계: Facebook 로그인을 WordPress에 통합

마지막 단계는 다음과 같습니다. 실제로 웹사이트에 로그인 버튼을 추가하는 것입니다. 물론 가장 쉬운 방법은 WordPress 플러그인을 사용하는 것이지만 다른 옵션도 사용할 수 있습니다.

WordPress용 최고의 Facebook Facebook 로그인 플러그인이 있나요? 우리는 다음이 모두 좋은 선택이라고 생각합니다.

사이트의 사용자 경험 개선이 항상 방문자가 접하는 프런트 엔드와 관련된 것은 아닙니다. 또한 사용자를 위해 WordPress 관리 영역에 대한 액세스를 간소화해야 할 수도 있습니다.

Nextend Facebook Connect 플러그인을 사용하면 WordPress 로그인 화면에서 Facebook 로그인을 활성화할 수 있습니다. 플러그인의 기능은 간단하지만 관리자 로그인 화면을 아무리 사용자 정의하더라도 작업이 잘 완료되고 보기에도 좋습니다. 또한 이 플러그인의 정말 멋진 점은 Nextend가 사용자에게 자신만의 "Facebook에 연결" 로그인 버튼을 만들 수 있는 기능을 제공한다는 것입니다.

플러그인을 활성화하면 Facebook을 WordPress에 동기화하기 위해 따라야 할 권장 단계가 표시됩니다. 운 좋게도 이미 Facebook 앱을 만들고 필요한 모든 특수 코드를 생성했습니다. 지금 해야 할 일은 아래 필드에 정보를 제출하는 것뿐입니다.

WordPress 사이트에서 플러그인 사용

이제 WordPress 사이트에 Facebook 로그인을 추가하는 것에 대해 이야기할 때 일반적으로 현장 사용자를 위한 프로세스를 간소화하려는 경우입니다. 즉, 클릭 한 번으로 Facebook에 로그인하여 댓글 제출, 양식 작성, 구매 또는 기타 작업을 완료할 수 있습니다.

일반 사용자 등록 및 실제 웹사이트 로그인을 위해 Facebook 로그인을 활성화하려면 다음 플러그인 중 하나를 사용할 수 있습니다.

Facebook 로그인은 Facebook과 Facebook에서만 작동합니다. 다른 소셜 로그인 기능이 포함되어 있지 않기 때문에 다른 옵션보다 설정이 훨씬 더 가볍고 간단할 것입니다. 예를 들어, 이 플러그인의 설정은 다음과 같습니다.

이 플러그인의 유일한 단점은 사용자가 로그인할 수 있는 옵션을 제한한다는 것입니다. 따라서 방문자가 Facebook 이외의 다른 채널에서 활동하고 있다는 것을 알고 있다면 보다 포괄적인 소셜 로그인 플러그인 중 하나를 사용하는 것이 좋습니다.

Super Socializer는 다양한 소셜 미디어 로그인 옵션을 추가할 수 있는 기능을 제공하는 플러그인 중 하나입니다(현재 동기화할 수 있는 플랫폼이 100개가 넘습니다). 뿐만 아니라, 이 플러그인은 사용자 정의 기능으로 가득 차 있어 소셜 로그인 버튼의 디자인, 레이아웃 및 사용을 다양하게 조정할 수 있습니다.

예상할 수 있듯이 사이트에 이 플러그인을 활성화할 때 정의해야 할 설정이 더 많이 있습니다. 댓글 달기, 좋아요 누르기, 공유하기, 로그인하기 등 이 플러그인을 사용할 수 있는 다양한 방법이 있으므로 각 페이지를 꼭 읽어보세요.

그런 다음 각 탭을 하나씩 살펴보고 어떤 소셜 플랫폼을 활성화하고 싶은지, 어떤 모습을 원하는지, 어떤 말을 하고 싶은지 등을 평가해야 합니다.

또한 일부 사용자에게는 이 플러그인이 방해가 된다고 생각할 수도 있다는 점을 고려하세요. 이 플러그인의 개발자는 이미 그 가능성을 고려했으며 알림 팝업을 제공할지 또는 방문자가 기능을 비활성화한 경우 방문자에게 이러한 옵션을 제공할지 결정할 수 있는 옵션을 바로 제공합니다.

그리고 물론 이것들은 모두 플러그인이기 때문에 사이트에 버튼을 추가하기 위해 코딩 작업을 할 필요가 없습니다. 선택한 플러그인에 Facebook 앱 ID 정보를 입력한 후 표시하려는 위치에 단축 코드를 붙여넣으면 됩니다. 그러면 완전히 작동하는 Facebook 로그인 버튼을 사용할 수 있습니다!

HTML 업데이트

Facebook에 저장된 JavaScript 코드용 SDK를 사용하면 간단히 HTML을 업데이트하여 WordPress 웹사이트에 Facebook 로그인을 쉽게 추가할 수 있습니다. Facebook의 빠른 시작 가이드를 사용하여 단계를 안내하세요.

PHP 사용

PHP를 사용하여 WordPress 사이트에 Facebook 로그인 버튼을 추가하려는 경우에도 그렇게 할 수 있는 옵션이 있습니다. 프로젝트에 PHP용 Facebook SDK를 설치해야 하므로 추가 작업이 필요합니다. Facebook에서는 참조할 수 있는 시작 방법에 대한 가이드를 제공합니다.

요약

요즘에는 WordPress 웹사이트에서 사용자 경험을 개선하는 다양한 방법이 있습니다. 그래도 Facebook 로그인 버튼을 사용하여 사이트에 접속하는 방법을 간소화하시겠습니까? 소셜 통합은 훌륭한 마케팅 전략이므로 이는 장기적으로 사용자(및 자신)에게 매우 가치가 있을 수 있습니다.

그리고 올바르게 사용하지 않을 경우 웹사이트에 소셜 로그인 기능을 추가하면 사용성 문제가 발생할 수 있다는 점을 주의 깊게 말씀드리겠습니다. 이를 피하는 방법은 다음과 같습니다.

보너스로 최고의 소셜 미디어 플러그인을 소개합니다.

피드백을 제공하고 싶거나 대화에 참여하고 싶으신가요?Twitter에 의견을 추가하세요.

저장 저장