온라인 스토어에서 동적 결제 버튼 표시

이 페이지는 Apr 19, 2024에 인쇄되었습니다. 최신 버전은 https://help.shopify.com/ko/manual/online-store/dynamic-checkout/dynamic-checkout에서 확인하십시오.

동적 결제 버튼은 단일 제품의 카트에 추가 버튼 대신 표시할 수 있는 버튼입니다. 동적 결제 버튼이 있으면 고객이 카트를 건너뛰고 결제 화면으로 바로 이동할 수 있습니다. 고객은 Shopify에서 바로 결제를 할 수도 있고 기존에 사용해 왔던 다른 빠른 결제 방법으로 결제를 할 수도 있습니다. 따라서 결제 프로세스를 빠르게 진행할 수 있으며, 고객은 편리한 방법으로 결제를 할 수 있습니다.

Apple Pay 로고가 표시되는 브랜드가 있는 동적 결제 버튼

이 페이지의 정보

개요

동적 결제 버튼은 테마 및 고객 장치에 따라 카트에 추가 버튼 옆이나 아래에 표시됩니다. 동적 결제 버튼에는 다음의 두 가지 종류가 있습니다.

  • 브랜드가 없는 버튼에는 지금 구매 텍스트가 표시됩니다. 고객은 브랜드가 없는 지금 구매 버튼을 클릭하여 카트를 건너뛰고 결제 화면으로 이동할 수 있습니다.

지금 구매 텍스트가 표시되는 브랜드가 없는 동적 결제 버튼

  • 브랜드가 있는 버튼에는 타사 빠른 결제 방법의 로고가 포함됩니다. 고객은 Apple Pay 등의 타사 빠른 결제 방법에 해당하는 브랜드가 있는 버튼을 클릭하여 해당 방법으로 결제를 할 수 있는 화면으로 이동할 수 있습니다. 이 화면에는 고객의 정보가 미리 입력되어 있습니다. 빠른 결제에 대해 자세히 알아보십시오. 사용 가능한 타사의 빠른 결제 방법은 다음과 같습니다.

각 결제 방법을 브랜드가 있는 버튼으로 표시하려면 특정 요구 사항을 충족해야 합니다.

고객에게 표시되는 동적 결제 버튼의 종류는 다음 요인에 따라 달라집니다.

  • 결제 설정
  • Shop Promise 활성 상태 여부, 이는 다른 결제보다 Shop Pay를 우선시합니다
  • 고객의 브라우저
  • 고객의 장치
  • 고객의 개인 결제 내역

스토어에서 기프트 카드나 할인 코드를 사용하는 경우에도 고객이 결제 시 해당 코드를 입력할 수 있습니다.

호환성

동적 결제 버튼이 온라인 스토어에 적합하지 않은 몇 가지 경우가 있습니다. 온라인 스토어에서 동적 결제 버튼을 포함하기 전에 다음 기능과의 호환성을 고려하십시오.

앱

동적 결제 버튼은 특정 앱과 충돌할 수도 있습니다.

다음과 같은 종류의 앱을 사용하는 경우 동적 결제 버튼이 온라인 스토어와 호환되지 않을 수 있습니다.

  • 환율 계산기
  • 카트와 상호 작용하는 앱
  • 고객을 외부 결제 수단으로 안내하는 앱

카트 특성

동적 결제 버튼은 카트 특성을 지원하지 않습니다. 카트 특성은 카트 페이지에서 고객의 추가 정보를 수집하는 데 사용할 수 있는 사용자 지정 양식 필드입니다.

카트 특성의 예로는 카트 페이지에 추가하는 다음과 같은 항목이 포함됩니다.

  • 이용 약관 확인란
  • 선물 포장 옵션
  • 배송 날짜 선택기

카트 특성을 사용하는 경우에는 온라인 스토어에서 동적 결제 버튼을 사용하지 않는 것이 좋습니다.

제품, 결제 설정 및 버튼 텍스트

