Howdy新規会員登録フォームアプリ

thumbnail
カテゴリー

使い方

Howdy新規会員登録フォームアプリの使い方を説明します。

新規会員登録フォームの表示タイミング

会員登録フォームの表示タイミングを 1.ログイン前:メールアドレス入力後に登録フォームへ遷移 2.ログイン後:ログイン後に登録フォームへ遷移 の2種類からお選びいただけます。 ① ログイン前にフォーム表示 ログインが行われる前に会員登録フォームが表示される形式です。 『従来のお客様アカウント』により近いフローになっています。 ② ログイン後にフォーム表示 ログインが行われた後に会員登録フォームが表示される形式です。 『Shopifyの新基準』により近いフローになっています。 設定方法 アプリ管理画面の一般設定から、フローを変更することが可能です。 Go online to view this image
新規会員登録フォームの表示タイミング

購入前に必ず会員情報を取得する方法

テーマにコード記載をすることで、購入前に必ず会員情報を取得する方法をお伝え致します。 ※コード編集が必要なため、エンジニア向けの記事になります。 ※ご担当のエンジニアがいない場合、弊社カスタマーサービスまでご連絡いただけましたら、弊社にて導入のサポートをすることが可能ですので、お問い合わせください。 Howdyカスタマーサービス:support@ec-penguin.com ①会員登録フォームをテーマに適用 まず最初に、会員フォームの設定を終了させてください。 オンラインストア→カスタマイズから、テーマのカスタマイズ画面に移動します。 アプリブロックを有効にしましょう。 そして、保存を押します。 ②コード編集の内容 チェックアウトページに移動するためのボタン、カートページの「ご購入手続きへ」ボタンや、テーマHorizonの右上にあるカートボタンを押した時に右側からでてくるカートドロワーの「ご購入手続きへ」ボタンに、(顧客ログインしていない場合の条件付けを行い)以下のclassをつけると、チェックアウトページへの遷移前にHowdy新規会員登録アプリを設置できるようになります。 これにより
購入前に必ず会員情報を取得する方法

非対応のテーマにHowdy新規会員登録アプリを設置する方法

※2026年4月4日現在、Howdy新規会員登録アプリがアプリ上で選択できるテーマは「Dawn/Rise」「Horizon系」「Prestaige」の3つです。 ※2026年9月8日現在、すべてのテーマに対応いたしました! ここでは、うまく表示されない場合のテーマにHowdy新規会員登録アプリを設置する方法をお伝えします。 コード編集が必要なため、エンジニア向けの記事になります。 ※ご担当のエンジニアがいない場合、弊社カスタマーサービスまでご連絡いただけましたら、弊社にて導入のサポートをすることが可能ですので、お問い合わせください。 Howdyカスタマーサービス:support@ec-penguin.com ①会員登録フォームをテーマに適用 まず最初に、会員フォームの設定を終了させてください。 オンラインストア→カスタマイズから、テーマのカスタマイズ画面に移動します。 アプリブロックを有効にして、保存を押します。 ②会員登録フォームの表示のタイミングを「ログイン前」に設定 コード編集したときの挙動を確認するため、会員登録フォームの表示タイミングを「ログイン前」に設定しましょう。 一般設
非対応のテーマにHowdy新規会員登録アプリを設置する方法

住所の自動入力設定方法

会員登録フォーム上で『住所自動入力』が利用できます。 ※日本の住所のみの対応となります。 アプリの「一般設定」から、「住所の自動入力」を「あり」に設定し、保存。 「郵便番号入力 → 住所が自動入力」が可能になります。
住所の自動入力設定方法

誕生日施策で誕生月の顧客タグを付ける方法

新規会員登録時にお客様の情報を取得する目的として、一番多いと思われるのが顧客情報をマーケティングに利用したいということかと思います。 そのマーケティング施策の中でもよくある施策が誕生日付きに誕生日のお客様に割引コードなどをプレゼントするなどの施策があります。 この施策をShopifyで実施するためには、お客様の情報を取得した際に、お客様それぞれに誕生日付きの顧客タグをつけておく方法を取られているストア様が多いかと思います。 今回こちらのドキュメントでは、Howdy新規会員登録フォームアプリでお客様の誕生日を日付で取った後に、 Shopify Flow を使い、取得した情報から誕生月の顧客タグをつける方法をご紹介します。 ①Howdy新規会員登録フォームアプリで誕生日情報を取得する ドキュメント「アプリの初期設定」を参考にして、新規会員登録フォームアプリで誕生日の情報を取得する設定をしてください。 設定する顧客メタフィールドは、ここでは以下の形にします。 ・名前:誕生日 ・ネームスペースとキー:custom.bd ・タイプ:整数(1つの値) ②Shopify Flowの設定 次に、Sho
誕生日施策で誕生月の顧客タグを付ける方法

会員登録ポップアップに文字を追加する方法

