Shopify 체크아웃 사용자 정의: 어떤 옵션이 있습니까?

게시 됨: 2022-08-31

Shopify는 모든 판매자에게 사전 정의된 체크아웃 프로세스를 제공합니다. 귀하의 추가 노력 없이 빠르고 안전하게 작동합니다. 그러나 계산을 상점 디자인에 더 적합하게 만들고 마찰을 없애고 특별 제안을 추가하는 등의 작업을 수행할 수 있습니다.

모든 전자 상거래 플랫폼은 사용자 정의 체크아웃 필드를 통합합니다. 예를 들어 주문에 메모 또는 선물 메시지를 추가하는 것은 모든 주요 솔루션(Woocommerce, Squarespace, Eqwid 및 기타)에서 사용할 수 있습니다. 그러나 Shopify는 사용자 지정 개발 없이 결제를 수정할 수 있는 방법에서 가장 유연할 것입니다.

이 게시물에서는 Shopify 체크아웃 사용자 지정을 수행할 수 있는 항목과 이를 구현하는 방법에 대해 설명합니다.

Shopify 체크아웃은 얼마나 사용자화할 수 있습니까?

Shopify 스토어에서 볼 수 있는 대부분의 결제 페이지는 거의 동일합니다. 페이지는 두 부분으로 나뉩니다. 왼쪽 부분은 고객이 배송 및 결제 정보를 입력하는 부분이고 오른쪽 부분은 주문 요약을 표시하는 부분입니다.

이 구조와 체크아웃 로직은 변경할 수 없습니다. 할 수 있는 일은 페이지의 모양을 변경하고 추가 필드를 추가하는 것입니다. 그러나 약간의 외관상의 변화라도 결제 경험에 큰 영향을 미치고 전환율을 높일 수 있습니다.

결제 구조를 변경하려면 어떻게 해야 합니까?

현재 Shopify Plus 판매자만 checkout.liquid 템플릿을 편집하여 결제 로직에 영향을 줄 수 있습니다. 그러나 이는 너무 위험할 수 있으며 Shopify 자체에서는 이에 대해 만족하지 않습니다. 체크아웃 코드를 편집하면 다음과 같은 위험이 있습니다.

  • 웹 사이트에서 무언가를 깨뜨리고 고객이 주문을 전혀 완료하지 못하게 할 수 있습니다.
  • 타사 코드를 통합하는 것은 까다롭고 노동 집약적일 수 있습니다.
  • 추가되면 타사 JavaScript가 민감한 데이터에 액세스할 수 있으므로 보안 문제가 발생할 수 있습니다.

이 문제를 해결하기 위해 Shopify는 개발자가 결제 사용자 지정 앱을 만들 수 있도록 결제 확장 아키텍처를 만들고 있습니다 . 이미 다양한 Shopify 앱을 사용하여 많은 것을 조정할 수 있지만 체크아웃 확장 기능의 출현으로 훨씬 더 많은 사용자 정의 기회를 기대할 수 있습니다. Shopify에서 제공하는 UI 구성 요소 및 브랜딩 API를 기반으로 이러한 확장을 통해 결제의 기존 부분을 보강하고 일부 요소를 교체하며 완전히 새로운 기능을 추가할 수 있습니다.

Shopify의 결제 사용자 정의 유형

즉, 사용 가능한 두 가지 주요 유형의 체크아웃 사용자 정의를 다룰 것입니다. 첫 번째는 직접 쉽게 구현할 수 있는 테마 변경이고 두 번째는 Shopify 앱의 도움으로 통합된 추가 기능입니다.

1. Shopify 결제의 매우 쉬운 시각적 사용자 정의

지금은 추가 도움 없이 테마 편집기에서 무엇을 할 수 있는지 살펴보겠습니다. 현재 테마 옆에 있는 사용자 지정 을 클릭하면 상단 메뉴에서 결제 를 선택하고 왼쪽에 있는 테마 설정결제 섹션으로 이동합니다.