온라인 스토어에서 동적 결제 버튼을 포함하기 전에 다음 세부 정보를 고려하십시오.

  • 동적 결제 버튼은 제품의 이형 상품 하나를 구매할 때만 사용할 수 있습니다. 그러나 제품 페이지에 수량 선택기를 표시하면 고객이 해당 제품을 여러 개 구매할 수 있습니다. 예를 들어 고객이 동적 결제 버튼을 사용하여 파란색 베이킹 컵 3개를 구매할 수는 있지만 파란색 컵과 자주색 컵을 하나씩 구매할 수는 없습니다. 온라인 스토어에서 한 가지 제품 종류에 주문 여러 건을 받지 않는다면 동적 결제 버튼을 추가해도 판매량 증가에는 도움이 되지 않을 수도 있습니다.
  • 결제 설정에서 타사 빠른 결제 방법을 활성화하지 않은 경우에는 브랜드가 없는 버전의 동적 결제 버튼만 표시됩니다.
  • 브랜드가 없는 동적 결제 버튼 버전에는 지금 구매 텍스트가 포함됩니다. 카트에 추가 버튼에 지금 구매 또는 기타 사용자 지정 텍스트가 표시되면 고객이 혼동할 수 있습니다.

동적 결제 버튼을 사용하도록 테마 업데이트

Shopify 테마 스토어에서 제공하는 모든 최신 버전 테마에서 동적 결제 버튼을 사용할 수 있습니다. 이전 버전의 테마를 사용하는 경우 테마를 업데이트하면 동적 결제 버튼을 사용할 수 있습니다. 테마를 업데이트하지 않으려면 테마 코드를 편집하면 됩니다.

제품 페이지에 동적 결제 버튼 표시

단계:

  1. Shopify Admin에서 온라인 스토어 > 테마로 이동합니다.
  2. 편집하려는 테마 옆의 사용자 지정을 클릭합니다.
  3. 홈페이지 드롭다운 메뉴를 클릭합니다.
  4. 제품을 클릭한 다음 편집할 템플릿을 선택합니다.
  5. 제품 정보 섹션에서 구매 버튼을 클릭합니다.
  6. 동적 결제 버튼 표시를 선택합니다.
  7. 저장을 클릭합니다.
  1. Shopify 앱에서 … 버튼을 탭합니다.
  2. 판매 채널 섹션에서 온라인 스토어를 탭합니다.
  3. 테마 관리를 탭합니다.
  4. 편집하려는 테마를 찾은 다음 사용자 지정을 탭합니다.
  5. 템플릿을 탭합니다.
  6. 제품 페이지를 선택합니다.
  7. 제품 페이지 또는 제품 섹션을 클릭 합니다.
  8. 동적 결제 버튼 표시를 선택합니다.
  9. 저장을 클릭합니다.
  1. Shopify 앱에서 … 버튼을 탭합니다.
  2. 판매 채널 섹션에서 온라인 스토어를 탭합니다.
  3. 테마 관리를 탭합니다.
  4. 편집하려는 테마를 찾은 다음 사용자 지정을 탭합니다.
  5. 템플릿을 탭합니다.
  6. 제품 페이지를 선택합니다.
  7. 제품 페이지 또는 제품 섹션을 클릭 합니다.
  8. 동적 결제 버튼 표시를 선택합니다.
  9. 저장을 클릭합니다.

추천 제품 섹션에 동적 결제 버튼 표시

대부분의 테마에는 추천 제품 섹션에 동적 결제 버튼을 포함하는 설정이 포함되어 있습니다.

단계:

  1. Shopify Admin에서 온라인 스토어 > 테마로 이동합니다.
  2. 편집하려는 테마 옆의 사용자 지정을 클릭합니다.
  3. 기존 추천 제품 섹션을 클릭하거나 섹션 추가 > 추천 제품을 클릭하여 새 추천 제품 섹션을 추가합니다.
  4. 추천 제품 섹션에서 구매 버튼을 클릭합니다.
  5. 동적 결제 버튼 표시를 선택합니다.
  6. 저장을 클릭합니다.
  1. Shopify 앱에서 … 버튼을 탭합니다.
  2. 판매 채널 섹션에서 온라인 스토어를 탭합니다.
  3. 모든 테마 관리를 탭합니다.
  4. 편집하려는 테마를 찾은 다음 사용자 지정을 탭합니다.
  5. 편집을 탭합니다.
  6. 기존 추천 제품 섹션을 클릭하거나 섹션 추가를 클릭하여 새 추천 제품 섹션을 추가합니다.
  7. 제품 세부 정보를 입력하고 동적 결제 버튼 표시를 선택합니다.
  8. 저장을 클릭합니다.
  1. Shopify 앱에서 … 버튼을 탭합니다.
  2. 판매 채널 섹션에서 온라인 스토어를 탭합니다.
  3. 모든 테마 관리를 탭합니다.
  4. 편집하려는 테마를 찾은 다음 사용자 지정을 탭합니다.
  5. 편집을 탭합니다.
  6. 기존 추천 제품 섹션을 클릭하거나 섹션 추가를 클릭하여 새 추천 제품 섹션을 추가합니다.
  7. 제품 세부 정보를 입력하고 동적 결제 버튼 표시를 선택합니다.
  8. 저장을 클릭합니다.