会員登録ポップアップに文字を追加してカスタマイズする
会員登録ポップアップに文字を追加する方法

会員登録フォームの項目に文字数制限をつける方法

会員登録フォームに入力していただく項目に文字数制限をつけることが可能です。 文字数制限を付けられる場所は2つ ①フォームの項目が「Shopify項目(Shopifyで元々準備されている項目)」の「氏名」「電話番号」「郵便番号」「都道府県」「市町村」「番地・建物名」「部屋番号など」であること。 ②フォームの項目が「カスタム項目(メタフィールドで取得)」で、かつ、入力項目が「テキスト(1行)」「テキストエリア(複数行)」のであること。 それぞれの設定方法は以下。 ①Shopify項目の設定方法 アプリの「会員登録フォーム」から、「Shopify項目を追加」をクリック。 任意の項目を追加。ここでは「市町村」を追加。 項目(ここでは「市町村」)の編集マークをクリック。 文字数を制限するのチェックボックスにチェックを入れる。 文字数制限の最大文字数を半角数字で入力。 任意でエラーメッセージを入力。空欄の場合はデフォルトのメッセージが表示されます。 保存を押して終了。 ②カスタム項目の設定方法 アプリの「会員登録フォーム」から、「カスタム項目を追加」をクリック。 それぞれの入力を行い、入力タイプか
会員登録フォームの項目に文字数制限をつける方法

新規会員判定を使用して、既存の顧客にもログインフォームを出す方法

Howdy新規会員登録フォームアプリでは、新規登録する方が新規会員かどうかを判断して「新規会員登録フォーム」を出すか出さないかを決定します。 この判断方法として、デフォルトでは、メールアドレスの入力後にそのメールアドレスえ登録された顧客情報の「氏名」があるかを確認し、「氏名」に入力があれば顧客情報があると判断し「新規会員登録フォーム」を出さずにログインする流れとなっています。 もう一つの選択方法として、「顧客タグ」を判断基準として使用することができます。 ※ログイン前にフォームを設置する場合の判別タイミング「メールアドレスを入力した後に新規顧客か判別」 ※ログイン後にフォームを設置する場合の判別タイミング「ログインする時に新規顧客か判別」 どのような時に「顧客タグ」で新規会員判別をするべきか 新規顧客会員の判別に「顧客タグ」を使うべきケースの代表的な例は、既に動いているストアで、新規会員の他に既存の顧客からも情報を取得したい際に使用します。 設定方法は、 ・新規会員判断の基準:顧客タグ ・条件設定: 例)顧客タグ「member」を含まない場合に会員登録フォームを表示 ・会員登録完了タグ
新規会員判定を使用して、既存の顧客にもログインフォームを出す方法

フォーム入力後のリダイレクト先をコードで指定する方法

Howdy 会員登録フォーム アプリ
フォーム入力後のリダイレクト先をコードで指定する方法

独自のCSS, JavaScriptを適用する方法

カスタムCSS, カスタムJS の適用方法
独自のCSS, JavaScriptを適用する方法

会社メタフィールドをプロフィールページに設定する方法

Howdy新規会員登録アプリでは、会社メタフィールドブロックをプロフィールページに表示させることが可能です。 設定方法は、 会社Metafieldsを選択 Metafields設定 プロフィールに埋め込み で会社Metafieldsの編集、表示までできるようになりました。 プロフィールページの設定方法に関しては以下をご確認ください。 https://docs.channel.io/howdy-app/ja/articles/app-profile-tutorial-0d363c71
会社メタフィールドをプロフィールページに設定する方法

メタフィールドのお客様アカウントAPIの Read and Write を有効化する方法

このようなエラーが出た場合にも 『このメタフィールドの Customer Account アクセスが有効ではありません。Shopify 管理画面で "読み取りと書き込み" を有効にしてください。』 『このメタフィールドは読み取り専用です。Shopify 管理画面で "読み取りと書き込み" に変更してください。』 対応する必要がございます。 ① メタフィールド定義画面に移動する Shopify管理画面の 設定→メタフィールドとメタオブジェクト を開きます。 次に 該当するメタフィールド項目を選びましょう。 今回はお客様メタフィールドを選択します。 ②読み取りと書き込みの許可をする これでSaveすれば完了です。
メタフィールドのお客様アカウントAPIの Read and Write を有効化する方法

複数フォーム導入

①会員登録フォームでフォームを作成する 会員登録フォームから複数の会員登録フォームを作成しましょう。 ②カスタマイズ画面からテーマに埋め込む テーマ→カスタマイズ画面に移動し 「会員登録フォーム」ブロックを追加しましょう。 ③フォームIDを追加する フォームIDを指定することで、特定のフォームへの導線とすることが可能です。 またコード上で下記のように data-form で特定フォームの指定も可能ですので、もし必要でしたら サポートまでご連絡ください。(support@macro-micro.co.jp) <button class="howdy-register-original-trigger-btn" data-form="b3d0bk" data-login-redirect="/" data-register-redirect="/pages/thanks" data-already-loggedin="{{ routes.account_url }}" >ボタン</button>

