가이드/이해하기
목차

Version 1

결제위젯 SDK v1은 더 이상 업데이트되지 않습니다. 토스페이먼츠 SDK v2 연동을 추천합니다.

결제위젯 메인 이미지

결제위젯은 토스페이먼츠만의 기본 결제서비스로, 수많은 상점을 분석해서 만든 최적의 주문서 결제 UI예요. 결제 영역을 노코드로 운영할 수 있는 어드민도 상점관리자에서 제공해요. 최초 1회 개발 연동이 끝나면 코드 없이 결제수단을 추가하고, UI 디자인을 쉽게 수정할 수 있어요.

코딩 없이 시작하기

위 화면은 결제위젯의 기본 설정값이 적용된 모바일 화면이에요. 어드민에서는 더 다양한 기능을 적용하고, 디자인을 편집할 수 있어요. 어드민에서 제공하는 일부 기능을 바로 만나보세요.

어드민 체험하기

결제위젯의 장점

토스페이먼츠 결제위젯

높은 구매 전환율

PG 제공 화면을 생략하기 때문에 구매자 결제 시간, 이탈률이 줄어요.

주문서에서 바로 사용 가능한 결제수단, 구매 혜택을 확인할 수 있어요.

코드 없는 운영

까다로운 결제 영역, 코드 변경없이 자유롭게 수정하세요.

어드민에서 디자인, 결제수단 등을 직접 커스터마이징하세요

간편한 연동

브라우저 스크립트에 결제위젯 SDK를 한 줄을 추가하거나 npm 패키지를 설치해서 바로 결제위젯 연동을 시작하세요.

결제위젯 SDK 문서

결제위젯 사용법

1. 상점관리자 결제위젯 어드민

토스페이먼츠에 로그인하고 상점관리자의 결제 UI 설정 메뉴를 확인하세요. 연동하고 싶은 결제 UI의 결제서비스를 추가하고 디자인 및 기능을 변경하세요.

상점관리자 결제위젯 어드민

* 어드민은 토스페이먼츠와 계약을 완료한 뒤에 사용할 수 있어요. 체험하기는 테스트 계정과 연결되지 않습니다.

2. 결제 UI의 variantKey 확인

여러 개의 결제 UI를 사용하고 있다면 결제 UI 설정 메뉴에서 연동하고 싶은 variantKey를 복사하세요.

결제 UI의 variantKey 확인

2. 결제위젯 연동

내 상점의 주문서 페이지에 결제위젯을 연동하세요. 결제위젯을 렌더링하는 메서드에 variantKey를 파라미터로 사용하세요.

가이드 문서

일반결제

SDK 문서・샘플 프로젝트

자주 묻는 질문

  • 더 궁금한 내용이 있나요?
  • 코드 샘플을 참고하세요
  • 기술지원이 필요한가요?
    실시간 문의|이메일 보내기