제품 페이지에서 동적 결제 버튼 숨기기

제품 페이지에서 모든 동적 결제 버튼을 숨길 수 있지만 특정 동적 결제 버튼은 숨길 수 없습니다.

단계:

  1. Shopify Admin에서 온라인 스토어 > 테마로 이동합니다.
  2. 편집하려는 테마 옆의 사용자 지정을 클릭합니다.
  3. 홈페이지 드롭다운 메뉴를 클릭합니다.
  4. 제품을 클릭한 다음 편집할 템플릿을 선택합니다.
  5. 제품 정보 섹션에서 구매 버튼을 클릭합니다.
  6. 동적 결제 버튼 표시를 선택 취소합니다.
  7. 저장을 클릭합니다.
  1. Shopify 앱에서 … 버튼을 탭합니다.
  2. 판매 채널 섹션에서 온라인 스토어를 탭합니다.
  3. 테마 관리를 탭합니다.
  4. 편집하려는 테마를 찾은 다음 사용자 지정을 탭합니다.
  5. 템플릿을 탭합니다.
  6. 제품 페이지를 선택합니다.
  7. 제품 페이지 또는 제품 섹션을 클릭 합니다.
  8. 동적 결제 버튼 표시를 선택 취소합니다.
  9. 저장을 클릭합니다.
  1. Shopify 앱에서 … 버튼을 탭합니다.
  2. 판매 채널 섹션에서 온라인 스토어를 탭합니다.
  3. 테마 관리를 탭합니다.
  4. 편집하려는 테마를 찾은 다음 사용자 지정을 탭합니다.
  5. 템플릿을 탭합니다.
  6. 제품 페이지를 선택합니다.
  7. 제품 페이지 또는 제품 섹션을 클릭 합니다.
  8. 동적 결제 버튼 표시를 선택 취소합니다.
  9. 저장을 클릭합니다.

추천 제품 섹션에서 동적 결제 버튼 숨기기

추천 제품 섹션에서 모든 동적 결제 버튼을 숨길 수 있지만 특정 동적 결제 버튼은 숨길 수 없습니다.

단계:

  1. Shopify Admin에서 온라인 스토어 > 테마로 이동합니다.
  2. 편집하려는 테마 옆의 사용자 지정을 클릭합니다.
  3. 추천 제품 섹션을 클릭합니다.
  4. 동적 결제 버튼 표시를 선택 취소합니다.
  5. 저장을 클릭합니다.
  1. Shopify 앱에서 … 버튼을 탭합니다.
  2. 판매 채널 섹션에서 온라인 스토어를 탭합니다.
  3. 모든 테마 관리를 탭합니다.
  4. 편집하려는 테마를 찾은 다음 사용자 지정을 탭합니다.
  5. 편집을 탭합니다.
  6. 추천 제품 섹션을 클릭합니다.
  7. 동적 결제 버튼 표시를 선택 취소합니다.
  8. 저장을 클릭합니다.
  1. Shopify 앱에서 … 버튼을 탭합니다.
  2. 판매 채널 섹션에서 온라인 스토어를 탭합니다.
  3. 모든 테마 관리를 탭합니다.
  4. 편집하려는 테마를 찾은 다음 사용자 지정을 탭합니다.
  5. 편집을 탭합니다.
  6. 추천 제품 섹션을 클릭합니다.
  7. 동적 결제 버튼 표시를 선택 취소합니다.
  8. 저장을 클릭합니다.

테마에서 동적 결제 버튼 테스트

테마에 표시되는 동적 결제 버튼의 종류는 여러 요인에 따라 달라지므로 테스트를 실행하여 모든 조합을 검토할 수 있습니다. 테마에서 동적 결제 버튼을 테스트하기 전에 버튼이 표시되는지 확인하십시오.

