# ボタン種類と見た目に関する主要なパラメータについて

# 1. ボタン種類
Amazon Payには サインイン用のボタンと決済用のボタンの2種類があります。
それぞれのボタンの出し分けは ボタンレンダリング時のjavascriptに設定するproductTypeを使用します。

 **サインイン用のボタン（productType=SignIn)** 

![サインイン用ボタン画像](https://d2squ3eekfa1zc.cloudfront.net/image/QA-605-1.png)

なお、サインイン用のボタンを表示するjavascriptにはsingInConfigを入れます

 **決済用のボタン(productType=PayAndShip または PayOnly)** 

![決済用ボタン画像](https://d2squ3eekfa1zc.cloudfront.net/image/QA-605-2.png)

なお、決済用のボタンを表示するjavascriptにはcreateCheckoutSessionConfigを入れます

# 2. ボタンの色
それぞれのボタンは以下の３種類の色から選択いただけます。
色の出し分けは、ボタンレンダリング時のjavascriptに設定するbuttonColorを使用します。

 **buttonColor=Gold** 

![サインインボタンGold画像](https://d2squ3eekfa1zc.cloudfront.net/image/QA-605-1.png)

![決済ボタンGold画像](https://d2squ3eekfa1zc.cloudfront.net/image/QA-605-2.png)

 **buttonColor=LightGray** 

![サインインボタンLightGray画像](https://d2squ3eekfa1zc.cloudfront.net/image/QA-605-3.png)

![決済ボタンLightGray画像](https://d2squ3eekfa1zc.cloudfront.net/image/QA-605-4.png)

 **buttonColor=DarkGray** 

![サインインボタンDarkGray画像](https://d2squ3eekfa1zc.cloudfront.net/image/QA-605-5.png)

![決済ボタンDarkGray画像](https://d2squ3eekfa1zc.cloudfront.net/image/QA-605-6.png)


指定しない場合はGoldが選択されます。



# 3. ボタン設置場所
ボタンを表示するjavascriptには、placement (Amazon Payボタンの配置場所)を適切に設定します。

placementとしてサポートされている値:

* Home - 初期ページまたはメインページ
* Product - 商品詳細ページ
* Cart - 購入者が決済を開始する前のカート確認ページ
* Checkout - 購入者が決済を開始した後の任意のページ
* Other - 上記説明に当てはまらないページ

# 参考) 関数パラメータ
[Amazon Payボタンを追加する - 関数パラメータ](https://developer.amazon.com/ja/docs/amazon-pay-checkout/add-the-amazon-pay-button.html#%E9%96%A2%E6%95%B0%E3%83%91%E3%83%A9%E3%83%A1%E3%83%BC%E3%82%BF)

# 参考) コードサンプル
[Amazonサインインのコードサンプル](https://developer.amazon.com/ja/docs/amazon-pay-checkout/amazon-pay-script.html#amazon%E3%82%B5%E3%82%A4%E3%83%B3%E3%82%A4%E3%83%B3%E3%81%AE%E3%82%B3%E3%83%BC%E3%83%89%E3%82%B5%E3%83%B3%E3%83%97%E3%83%AB)

[Amazon Pay決済のコードサンプル](https://developer.amazon.com/ja/docs/amazon-pay-checkout/amazon-pay-script.html#amazon-pay%E6%B1%BA%E6%B8%88%E3%81%AE%E3%82%B3%E3%83%BC%E3%83%89%E3%82%B5%E3%83%B3%E3%83%97%E3%83%AB)