테마 사용자 지정에서 체크아웃 편집

여기에서 많은 간단한 체크아웃 사용자 정의를 수행할 수 있습니다.

  • 체크아웃 페이지에 로고를 추가하세요. 로고는 한 페이지에서 다른 페이지로 고객을 따라가며 일관된 브랜드 이미지를 생성해야 합니다. 결제 페이지에 매장 이름만 표시하지 말고 대신 로고를 사용하세요.

  • 페이지 섹션, 텍스트, 링크 및 버튼의 색상을 수정합니다. 기본 색상을 그대로 두는 대신 브랜드 요소에 더 잘 맞는 색상을 설정할 수 있습니다. 기본 페이지 콘텐츠 및 주문 요약에 대한 배경 이미지를 설정할 수도 있지만 권장되는 방법은 아닙니다. 이러한 영역의 정보는 명확하게 표시되어야 합니다.

Shopify는 여러 글꼴도 제공합니다. 적합한 것을 찾으면 그것을 선택하여 계산대 모양을 개인화하십시오.

결제 시 사용자 정의 글꼴
체크아웃에서 사용자 정의 글꼴. 출처: 버브

  • 브랜드 배너 또는 관련 이미지를 헤더로 추가합니다. 이미지 헤더는 작은 요소이므로 결제 페이지의 모양을 완전히 바꿀 수 있습니다.
결제 페이지의 사용자 정의 이미지 헤더
결제 페이지의 사용자 정의 이미지 헤더. 출처: 초콜릿 연금술

결제 및 계정 섹션에서 Shopify 관리자의 일부 필드를 수정할 수도 있습니다.

  • 마케팅 등록을 편집합니다. 이메일 및 SMS 가입을 추가하고 기본 "뉴스 및 제안을 이메일로 보내기"를 다른 것으로 변경할 수 있습니다. 후자를 수행하려면 사용자 정의 확인란 레이블 을 클릭하고 해당 필드에 구문을 입력합니다.
이메일 및 SMS 가입 사용자 정의

그러나 특별한 디자인을 만들어 이러한 필드를 강조 표시하거나 표시되는 위치를 제어하려는 경우 기본 설정으로는 충분하지 않습니다. Shopify 앱 또는 사용자 지정 코딩은 가입 상자를 사용자 지정하는 데 도움이 됩니다.

  • 고객 로그인 옵션 및 필수 입력 필드를 설정합니다. 관리자 설정에서 방문자가 주문을 할 수 있는 방법을 결정할 수 있습니다(손님 체크아웃 허용, 멀티패스 설정 등). 또한 필수로 표시되는 콘텐츠 필드와 선택 사항인 콘텐츠 필드를 조정할 수 있습니다. 예를 들어 포함하거나 제외할 수 있습니다. 주소 2.
Shopify 결제 설정: 고객 로그인

  • 팁을 허용합니다. 비즈니스에 적합하다면 계산대에서 팁을 줌으로써 고객이 감사를 표하도록 할 수 있습니다.

2. 앱 또는 기타 도구를 통한 Shopify 체크아웃 사용자 지정

다양한 앱을 통해 결제 프로세스를 그림처럼 완벽하게 만들고 전환을 생성할 수 있습니다. 다음은 수행할 수 있는 작업의 몇 가지 예입니다.

  • 기본 이동 경로를 진행률 표시줄로 바꿉니다. 결제를 위해 자동으로 생성된 탐색경로 탐색이 너무 작아 주의를 끌 수 없습니다. 고객이 주문을 완료하는 데 필요한 단계를 명확하게 이해하도록 하려면 진행률 표시줄을 추가할 수 있습니다.
5단계 결제 진행률 표시줄
5단계 결제 진행률 표시줄. 출처: Gymshark

  • 무료 배송 임계값을 표시합니다. 구매 프로세스의 여러 단계에서 무료 배송 임계값을 반복하는 것이 합리적입니다. 스토어 헤더에 추가하고 장바구니 페이지와 장바구니 서랍에서 강조 표시하고 결제에도 추가할 수 있습니다. 무료 배송 조건이 아직 충족되지 않음).