단계:

  1. Shopify Admin에서 온라인 스토어 > 테마로 이동합니다.
  2. 스토어 보기를 클릭합니다.
  3. 제품 페이지에서 버튼을 테스트하려면 제품 페이지로 이동합니다. 추천 제품 섹션에서 버튼을 테스트하려면 홈 페이지를 계속 표시해 둡니다.

  4. 브라우저 주소 표시줄에서 다음 문자열 중 하나를 현재 URL 끝에 추가합니다.

    • Shop Pay 브랜드가 있는 버튼을 표시하려면 ?shopify-debug=true&show=Shop을 추가합니다.
    • Amazon 브랜드가 있는 버튼을 표시하려면 ?shopify-debug=true&show=Amazon을 추가합니다.
    • Apple Pay 브랜드가 있는 버튼을 표시하려면 ?shopify-debug=true&show=ApplePay을 추가합니다. Apple Pay는 Safari에서만 작동합니다.
    • Google Pay 브랜드가 있는 버튼을 표시하려면 add ?shopify-debug=true&show=Google을 추가합니다.
    • PayPal 브랜드가 있는 버튼을 표시하려면 ?shopify-debug=true&show=PayPal을 추가합니다.
    • Venmo 브랜드가 있는 버튼을 표시하려면 ?shopify-debug=true&show=Venmo을 추가합니다.
    • 브랜드가 없는 버튼을 표시하려면 ?shopify-debug=true&show=checkout을 추가합니다.

  5. Enter 키를 눌러 페이지를 다시 로드합니다. URL에 추가한 문자열에 따라 브랜드가 있거나 없는 동적 결제 버튼이 표시됩니다.

  6. 다른 문자열을 사용해 위의 단계를 반복하여 다양한 유형의 동적 결제 버튼을 검토합니다.

  1. Shopify 앱에서 … 버튼을 탭합니다.
  2. 판매 채널 섹션에서 온라인 스토어를 탭합니다.
  3. 테마 관리를 탭합니다.
  4. 스토어 보기를 클릭합니다.
  5. 제품 페이지에서 버튼을 테스트하려면 제품 페이지로 이동합니다. 추천 제품 섹션에서 버튼을 테스트하려면 홈 페이지를 계속 표시해 둡니다.

  6. 브라우저 주소 표시줄에서 다음 문자열 중 하나를 현재 URL 끝에 추가합니다.

    • Shop Pay 브랜드가 있는 버튼을 표시하려면 ?shopify-debug=true&show=Shop을 추가합니다.
    • Amazon 브랜드가 있는 버튼을 표시하려면 ?shopify-debug=true&show=Amazon을 추가합니다.
    • Apple Pay 브랜드가 있는 버튼을 표시하려면 ?shopify-debug=true&show=ApplePay을 추가합니다. Apple Pay는 Safari에서만 작동합니다.
    • Google Pay 브랜드가 있는 버튼을 표시하려면 add ?shopify-debug=true&show=Google을 추가합니다.
    • PayPal 브랜드가 있는 버튼을 표시하려면 ?shopify-debug=true&show=PayPal을 추가합니다.
    • Venmo 브랜드가 있는 버튼을 표시하려면 ?shopify-debug=true&show=Venmo을 추가합니다.
    • 브랜드가 없는 버튼을 표시하려면 ?shopify-debug=true&show=checkout을 추가합니다.

  7. Enter 키를 눌러 페이지를 다시 로드합니다. URL에 추가한 문자열에 따라 브랜드가 있거나 없는 동적 결제 버튼이 표시됩니다.

  8. 다른 문자열을 사용해 위의 단계를 반복하여 다양한 유형의 동적 결제 버튼을 검토합니다.

  1. Shopify 앱에서 … 버튼을 탭합니다.
  2. 판매 채널 섹션에서 온라인 스토어를 탭합니다.
  3. 테마 관리를 탭합니다.
  4. 스토어 보기를 클릭합니다.
  5. 제품 페이지에서 버튼을 테스트하려면 제품 페이지로 이동합니다. 추천 제품 섹션에서 버튼을 테스트하려면 홈 페이지를 계속 표시해 둡니다.

  6. 브라우저 주소 표시줄에서 다음 문자열 중 하나를 현재 URL 끝에 추가합니다.

    • Shop Pay 브랜드가 있는 버튼을 표시하려면 ?shopify-debug=true&show=Shop을 추가합니다.
    • Amazon 브랜드가 있는 버튼을 표시하려면 ?shopify-debug=true&show=Amazon을 추가합니다.
    • Apple Pay 브랜드가 있는 버튼을 표시하려면 ?shopify-debug=true&show=ApplePay을 추가합니다. Apple Pay는 Safari에서만 작동합니다.
    • Google Pay 브랜드가 있는 버튼을 표시하려면 add ?shopify-debug=true&show=Google을 추가합니다.
    • PayPal 브랜드가 있는 버튼을 표시하려면 ?shopify-debug=true&show=PayPal을 추가합니다.
    • Venmo 브랜드가 있는 버튼을 표시하려면 ?shopify-debug=true&show=Venmo을 추가합니다.
    • 브랜드가 없는 버튼을 표시하려면 ?shopify-debug=true&show=checkout을 추가합니다.

  7. Enter 키를 눌러 페이지를 다시 로드합니다. URL에 추가한 문자열에 따라 브랜드가 있거나 없는 동적 결제 버튼이 표시됩니다.

  8. 다른 문자열을 사용해 위의 단계를 반복하여 다양한 유형의 동적 결제 버튼을 검토합니다.

