SNS 로그인 연동 사용방법(예시 : 페이스북 로그인 연동)

쇼핑몰관리자

1:1문의

고객센터

상점관리

상품관리

주문관리

고객관리

게시판관리

디자인관리

모바일쇼핑몰

프로모션

마켓통합관리

부가서비스

접속통계

FTP

C스토어

프로모션

고객혜택관리

• 서비스안내

• 혜택 등록

• 혜택 관리

• 혜택 환경설정

프로모션 매니저

• 서비스 신청

• 신청내역

• 이벤트팩토리 응모내역

• 서비스 효과분석

무이자할부 관리

• 무이자할부서비스 연장/변경

• 무이자할부상품 설정

쿠폰 관리

• 쿠폰 서비스안내

• 쿠폰 기본설정

• 쿠폰 만들기

• 쿠폰 발급/조회

시리얼쿠폰 관리

• 시리얼쿠폰 만들기

• 시리얼쿠폰 발급/조회

쿠폰존 관리

• 쿠폰존 사용설정

• 쿠폰존 디자인설정

이벤트 관리

• 출석체크 이벤트

ㄴ 서비스 안내

ㄴ 출석체크 만들기

ㄴ 출석체크 관리

ㄴ 지난 출석체크 내역

• 회원정보 이벤트

ㄴ 서비스 안내

ㄴ 이벤트 만들기

ㄴ 이벤트 관리

리워드 프로그램 관리

• 서비스 안내

• 리워드 설정

• 추천인 적립금 지급관리

• 추천인 관리

바로가기 마케팅 서비스

• 바로가기 혜택 설정

리마인드 ME

• 서비스 현황

• 리마인드 알림 등록

• 리마인드 알림 관리

• 리마인드 알림 통계

QR코드 관리

• 서비스 안내

• 상품 QR코드 만들기

• 일반 QR코드 만들기

• QR코드 내역

SNS 관리

• SNS 상품홍보 관리

• 싸이월드 스크랩 설정

• SNS 로그인연동 관리

홍보배너/문구 관리

• 공통이벤트 관리

• 상품검색 키워드 설정

온라인설문 관리

SNS 로그인연동 관리

- SNS 로그인으로 가입한 회원도 일반회원과 동일하게 쇼핑몰서비스(상품구매/쿠폰/할인/적립금 등)를 이용할 수 있습니다.

- 로그인 연동 설정 시, 각 SNS에서 발급받은 '클라이언트(앱)/Rest API(키)'를 발급/등록해야 정상적으로 연동됩니다.

- 로그인 연동 설정 후, 고객관리 > 회원가입/탈퇴 관리 > 회원가입항목 설정에서 가입항목을 설정할 수 있습니다. 

[1] 로그인 연동 설정

- 로그인 연동을 하고자 하는 SNS를 '사용함'을 선택하면, Client(App) ID와 Secret(Key)를 입력할 수 있는 영역이 표시됩니다.

- 해당 SNS에서 발급받은 Client(App) ID와 Secret(Key)값을 입력합니다.

- 네이버아이디로 로그인 적용하였으나 로그인이 되지 않을 경우 다음을 참고하시기 바랍니다.

※ 주의 : 발급받은 Client(App) ID를 변경할 경우 매체사에서는 새로운 쇼핑몰로 인식하게 되어 기존 회원정보, 주문정보 등의 연동이 불가하게 됩니다.


1) '발급방법 보기'

- '발급방법 보기' 버튼을 클릭하면 해당 SNS의 클라이언트(앱) ID 발급 및 설정방법을 확인할 수 있습니다.


[2] 저장

- 로그인 연동 설정 후 '저장' 버튼을 클릭하면 SNS로그인 연동이 완료됩니다.

[1] 페이스북 로그인 연동 설정

- '페이스북 로그인' 항목을 '사용함'으로 선택합니다.

- '발급방법 보기' 버튼을 클릭하면 클라이언트 ID 발급 및 설정방법을 자세하게 확인할 수 있습니다.


1) 페이스북 발급방법 보기 ▶


2) 카카오 계정 발급방법 보기 ▶


3) 네이버 발급방법 보기 ▶


4) 라인 발급방법 보기 ▶


5) 구글플러스 발급방법 보기 ▶


[2] 페이스북 클라이언트(앱) ID 발급

- '[1]의 발급방법 보기' 버튼을 클릭하여 발급방법을 확인 후, 페이스북 개발자 사이트에서 ID를 발급 받습니다.

- 발급받은 ID를 '[1]의 App ID' 입력창에 입력하고 '저장' 버튼을 클릭합니다.


[3] 스마트디자인 편집창에서 HTML수정

- '디자인관리 > 디자인 수정하기'의 스마트디자인 편집창에서 파란색 HTML 소스를 추가 합니다.

- 2016년에 생성한 쇼핑몰은 해당 HTML소스가 이미 생성되어 있습니다.


1) HTML 수정 위치

- 회원(member) > 로그인(비회원주문/조회) (login.html)

- 인트로(intro) > 인트로 회원 (member.html), 인트로 본인인증 + 회원 (adult_im.html)


[4] 쇼핑몰 로그인 페이지 확인

- 쇼핑몰 로그인 페이지에 '페이스북 로그인'버튼이 생성된 것을 확인할 수 있습니다.


[5] 페이스북 로그인 팝업창

- '[3] 페이스북 로그인' 버튼을 클릭하면 '페이스북 로그인' 팝업창이 표시됩니다.


2

4

5

##상단 생략##


<ul><li><a href="/member/id/find_id.html">아이디찾기</a></li>

<li><a href="/member/passwd/find_passwd_info.html">비밀번호찾기</a></li>

</ul>

<ul class="snsArea">

<li class="{$display_naver|display}">

<a href="#none" onclick="{$naver_func_login}"><img src="http://img.echosting.cafe24.com/skin/base_ko_KR/member/btn_naver_login.gif" alt="네이버 로그인" /></a>

</li>

<li class="{$display_facebook|display}">

<a href="#none" onclick="{$facebook_func_login}"><img src="http://img.echosting.cafe24.com/skin/base_ko_KR/member/btn_facebook_login.gif" alt="페이스북 로그인" /></a>

</li>

<li class="{$display_google|display}">

<a href="#none" onclick="{$google_func_login}"><img src="http://img.echosting.cafe24.com/skin/base_ko_KR/member/btn_google_login.gif" alt="구글 로그인" /></a>

</li>

</ul>


##하단 생략##

3

1

2

1