# 会員登録時に、複数の情報をタグ付けする方法について

**URL:** <https://community.shopify.com/t/topic/184851>\
**Category:** 技術的なQ＆A\
**Created:** [January 19, 2023, 5:01am UTC](https://community.shopify.com/t/topic/184851 "2023-01-19T05:01:23Z")\
**Posts on this page:** 3\
**Page:** 1

## AI-generated summary

**課題:**
Shopifyの会員登録時に、誕生日や性別などの複数フォーム情報を顧客タグに直接反映させたい。現状では`name="customer[tags]"`を1つのフィールドにのみ付与すると、そのフィールドだけがタグ化され、他の情報はメモ欄に入る。複数フィールドを同時にタグ付けする方法が不明。

**解決策:**
- `input type="hidden"`要素の`value`にカンマ区切りで複数タグを設定する方法が提案された
- 例: `value="birthday:1990-01-05,gender:male"`のように記述すると、2つのタグが顧客情報に追加される
- JavaScriptを使用して、各入力フィールドの変化を監視し、hidden要素のvalueを動的に更新する実装例が提供された
- 生年月日の3つのselectフィールド(年・月・日)の値を結合してタグ化するコードスニペットが共有された

**状況:**
質問者は提案されたコード例に感謝し、実装を試す意向を示している。

<div class="post-metadata">

**Author:** ![GOENINC](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/goeninc/32/117281_2.png) [@GOENINC](https://community.shopify.com/u/GOENINC)\
**Post date:** [January 19, 2023, 5:01am UTC](https://community.shopify.com/t/topic/184851/1 "2023-01-19T05:01:23Z")

</div>

いつもお世話になっております。

【相談内容】  
会員登録ページに追加した複数のフォームの情報を  
顧客情報のタグに反映させたい。

shopifyの会員登録時に、  
誕生日や性別などの情報をフォームに追加して、  
メモ欄に追加できるようにしました。

この情報を、メモではなくタグに直接追加したいのですが、  
複数の情報をタグ付けする方法がわからずにいます。

▼  
例えば、会員情報時の誕生日入力コードの中で  
「月」のみname="customer[tags]"を付与した場合は  
月に入力してもらったデータがタグ付けされ、

年と日に入力した情報はメモに反映されます。

※ valueはjavascriptで出力していますのでコードだけだとoptionの値は0です。

```markup

生年月日

- 

- 

- 

```

▼  
name="customer[tags]"を年と日にも付与する  
（customer[tags]が複数存在する）  
場合はタグ付けがされません。

```markup

生年月日

- 

- 

- 

```

会員登録情報の「複数」のフォーム情報を顧客情報のタグに入れるには

どのようにすればよいか教示いただけないでしょうか。

どうぞよろしくおねがいします。

---

<div class="post-metadata">

**Author:** ![Qcoltd](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/qcoltd/32/900_2.png) [@Qcoltd](https://community.shopify.com/u/Qcoltd)\
**Post date:** [January 19, 2023, 12:27pm UTC](https://community.shopify.com/t/topic/184851/2 "2023-01-19T12:27:22Z")

</div>

customer[tags] を使用して、複数のタグを追加する場合、次のような書き方になるようです。

```markup

```

valueに、カンマ区切りで値を設定します。

上の例ですと、

1. VIP

2. てすてす

3. hogehoge

の3つの顧客タグが会員登録時に付与されます。

上記踏まえ、質問者様のご質問に回答しますと、

customer[tags]で複数タグを設定するには、

JavaScriptで、

タグとして設定したいインプットフィールドの変化に応じて、

input type=“hidden” 要素のvalueを調整する、

と良いかと思います。

生年月日以外をどのようにマークアップされているか分からないので、

生年月日の部分だけ記載しますと、下記のようになりそうです。

(十分な検証はしておりませんので、ご参考まで。)

```javascript
document.addEventListener('DOMContentLoaded', function() {
  // タグ管理用のオブジェクト
　　　　const tags = {
    birthday: '',
    gender: ''
  };

　　　　// input hiddenの要素のIDをcustomer_tagsとした場合
  const inputCustomerTags = document.querySelector('#customer_tags');

  // 誕生日のselect要素を取得
　　　　const selectsBirthday = document.querySelectorAll('.customer-birthday select');

  // 誕生日のselect要素の内容が変化した際に、tag用のinput hidden要素に、変更を加える
  selectsBirthday.forEach(select => {
    select.addEventListener('change', function() {
      let birthday = new Array();
      selectsBirthday.forEach(select => {
        birthday.push(select.value);
      });
      tags.birthday = birthday.join('-');
      inputCustomerTags.value = Object.entries(tags).map(([key, value]) => (`${key}:${value}`));
    });
  })
});

```

こちらを参考に、性別などについてもscriptを追加いただくと良いかと思います。

なお、

上記のスクリプトでは、

input type="hidden"の要素のvalueには、

```auto
birthday:1990-01-05,gender:male

```

のような値が設定されますので、

うまく動作すれば、

birthday:1990-01-05

gender: male

の2つのタグが顧客情報に追加されるはずです。

上記のような処理を構築するのが難しい場合、

タグ付けに特化したShopifyアプリもいくつかあるようですので、

そちらの使用を検討されても良いかもしれません。

ご参考まで。

(キュー田辺)

---

<div class="post-metadata">

**Author:** ![GOENINC](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/goeninc/32/117281_2.png) [@GOENINC](https://community.shopify.com/u/GOENINC)\
**Post date:** [January 25, 2023, 1:27am UTC](https://community.shopify.com/t/topic/184851/3 "2023-01-25T01:27:07Z")

</div>

株式会社Q (キュー)

田辺さま

お返事遅くなって申し訳ありません。

丁寧でしかもコード例を交えたご回答、本当にありがとうございます。

なるほど、valueの中に複数のタグをカンマ区切りで入力するのだったのですね。

田辺様にご提案してもらったコードを元にタグに挿入したい情報について設定できるか試してみたいと思います！

今後ともよろしくおねがいします。