일부 제품에만 동적 결제 버튼 표시

일부 제품에만 동적 결제 버튼을 표시하려는 경우 대체 템플릿을 생성할 수 있습니다. 대체 템플릿은 원본에 영향을 주지 않고 편집할 수 있는 중복 테마 코드 템플릿입니다. 대체 제품 템플릿을 사용하면 특정 템플릿을 사용하는 제품의 경우 동적 결제 버튼을 표시하고 다른 템플릿을 사용하는 제품의 경우에는 동적 결제 버튼을 숨길 수 있습니다.

대체 제품 템플릿을 생성하려면 새 템플릿 생성을 참조하십시오.

대체 제품 템플릿을 생성하여 제품에 템플릿을 할당한 후에는 해당 제품에 대해 동적 결제 버튼을 표시하거나 숨길 수 있습니다.

단계:

  1. Shopify Admin에서 온라인 스토어 > 테마로 이동합니다.
  2. 대체 템플릿을 생성한 테마 옆의 사용자 지정을 클릭합니다.
  3. 대체 템플릿을 할당한 제품의 제품 페이지로 이동합니다.
  4. 제품 정보 섹션에서 구매 버튼을 클릭합니다.
  5. 대체 템플릿을 사용하는 제품에 대해 동적 결제 버튼을 표시하려면 동적 결제 버튼 표시를 선택합니다. 대체 템플릿을 사용하는 제품에 대해 동적 결제 버튼을 숨기려면 동적 결제 버튼 표시를 선택 취소합니다.
  6. 저장을 클릭합니다. 대체 템플릿을 사용하는 모든 제품에 변경 사항이 적용됩니다.
  1. Shopify 앱에서 … 버튼을 탭합니다.
  2. 판매 채널 섹션에서 온라인 스토어를 탭합니다.
  3. 테마 관리를 탭합니다.
  4. 대체 템플릿을 생성한 테마를 찾은 다음 사용자 지정을 클릭합니다.
  5. 테마 편집기에서 대체 템플릿을 할당한 제품의 제품 페이지로 이동합니다.
  6. 제품 페이지 또는 제품 섹션을 클릭 합니다.
  7. 대체 템플릿을 사용하는 제품에 대해 동적 결제 버튼을 표시하려면 동적 결제 버튼 표시를 선택합니다. 대체 템플릿을 사용하는 제품에 대해 동적 결제 버튼을 숨기려면 동적 결제 버튼 표시를 선택 취소합니다.
  8. 저장을 클릭합니다. 대체 템플릿을 사용하는 모든 제품에 변경 사항이 적용됩니다.
  1. Shopify 앱에서 … 버튼을 탭합니다.
  2. 판매 채널 섹션에서 온라인 스토어를 탭합니다.
  3. 테마 관리를 탭합니다.
  4. 대체 템플릿을 생성한 테마를 찾은 다음 사용자 지정을 클릭합니다.
  5. 테마 편집기에서 대체 템플릿을 할당한 제품의 제품 페이지로 이동합니다.
  6. 제품 페이지 또는 제품 섹션을 클릭 합니다.
  7. 대체 템플릿을 사용하는 제품에 대해 동적 결제 버튼을 표시하려면 동적 결제 버튼 표시를 선택합니다. 대체 템플릿을 사용하는 제품에 대해 동적 결제 버튼을 숨기려면 동적 결제 버튼 표시를 선택 취소합니다.
  8. 저장을 클릭합니다. 대체 템플릿을 사용하는 모든 제품에 변경 사항이 적용됩니다.

Shopify와 함께 사업을 시작할 준비가 되셨습니까?

무료 체험