결제 시 표시되는 무료 배송 조건
결제 시 무료 배송 조건이 표시됩니다. 출처: 푸라 비다

  • 구매 시 사은품을 추가하세요. 무료 제품을 제공할 수 있는 Gift Box와 같은 앱을 사용하는 경우 지정한 조건(예: 지출 임계값)이 충족되면 주문 요약에 선물이 자동으로 표시됩니다.
결제 시 구매 시 사은품 증정

  • 제품을 상향 판매 및 교차 판매합니다. 상향 판매 기술은 결제를 포함하여 유입경로의 여러 단계에서 잘 작동할 수 있습니다. Candy Rack의 도움으로 감사 페이지에 구매 후 제안을 추가할 수 있습니다. 체크아웃 시 또는 결제 후에 상향 판매를 위한 다양한 방법과 솔루션을 탐색하려면 최고의 Shopify 상향 판매 앱 선택을 읽어보십시오.

  • 체크아웃 타이머를 추가합니다. 긴급성은 고객이 구매를 완료하도록 하는 큰 동기입니다. 카운트다운 타이머를 사용하여 귀하의 제품에 대한 수요가 높다는 것을 보여주십시오.
체크아웃 타이머
체크아웃 타이머. 출처: 부르가

  • 고객이 이메일 및 SMS 업데이트에 등록할 수 있도록 합니다. 이 기능은 Shopify 관리자 설정에서 사용할 수 있지만(이전에 작동 방식을 설명했습니다) 앱을 사용하면 가입 옵션을 보다 유연하게 표시할 수 있습니다.

마케팅 캠페인 및 배송 업데이트를 위해 여러 등록을 통합할 수 있습니다. AfterShip과 같은 앱은 후자에 도움이 될 것입니다.

결제에서 업데이트 및 마케팅 텍스트 등록 주문
결제에서 업데이트 및 마케팅 텍스트 등록을 주문하십시오. 출처 : 그때 나는 당신을 만났습니다

  • 신뢰 배지를 추가합니다. Trust Me와 같은 앱을 사용하면 지원되는 결제 수단 또는 기타 신뢰 표시기가 있는 배지를 쉽게 추가할 수 있습니다.

  • 연락처 정보 또는 기타 유용한 정보를 표시합니다. 고객에게 제품의 이점을 상기시킬 수 있다면 왜 일부 영역을 비워 두나요? 주문 요약 아래에 특별 섹션을 만들 수 있습니다.
결제 페이지에 언급된 브랜드 특전
체크아웃 페이지에 언급된 브랜드 특전. 출처: 푸라 비다

또는 고객에게 귀하의 연락처 정보를 상기시킬 수 있습니다. 이렇게 하면 사람들이 문제를 해결할 가능성이 높아지므로 장바구니 포기율을 줄일 수 있습니다.

결제 페이지의 연락처
결제 페이지의 연락처 정보. 출처: Made In

  • 고객이 의견을 남길 수 있습니다. Checkout Comments와 같은 앱은 피드백을 요청하거나 고객이 개인화 요청을 남길 수 있는 추가 필드를 결제에 배치하는 데 도움이 됩니다.

  • 주문 요약을 고정시킵니다. 고객이 배송 및 결제 필드를 완료할 때 주문 내용을 놓치지 않도록 고정 주문 요약을 사용할 수 있습니다(고객 스크롤과 함께 이동).
고정 주문 요약
고정 주문 요약. 출처: 츠노

  • 단일 페이지 결제를 만듭니다. 한 페이지에 모든 단계를 포함하는 결제 경험을 설계하는 데 도움이 되는 Chekify와 같은 타사 도구가 있습니다.

우리가 언급한 기능이 체크아웃을 거부할 수 없도록 맞춤화하는 데 영감을 주기를 바랍니다. 추가 팁은 Shopify 결제 최적화 가이드를 확인하세요.