誕生月を取得して誕生日割引クーポンを発行する方法

新規会員登録フォームを使用して、マーケティング施策をおこなう方法として、お客様の誕生月を取得して、お客様の誕生月に割引クーポンをお送りする方法があります。 このドキュメントでは、誕生月取得の設定方法から、誕生月に割引クーポンを送付する方法までをわかりやすくご説明いたします。 初期設定は既に終わっている状態からご説明いたします。 ※初期設定は以下をご確認ください ①【事前準備】顧客メタフィールドの設定方法 ②【初期設定】テーマにフォームを埋め込む ③【初期設定】会員登録フォーム ④【初期設定】プロフィールページ 1,Howdy新規会員登録フォームアプリを取得して誕生月を取得する まず最初に、顧客メタフィールドを作成し、お客様の誕生月情報を保存する場所を作成します。 Shopify管理画面の左下にある「設定」から入り、「メタフィールドとメタオブジェクト」⇒「メタフィールドの定義」⇒「お客様」を選択します。 右上の「定義を追加する」をクリック。 メタフィールドを定義していきます。下の画像のようにご入力ください。 今回「ネームスペースとキー」は「custom.birth_month」とします。
誕生月を取得して誕生日割引クーポンを発行する方法

リンクつき利用規約設定方法

まず、会員登録フォームに「利用規約」のチェックボックスを追加します。 次に、利用規約とプライバシーポリシーページへのリンクを貼る設定もご説明します。 1,「利用規約」を設定する 「フォームを作成」をタップ 「フォームタイトル」を入力して「保存」 カスタム項目を追加 新しい顧客メタフィールド定義を追加をタップ メタフィールド定義を設定する 名前→ terms of service タイプ→真または偽 「保存」して、右上のバツボタンをタップ Shopify メタフィールド定義で、先ほど作成した「terms of service」を選択する 必須項目にチェックを入れて「追加」 利用規約が追加されたのを確認して「保存」 2,「利用規約」「プライバシーポリシー」にリンクを貼る 「利用規約」の鉛筆ボタンをタップ 「表示ラベル」に以下のコードを入力して「保存」 ①利用規約へのリンクを貼る場合 <a href="#" target="_blank"><u>利用規約</u></a>への同意 ②利用規約とプライバシーポリシーへのリンクを貼る場合 <a href="#" target="_blank"><u
リンクつき利用規約設定方法

住所入力を設定する方法

「決済時の住所入力を、もっとスムーズにしたい」—— そんな時は、会員登録フォームで住所を事前に登録してもらう方法がおすすめです。 この記事では、その設定手順をご紹介します。 ※初期設定は以下をご確認ください 1.【初期設定】テーマにフォームを埋め込む 2.【初期設定】会員登録フォーム 3.【初期設定】プロフィールページ 1.会員登録フォームに住所入力を設定する方法 ここからは、初期設定「②会員登録フォームを編集」の続きです。 フォームをより深く活用していきましょう。 Shopify管理画面の左メニューから、アプリ「Howdy New Customer」>「会員登録フォーム」を開き、以下を操作します。 1. フォーム項目の「➕➕➕Shopify項目を追加」をクリック 2. 一覧から「住所:〇〇」を選択 3. 「追加」をクリック これで、会員登録フォームに住所の入力欄が追加されます。 2.【越境の場合】国を追加する 海外のお客様にも対応する場合は、「編集」から任意の国を選んで追加します。 日本国内のお客様のみであれば、国の項目は省いていただいて構いません。国外のお客様もいる場合は、国を追加

SHOPアカウントログインと併用する方法

ストアフロント側の見え方 まず最初にストア上で SHOPログイン & Howdy会員登録フォーム を併用した場合のお客様側のフローを見てみましょう。 ストアで「ログイン/新規会員登録」ボタンを押す Shopifyのログイン画面に遷移し、Continue with shop で SHOPアカウントでログインする 未登録の場合は、会員登録フォームが表示される もちろんすでに会員登録済みの場合は、会員登録フォームの表示なしで遷移できます。 Howdyアプリ上での設定 次に実際のHowdyアプリ画面上の設定方法です。 会員登録フォームの表示は「ログイン後」にする (表示タイミング: ログイン前、ログイン後の違いはこちら https://docs.channel.io/howdy-app/ja/articles/registration-form-timing-a3e5c1b7 ) 会員登録フォーム表示条件を「顧客タグ」にする 必ず特定の「顧客タグ」の有無を登録フォーム表示の条件にして、 フォーム経由で登録されたら「顧客タグ」をつけるようにしましょう。 これで SHOP アカウントでのログイン時