드림 간편 로그인 소개
네이버, 카카오, 구글, 페이스북 회원가입과 로그인을 지원합니다. 원하는 소셜 로그인만 선택해서 사용하는 것도 가능합니다. UI, 디자인을 자유롭게 변경 가능하여 색상, 모양(아이콘, 텍스트 버튼)을 원하는 스타일로 지정할 수 있습니다. 모든 언어를 지원합니다. 소셜 로그인을 사용하는 고객들에 대한 로그인 차트와 통계등 분석툴을 제공합니다. 쇼피파이 플러스에서 사용되는 멀티패스를 지원합니다.
reCAPCHA 비활성화
소셜로그인을 활성화하기 위해서는 쇼피파이 관리자 페이지에서 reCAPCHA의 로그인 부분을 비활성화 해야합니다.
관리자페이지 - 온라인 스토어 - 환경설정 하단
소셜 로그인 설치
소셜 로그인은 각 소셜 사이트에서 제공하는 인증방법을 통해 로그인을 손쉽게 하는 시스템입니다.
고객사는 각 소셜 사이트의 개발자페이지에 회원가입을 하고 API를 발급받은 후 소셜 로그인 사용승인을 받아야 합니다. 앱 승인까지 약 2~3일 기간이 걸릴 수 있습니다.
1. 네이버 개발자센터
https://developers.naver.com/
2. 카카오비즈니스
https://developers.kakao.com/
3. 구글 개발자 콘솔
https://console.cloud.google.com/
4. 페이스북 개발자
https://developers.facebook.com/
소셜 로그인 기능을 사용하려면 앱과 상관없이 해당 작업은 반드시 해야하는 작업입니다.
App(API) Setup - English
2. 소셜 로그인 앱 테마에 적용하기
소셜 로그인 설치방법 (한글)
Dream Social Login Setting (English)
소셜 로그인 디자인 오류 해결하기
일반 로그인과 소셜 로그인 사이에 발생하는 여백
가끔 일반 로그인과 소셜로그인 사이에 여백이 발생하는 경우가 있습니다.
테마마다 로그인 블럭의 크기가 다르기 때문입니다.
보기 좋게 하기 위해 아래의 방법을 사용하세요.
1. 쇼피파이 관리자에서 수정하기
관리자에서 로그인 블럭(Section)의 아래여백을 크게 설정해 놓은 경우 Custom CSS 에 아래 코드를 넣어서 수정할 수 있습니다.
{
margin-top: -345px;
padding-bottom: 50px;
}
위에서 margin-top의 값을 마이너스로 변경해서 일반 로그인 블럭과의 간격을 줄일 수 있습니다.
만약 이 코드를 통해서 해결이 안되는 경우 아래처럼 관리자의 코드 수정으로 들어가서 코드를 추가해야 합니다.
2. 코드 변경하기
각 테마에서 로그인과 회원가입을 담당하는 파일에 아래의 코드를 넣어주세요.
style="min-height: auto; margin-bottom: 0;">