> For the complete documentation index, see [llms.txt](https://useepay.gitbook.io/useepay/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://useepay.gitbook.io/useepay/doc/shopify-qi-ta-gong-neng/afterpay-fen-qi-zhan-shi.md).

# Afterpay分期展示

## 1.选择主题

<figure><img src="/files/XSY2CBUXMk6j89ER2gTR" alt=""><figcaption></figcaption></figure>

步骤1：找到 Online Store，选择 Themes

步骤2：点击三个点

步骤3：下拉选择 Edit dode、

## 2.搜索main-product

<figure><img src="/files/EITknKGctHZSsUr1jQQi" alt=""><figcaption></figcaption></figure>

步骤1：搜索 main-product

步骤2：选择 main-product

步骤3：图片所示位置添加如下代码：

| <p>\<!-- Afterpay Initialization Script --><br>  \<script src="<https://js.afterpay.com/afterpay-1.x.js>" defer onload="initializeAfterpay()">\</script><br></p> |
| ---------------------------------------------------------------------------------------------------------------------------------------------------------------- |

步骤4： 图片所示位置添加如下代码（搜索【id="price-{{ [section.id](http://section.id/) }}"】，该位置下面添加）：

\| <p>\<div id="afterpay-messaging-widget">\</div><br>\<script><br>function initializeAfterpay() {<br>  const widget = document.getElementById('afterpay-messaging-widget');<br><br>  if (widget && typeof Afterpay !== 'undefined') {<br>  Afterpay.createPlacements({<br>  targetSelector: "#afterpay-messaging-widget",<br>  // 金额要大于等于400且币种要是USD才生效，否则就是正常的分四期<br>  attributes: {<br>  locale: "en\_US",<br>  currency: "{{shop.currency}}",<br>  amount: "{{ product.selected\_or\_first\_available\_variant.price | money\_without\_currency }}",<br>  aprLoansAvailable: "true",<br>}<br>});<br>} else {<br>  console.error('Afterpay script not loaded or target element not found.');<br>}<br>}<br>\</script><br></p> |
\| ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |

## 效果图：

<figure><img src="/files/68H0h9m8eewvWTtYcmeu" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/x6sTKLS7t324p2tD0ZkI" alt=""><figcaption></figcaption></figure>