WordPress Marketing

국내(Naver)부터 해외(Google · Bing · Yahoo · Baidu)까지. 브랜드, 사이트 홍보를 위한 워드프레스 실전 마케팅!
HOME > BBS Theme/Plug-in, SNS 공유, 마케팅 자료 > 보부상 워드프레스 쇼핑몰 테마 ‘소셜...

보부상 워드프레스 쇼핑몰 테마 ‘소셜로그인’ 설정방법 I. 네이버, 페이스북(17.10.19)

워드프레스 쇼핑몰 테마 BlogShop, StyleShop
‘소셜로그인’ 설정방법 I. 네이버, 페이스북

 

최근 신규 가입 시 번거롭게 개인정보를 입력하지 않아도 되는 소셜로그인에 대한 선호도가 높아지고 있습니다.
소셜로그인이란 한 개의 소셜아이디로 여러 사이트에 신규가입 없이 간편하게 로그인할 수 있는 방법을 말하는데요.
보부상 워드프레스 쇼핑몰 테마 ‘BlogShop(블로그샵)‘, ‘StyleShop(스타일샵)’에 네이버, 페이스북, 트위터 등 소셜네트워크서비스(SNS)를 이용한 쉽고 편리한 방식의 ‘소셜로그인’이 적용되었습니다.
이제 보부상 쇼핑몰 테마를 이용하면 별도의 플러그인 설치 없이 테마 구매 하나만으로 소셜로그인 적용이 가능합니다.
SNS 아이콘 표시는 화면 상단의 로그인 옆에 SNS 라는 아이콘으로 표기되며,
소셜로그인 가능 매체는 로그인 페이지 하단에 노출됩니다.

소셜로그인 설정방법

소셜로그인 설정방법은 다음과 같습니다.

1. 소셜로그인 환경설정

워드프레스 테마 관리자 로그인 > BBSe-Commerce > 회원관리 > 소셜(간편)로그인에서 회원통합 사용여부, SNS 아이콘 표시여부를 설정합니다.
회원통합이란, 소셜로그인 한 정보와 기존 회원정보를 비교하여(이메일 주소), 이메일 주소가 동일한 경우 두 정보를 통합하여 하나의 고객으로 인식하는 것을 말합니다. 회원통합이 이루어지지 않은 소셜로그인 사용자는 회원관련 기능(적립금 지급, 적립금내역, 회원정보 등)을 사용할 수 없습니다.

소셜로그인 환경설정

2. 네이버 아이디 로그인

네이버 아이디로 로그인을 적용하려면 애플리케이션을 등록하고 클라이언트 아이디와 클라이언트 시크릿을 발급받아야 합니다.
애플리케이션을 등록하는 방법은 다음과 같습니다.
https://nid.naver.com/devcenter/docs.nhn?menu=Register

애플리케이션 등록방법

1) 아이디로 로그인 개발자센터의 메뉴에서 내 애플리케이션 > 새 애플리케이션 등록을 선택합니다.naver login setting

 

 

2) 애플리케이션 이름을 입력하고 애플리케이션 성격에 맞는 카테고리를 선택합니다.
3) 서비스 환경에서 네이버 아이디로 로그인을 적용할 애플리케이션 종류를 선택하고 필요한 정보를 입력합니다.
naver login setting 3

클라이언트 아이디와 클라이언트 시크릿

애플리케이션을 추가하면 네이버 아이디로 로그인에서 사용할 클라이언트 아이디와 클라이언트 시크릿이 발급됩니다.
발급받은 클라이언트 아이디와 클라이언트 시크릿을 확인하는 방법은 다음과 같습니다.

1) 네이버 아이디로 로그인 메뉴에서 내 애플리케이션을 선택하고 등록한 애플리케이션 이름을 클릭합니다.
2) 등록한 애플리케이션의 메뉴에서 개요를 선택합니다.
naver login setting 5

3) 개발중으로 표기된 상태를 ‘설정상태 변경’을 클릭해 ‘서비스 적용’ 상태로 변경합니다.
naver login setting 7

4) 클라이언트 아이디와 클라이언트 시크릿 정보를 확인 후,
워드프레스 테마 관리자 로그인 > BBSe-Commerce > 회원관리 > 소셜(간편)로그인 네이버 아이디 로그인 정보란에 기입 후 저장합니다.
naver login setting 2

네이버 소셜로그인 적용을 위한 세팅이 완료되었습니다.
이제 네이버 아이디로 로그인이 가능합니다.
naver login setting 8

3. 페이스북 로그인 – (17.10.19 update)

페이스북 아이디로 로그인을 적용하려면 App ID와 App Secret 정보를 발급받아야 합니다.
등록 방법은 다음과 같습니다.

① 페이스북 앱 생성/관리 페이지에 접속하여 [새 앱 추가] 버튼을 클릭합니다.
페이스북 앱 바로가기 : https://developers.facebook.com/apps/

 

 

② 정보를 입력 후 [ 앱 ID 만들기 ]를 클릭합니다.

 

③ Facebook 로그인의 [설정]을 클릭합니다.

 

④ 플랫폼 선택에서 [ 웹 ]을 클릭합니다.

 

⑤ 사이트 URL을 입력 후 저장합니다.
※ 사이트 URL은 BBS e-Commerce > 회원관리 > 소셜(간편)로그인 메뉴에서 제공되오니 복사 후 붙여넣기 합니다.

⑥ Facebook 로그인 설정에서 [유효한 OAuth 리디렉션 URI] 값을 입력 후 저장합니다.
※ 유효한 OAuth 리디렉션 URI 은
BBS e-Commerce > 회원관리 > 소셜(간편)로그인 메뉴에서 제공(Callback URL) 되오니 복사 후 붙여넣기 합니다.
이 때 클라이언트 OAuth 로그인과 리디렉션 URI에 Strict 모드 사용은 반드시 [예]로 활성화 합니다.

 

⑦ 앱 ID, 앱 시크릿 코드 값을 BBS e-Commerce 관리자에 입력합니다.

▼ App ID, App Secret 값을 BBS e-Commerce 관리자에 입력합니다.

[Setting] 페이지에서 아래와 같이 모든 정보를 입력해주세요.

페이스북 소셜로그인 설정이 완료되었습니다.
facebook login setting 5

보부상 워드프레스 쇼핑몰 테마 BlogShop(블로그샵), StyleShop(스타일샵)을 구매하시면
별도의 소셜플러그인 설치 없이 테마 내에서 소셜로그인 설정이 가능합니다.
다음 포스팅에서는 다음 아이디, 카카오계정을 이용한 소셜로그인 설정방법에 대해 소개해드리겠습니다.

 


댓글 달기

이메일은 공개되지 않습니다. 필수 입력창은 * 로 표시되어 있습니다.


top