Skip to main content

送料詳細設定App

送料詳細設定Appについて​

国内外の地域ごとの送料を商品単位で簡単に設定できるAppです。
※送料詳細設定AppはAppをインストールすると自動で表示されるので、テーマ側での実装は不要です。

表示例​

国内配送方法を設定している場合、{ItemAttentionTag} で出力される「※送料は¥xxxです。詳細を見る」というテキストのリンクをクリックするとモーダルウィンドウが表示されます。
モーダルウィンドウが表示される時にはグレー半透明の背景が全体に広がるようになっています。
モーダルウィンドウはレスポンシブ表示に対応しています。

海外配送方法を設定している場合、海外配送対応可能な商品については{ItemAttentionTag} に「この商品は海外配送できる商品です。海外送料を見る」というテキストが表示されます。
テキストのリンクをクリックすると、国内配送の場合と同様のモーダルウィンドウが表示されますが、海外送料のタブがデフォルトで選択されます。

送料詳細設定App デスクトップ表示

出力HTML​

商品詳細ページの{ItemAttentionTag}に以下内容が自動で展開されます。

全国一律送料0円の場合

<p class="attention">※この商品は送料無料です</p>

全国一律送料有料の場合

<p class="attention">※送料は¥xxxです。<a id="postageOpen">詳細を見る</a></p>

複数配送方法がある場合
<p class="attention">※送料は¥xxx〜です。<a id="postageOpen">詳細を見る</a></p>

サイズ別、地域別送料の場合

<p class="attention">※送料はサイズや地域により異なります。<a id="postageOpen">詳細を見る</a></p>

送料無料条件を設定している場合

<p class="attention">※¥xxx以上のご注文で送料が無料になります。</p>

海外配送方法を設定している場合

海外配送可能な商品
<p class="attention">※この商品は海外配送できる商品です。<a id="postageOpen">海外送料を見る</a></p>

海外配送不可な商品
<p class="attention">※この商品は海外への発送は行なえません。</p>

タグ一覧​

送料詳細設定Appにタグはありません。

ブロック​

ローカライズテキスト​

ローカライズテキストはありませんが、英語・外貨対応Appをインストールし、英語に翻訳した場合、自動的に英語に翻訳されます。

対応が必要な箇所一覧​

※テーマ側での実装は不要です。

デザインマーケットで販売するテーマを作る時の注意点​

  • 送料詳細設定Appをインストール済み、未インストールのどちらのケースでもデザインが崩れないように実装してください
  • 背景色やテキストカラー、リンクのテキストカラーを設定した場合
    • 商品詳細ページ内に送料に関するテキストが表示されているか、リンクの視認性が保たれているか
    • 送料詳細を表示するモーダル内の文字など視認性が保たれるように実装してください
  • デモショップで全国一律または地域別、サイズ別や海外送料を登録し、表示確認を行ってください

動作のチェック​

動作確認するには下記項目を参考にしてください。

商品詳細ページ内のモーダルウィンドウ​

  • 国内配送方法、海外配送方法共に、レイアウト崩れがなく正しく表示しているか
  • 国内配送方法、海外配送方法共に、正しいタブがデフォルトで選択されているか
  • 背景色やテキストカラーを設定した場合でも、視認性が保たれているか