ヘルプセンター
利用規約
  • Stack Inc
  • アップデート履歴
    • モバイルアプリ
      • iOS
      • Android
    • VIP
  • Appify - モバイルアプリ
    • アプリ公開までの流れ
      • Step1 モバイルアプリをインストールする
      • Step2 アプリストアの設定
      • Step3 UIとロゴを設定する
      • Step4 利用料金を承認する
    • 料金体系
    • テーマ
      • デザインページ
      • リソースページ
      • マイページ
      • ヘッダーアクション
      • フッタータブ
        • ナビゲーションバー
      • お知らせバナー
      • 設定項目
      • 画像素材
    • 商品ページ
      • 商品ページの基本設定
      • 商品ページのカスタマイズ
        • 商品ボタン
        • 商品リスト
        • 商品バッジ
        • 商品バナー
      • 商品バリエーションのカスタマイズ
      • 商品詳細情報のカスタム
      • 在庫切れの非表示と再入荷受け取り通知ボタン
      • 特定の顧客にのみおすすめ表示する
      • 特定の商品のカート追加ボタンを非表示にする
      • 商品の割引前価格を非表示にする
    • 商品の検索
    • マーケティング
      • プッシュ通知
      • お知らせ
      • クーポン
      • セグメント
    • 拡張機能
      • 販売スケジュール
      • チケット
        • クーポンチケット
        • パスチケット
      • チャネルトーク連携
      • 店舗管理
        • 設定方法
        • 活用事例
      • 登録ボーナス
      • 抽選販売
        • 事前決済抽選
        • 事後決済抽選
          • CSVエクスポート
      • QRコード
        • 設定方法
        • QRコード活用事例
    • 設定
      • リンク
      • メタフィールド・タグの同期設定
      • カスタマーの情報をメタフィールドとタグへ反映させる
    • 注意事項
  • VIP - 会員プログラム
    • 料金体系
    • 通貨設定
    • ポイント
      • ポイントの付与/利用をするための初期設定
      • ポイントを付与する
        • 注文ポイント
          • 注文ポイントの設定方法
          • 注文ポイント有効化のタイミング
          • 特定の条件で注文ポイント付与倍率の変更
            • 特定の商品のポイント倍率を変更する
            • 特定の店舗からの注文のポイント倍率を変更する
            • 会員ランクでポイント倍率を変更する
          • キャンセル・返金時のポイント
            • キャンセル時の付与ポイント取消
            • 返金時のポイントについて
        • 誕生日ポイント
        • 会員登録時ポイント
        • その他のポイント
          • 管理画面から手動で付与
          • 管理者アプリからポイント付与
          • CSVでポイント付与
      • ポイントを付与しない
      • ポイントを利用する
        • ポイント利用のための設定
        • リワードでポイントを利用する
      • ポイントを表示する
      • ポイントを通知する
        • 付与を通知する
        • 失効を通知する
      • 実店舗でポイントを活用する
        • Shopify POSを利用する
        • スマレジを利用する
          • スマレジ利用の初期設定
          • Appify VIPのポイント変更をスマレジに反映するFlow設定方法
          • Appify Mobileに会員登録したらスマレジに連携するFlow
          • Appify Mobileにログインしたらスマレジに連携するFlow
        • 店舗でのポイント倍率を変更する
      • ポイントデータをエクスポートする
    • 会員ランク
      • 会員ランクの移行を行う
        • 購入履歴移行を行う
        • 固定ランクを利用する
        • ポイント移行を行う
      • 会員ランクの設定
      • 会員ランクの算出
    • リワード
      • リワード機能の初期設定
      • リワードの登録方法
      • リワードをお客様に表示する方法
      • 交換したリワードの案内方法
        • 交換された商品の下書き注文を送信する
          • 下書き注文の請求書メールを編集する
        • 交換されたクーポンを送信する
    • 友達紹介
    • 顧客タグによるディスカウント
    • 同梱制御
    • バリエーション毎の購入数量制限
  • 管理者アプリ
    • 管理者アプリのダウンロード方法
    • 管理者アプリの利用ケース
      • パスチケットのチェックインを行う
      • 店舗での注文にポイントを付与する
      • 店舗でポイントを利用済にする
  • 開発者向け
    • メタフィールドに保存されている情報
    • 顧客タグに保存されている情報
    • メタフィールドのデータをテーマに表示する
    • ポイント利用フォームを表示する
    • ポイント履歴を表示する
    • 商品の購入による獲得予定ポイント数を表示する
    • サイズチャートをアプリに表示する
    • SDKを使ってカスタムUIを実装する
  • 施策
  • 🍔Shopify Flow
    • モバイルアプリ トリガー
    • モバイルアプリ アクション
    • VIP トリガー
      • ポイントのトピック
        • 加算系
        • 減算系
    • VIP アクション
    • 活用集
      • モバイルアプリ
        • 実店舗
      • VIP
        • 会員獲得
        • リピートを増やす
      • モバイルアプリ × VIP
        • CRM
        • リピートを増やす
GitBook提供
このページ内
  1. 開発者向け

サイズチャートをアプリに表示する

商品ページに表示するHTML形式のサイズチャートには、以下のテンプレートをコピーして設定してください。テンプレートはHTMLの形式に沿っていればカスタマイズも可能です。<style>以下は編集せず、そのままご利用ください。

<table>
  <tbody>
    <tr>
      <td></td>
      <td>着丈</td>
      <td>肩幅</td>
      <td>身幅</td>
      <td>袖丈</td>
    </tr>
    <tr>
      <td>S</td>
      <td>xxx</td>
      <td>xxx</td>
      <td>xxx</td>
      <td>xxx</td>
    </tr>
    <tr>
      <td>M</td>
      <td>xxx</td>
      <td>xxx</td>
      <td>xxx</td>
      <td>xxx</td>
    </tr>
    <tr>
      <td>L</td>
      <td>xxx</td>
      <td>xxx</td>
      <td>xxx</td>
      <td>xxx</td>
    </tr>
  </tbody>
</table>
<style>
  table {
    width: 100%;
    text-indent: initial;
    border-collapse: collapse;
    text-align: center;
    line-height: 40px;
    font-size: 14px;
    border-spacing: 0;
  }
  tbody {
    display: table-row-group;
    vertical-align: middle;
    border-color: inherit;
  }
  tr {
    display: table-row;
    vertical-align: inherit;
    border-color: inherit;
  }
  td {
    display: table-cell;
    vertical-align: inherit;
    border: 1px solid rgba(31, 31, 31, 24%);
  }
</style>

オンラインストア用のサイズチャートを別のメタフィールドに保存している場合

Shopify Flowを使ってオンラインストア用に保存しているサイズチャートをアプリ表示用のメタフィールドにコピーすることができます(※1)。 下記のShopify Flowのワークフローをダウンロードし、インポートしてご利用ください。

ワークフローを有効にする前に、アクションの設定項目から、Valueフォームの2行目と3行目の Namespace と Key をオンラインストア用のサイズチャートが保存されているメタフィールドの値に変更してください。このワークフローは、オンラインストア用に保存されているHTMLにCSSのスタイルを追加した値をモバイル表示用のメタフィールドに保存します。

※1. このワークフローは、商品作成のタイミングで実行されます。商品作成後に管理画面からメタフィールドを追加する場合はワークフローが実行されないので、手動で両方のメタフィールドに値を設定してください。

前へ商品の購入による獲得予定ポイント数を表示する次へSDKを使ってカスタムUIを実装する

最終更新 1 年前

2KB
サイズチャートをモバイルアプリ表示用のメタフィールドにコピーする.flow