> ## Documentation Index
> Fetch the complete documentation index at: https://docs.aftersell.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Shopify 체크아웃에 체크아웃 위젯 추가하기

> Aftersell 위젯으로 Shopify 체크아웃을 커스터마이징하고, Testimonials 같은 앱 블록을 추가하고, 게시 전에 위치를 조정하는 방법

[Aftersell에서 첫 번째 체크아웃 위젯을 생성](/ko/aftersell/creating_your_first_checkout_widget)한 후, 다음 단계는 Shopify 체크아웃에 위젯을 추가하는 것이에요.

***

<div id="step-1-navigate-to-shopify-checkout-customization-page">
  ## 1단계: Shopify 체크아웃 커스터마이징 페이지로 이동하기
</div>

두 가지 방법이 있어요:

1. Shopify의 "Settings" 탭으로 이동하세요. 왼쪽 내비게이션에서 "Checkout"을 클릭하세요. 원하는 체크아웃 프로필 옆의 "Customize"를 클릭하세요.
2. Aftersell 체크아웃 에디터 페이지 오른쪽 하단의 "Open Shopify Checkout Editor"를 클릭하세요.

첫 번째 방법은 어떤 체크아웃 프로필을 편집하는지 더 세밀하게 선택할 수 있고, 두 번째 방법은 체크아웃의 라이브 프로필 버전으로 이동해요. 게시하기 전에 모든 것이 원하는 대로 작동하는지 확인할 수 있도록 먼저 초안 버전에서 테스트하는 것을 권장합니다.

<img src="https://mintcdn.com/aftersell/1Y3gBpUfxv16VGSW/images/aftersell/checkout-widget-install-settings-tab-customize-button.png?fit=max&auto=format&n=1Y3gBpUfxv16VGSW&q=85&s=77442f8be63f9a08ae3dc3fe0d1e569a" alt="Checkout 탭과 Customize 버튼이 강조된 Shopify 체크아웃 설정" width="2216" height="934" data-path="images/aftersell/checkout-widget-install-settings-tab-customize-button.png" />

***

<div id="step-2-add-an-app-block">
  ## 2단계: 앱 블록 추가하기
</div>

Shopify 체크아웃 커스터마이징 페이지에서 "Add app block"을 클릭하세요.

<img src="https://mintcdn.com/aftersell/1Y3gBpUfxv16VGSW/images/aftersell/checkout-widget-install-add-app-block-button.png?fit=max&auto=format&n=1Y3gBpUfxv16VGSW&q=85&s=f6ba0d6ab535b750f8487c408e99ef69" alt="Add app block 버튼을 가리키는 화살표가 있는 Shopify 체크아웃 에디터" width="3486" height="1964" data-path="images/aftersell/checkout-widget-install-add-app-block-button.png" />

Aftersell이 제공하는 다양한 위젯 옵션이 표시돼요. 이 예시에서는 Trust Badges Widget을 선택하겠습니다.

<img src="https://mintcdn.com/aftersell/1Y3gBpUfxv16VGSW/images/aftersell/checkout-widget-install-block-picker-listing-rokt.png?fit=max&auto=format&n=1Y3gBpUfxv16VGSW&q=85&s=6b6c6f415043aff812c76705409501c6" alt="Trust Badges Widget 등 Aftersell by Rokt 위젯 옵션이 나열된 Shopify 블록 선택기" width="3478" height="1954" data-path="images/aftersell/checkout-widget-install-block-picker-listing-rokt.png" />

원하는 위젯을 선택한 후 올바른 배치 위치를 선택하고 오른쪽 상단의 저장 버튼을 누르세요. Shop Pay 체크아웃에도 체크아웃 위젯을 표시하고 싶다면 "Include app block in Shop Pay" 옵션을 선택하는 것을 고려해 보세요.

<img src="https://mintcdn.com/aftersell/1Y3gBpUfxv16VGSW/images/aftersell/checkout-widget-install-trust-badges-block-settings.png?fit=max&auto=format&n=1Y3gBpUfxv16VGSW&q=85&s=114dab51d2102e86e8b8f0865ee8dc33" alt="배치 드롭다운과 Save 버튼이 강조된 Trust Badges Widget 블록 설정" width="3482" height="912" data-path="images/aftersell/checkout-widget-install-trust-badges-block-settings.png" />

***

<div id="step-3-change-app-block-position">
  ## 3단계: 앱 블록 위치 변경하기
</div>

앱 블록을 원하는 위치로 드래그 앤 드롭한 후 오른쪽 상단의 저장 버튼을 누르세요.

<img src="https://mintcdn.com/aftersell/1Y3gBpUfxv16VGSW/images/aftersell/checkout-widget-install-drag-app-block.gif?s=7d17314d5e47e74b202e18baf3867e7a" alt="Shopify 체크아웃 에디터에서 Aftersell 앱 블록을 드래그하여 위치를 변경하는 모습" width="1916" height="1080" data-path="images/aftersell/checkout-widget-install-drag-app-block.gif" />
