商品情報にスキップ
1 2

Section Stock Store

【コード販売】
商品ページに決済アイコンを表示

【コード販売】:商品ページに決済アイコンを表示

通常価格 ¥2,500
通常価格 セール価格 ¥2,500
セール 売り切れ
税込。
【ご購入前のご注意】
⭐︎デジタルコンテンツは、その性質上、返品や返金はお受けしておりません。
⭐︎CSSに問題が生じた場合は、ご自身で適切に調整してください。
⭐︎Dawnベースで作成しております。他のテーマはレイアウト崩れなどの可能性があります。
⭐︎Shopifyアップデートによりレイアウト崩れの可能性があります。
⭐︎コードのみの販売です。解説のご連絡はお断りしています。
  • コード販売
詳細を表示する

このセクションは商品ページに設定できます。

Dawnの場合、sections > main-product.liquidに下記の2ヶ所にコードを追加してください。

{%- case block.type -%}の下に、コードの {%- when 'payment-icon' -%}・・・を追記してください。

schemaの "blocks": [ の下に、コードの { "type": "payment-icon"・・を追記してください。

商品ページの商品情報内にて、ブロックで追加できます。

表示したい決済アイコンにチェックを入れると、決済アイコンが表示されます。

現在、対応している決済アイコンは、次の通りです。

ShopPay・ApplePay・GooglePay・VISA・アメリカンエクスプレス・Mastercard・JCB・ダイナーズクラブ・Paypal・PayPay・楽天Pay・LINEPay・メルペイ・paidy・セブンイレブン・ローソン・ファミリーマート・ミニストップ・デイリーヤマザキ・auかんたん決済・Dankort・Discover・Dogecoin・Dwolla・Forbrugsforeningen・Maestro・Litecoin・ビットコイン

ちょこっとコード
    
{%- when 'payment-icon' -%}
    <style>
        .methods-of-payment img { padding: 0.2em; }
        .lt-ie9 .methods-of-payment, .ie8 .methods-of-payment, .oldie .methods-of-payment { display: none; }
    </style>
    <div class="methods-of-payment">
        <span style="display: {% if block.settings.checkbox_shopify_pay == false %}none{% endif %};">