# アカウントページの都道府県プルダウン表示順変更について

**URL:** <https://community.shopify.com/t/topic/20828>\
**Category:** 技術的なQ＆A\
**Created:** [September 18, 2020, 1:03am UTC](https://community.shopify.com/t/topic/20828 "2020-09-18T01:03:45Z")\
**Posts on this page:** 6\
**Page:** 1

## AI-generated summary

Prestigeテーマのアカウント/住所ページで、都道府県プルダウンの表示順（アルファベット順）を一般的な順（北海道から）に変更したいという相談。チェックアウトは自動設定で問題なし。 

前提・技術背景:
- 都道府県はLiquidのall_country_option_tags（Shopify側が生成）とテーマのJS（data-provinces）で制御されるため、直接設定変更は不可。
- 該当テンプレートはtemplates/customer配下（addresses.liquidやaccount.liquid）にある想定。

提示された解決策:
1) Liquidで置換: addresses.liquidの{{ all_country_option_tags }}にreplaceフィルターを適用し、日本のサブリージョン配列を都道府県番号順（北海道→沖縄）に丸ごと置換。投稿者はこの方法で動作確認済み（スクリーンショットあり）。
2) JSで後処理: window.onload内でselect[name="address[province]"]のoptionを日本語名→順序マップでソートし直すスニペットを提示。Shopifyの内部仕様変更に比較的強い可能性。

結果・ステータス:
- 投稿者は方法1で解決済み。
- 追加のJSソリューションも共有。未解決の課題や懸念点は特になし。

<div class="post-metadata">

**Author:** ![miz](https://avatars.discourse-cdn.com/v4/letter/m/e0b2c6/32.png) [@miz](https://community.shopify.com/u/miz)\
**Post date:** [September 18, 2020, 1:03am UTC](https://community.shopify.com/t/topic/20828/1 "2020-09-18T01:03:45Z")

</div>

お世話になっております。

現在Prestigeのテーマを使っていますが、account/addressのページの住所登録formにある都道府県のプルダウンを北海道から始まる一般的な表示順に変えたいです。

現在はアルファベット順になっているのですが、どこで何を変ればいいのかわからず、質問いたします。

\<アカウントページでの表示順\>

 ![screen shot.png](https://canada1.discourse-cdn.com/shopifyforum/original/4X/e/9/d/e9d2128d326b4d7c84ffe88da4402acf612d43b4.png)

ちなみにチェックアウトのところはちゃんと自動設定になっていたため、アカウントページだけ修正すればいいかと思っています。

Liquid objectの all\_country\_option\_tagsで順番変えればいいとのコミュニティのアンサーを見たのですが、それをどこで変えれるのかすらわからない状態です。

customer.addresses.province formをどこで変えれるのか教えていただけますでしょうか。

何卒よろしくお願いします。

---

<div class="post-metadata">

**Author:** ![Jizo\_Inagaki](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/jizo_inagaki/32/149480_2.png) [@Jizo\_Inagaki](https://community.shopify.com/u/Jizo_Inagaki)\
**Post date:** [September 18, 2020, 2:49am UTC](https://community.shopify.com/t/topic/20828/2 "2020-09-18T02:49:01Z")

</div>

Prestigeは使っていないので想像になりますが、おそらくtemplates内のcustomerで、addresses.liquidかaccount.liquidというファイル名のあたりにあるのではと思います。

---

<div class="post-metadata">

**Author:** ![miz](https://avatars.discourse-cdn.com/v4/letter/m/e0b2c6/32.png) [@miz](https://community.shopify.com/u/miz)\
**Post date:** [September 18, 2020, 3:09pm UTC](https://community.shopify.com/t/topic/20828/3 "2020-09-18T15:09:06Z")

</div>

お世話になっております。

お返事ありがとうございます。

そもそもの話でall\_country\_option\_tagsの設定場所がわからないのです。

address のところには該当の単語は見つかったのですが、その他のページでは見当たらなかったです。

all\_country\_option\_tagsの場所をご教示いただけますでしょうか。

よろしくお願いします！

---

<div class="post-metadata">

**Author:** ![Jizo\_Inagaki](https://yyz1.discourse-cdn.com/shopifyforum/user_avatar/community.shopify.com/jizo_inagaki/32/149480_2.png) [@Jizo\_Inagaki](https://community.shopify.com/u/Jizo_Inagaki)\
**Post date:** [September 21, 2020, 3:07pm UTC](https://community.shopify.com/t/topic/20828/4 "2020-09-21T15:07:34Z")

</div>

確認いただきありがとうございます。

Debutの場合、{{ all\_country\_option\_tags }}もaddresses.liquidにありましたので、私ではご対応が難しいかもしれません。

一応調べましたら、以下がこの件に該当するのではと思います。

[https://community.shopify.com/topic/838344](https://community.shopify.com/topic/838344)

{{ all\_country\_option\_tags }}に関しましては、上記にあるようにShopify側から値が出力されているため、こちらからその設定を変更することはできないと思われます。

参考:

> **[Liquid objects: all\_country\_option\_tags](https://shopify.dev/docs/api/liquid/objects/all_country_option_tags)**
>
> Creates an \`\` tag for each country.

> **[theme-scripts/packages/theme-addresses at master · Shopify/theme-scripts](https://github.com/Shopify/theme-scripts/tree/master/packages/theme-addresses)**
>
> Theme Scripts is a collection of utility libraries which help theme developers with problems unique to Shopify Themes. - Shopify/theme-scripts

テーマによるため一概には言えませんが、調べたところDebutでは{{ all\_country\_option\_tags }}が生成した国選択のoptionタグのdata-provinces属性をJSで取得し、国選択に応じて動的にprovinceに値を設定して動作させているようでした。

この点から、先ほどの参考コミュニティのURLにあるように、JSで後からdata-provinces内の値を書き換える方法が考えられます。

他方、個人的に思いついたことがあり試したらできたという程度なのでお勧めできるものではないですが、以下のような方法でも順序入れ替れ変えができましたので、一応記載します。

■趣旨

- replaceフィルターでサブリージョンの配列を丸ごと、都道府県番号順に書き換える

■サンプルコード

addresses.liquidの{{ all\_country\_option\_tags }}を丸ごと以下に書き換えます。

```ruby
{{ all_country_option_tags | replace: '["Aichi","愛知県"],["Akita","秋田県"],["Aomori","青森県"],["Chiba","千葉県"],["Ehime","愛媛県"],["Fukui","福井県"],["Fukuoka","福岡県"],["Fukushima","福島県"],["Gifu","岐阜県"],["Gunma","群馬県"],["Hiroshima","広島県"],["Hokkaidō","北海道"],["Hyōgo","兵庫県"],["Ibaraki","茨城県"],["Ishikawa","石川県"],["Iwate","岩手県"],["Kagawa","香川県"],["Kagoshima","鹿児島県"],["Kanagawa","神奈川県"],["Kumamoto","熊本県"],["Kyōto","京都府"],["Kōchi","高知県"],["Mie","三重県"],["Miyagi","宮城県"],["Miyazaki","宮崎県"],["Nagano","長野県"],["Nagasaki","長崎県"],["Nara","奈良県"],["Niigata","新潟県"],["Okayama","岡山県"],["Okinawa","沖縄県"],["Saga","佐賀県"],["Saitama","埼玉県"],["Shiga","滋賀県"],["Shimane","島根県"],["Shizuoka","静岡県"],["Tochigi","栃木県"],["Tokushima","徳島県"],["Tottori","鳥取県"],["Toyama","富山県"],["Tōkyō","東京都"],["Wakayama","和歌山県"],["Yamagata","山形県"],["Yamaguchi","山口県"],["Yamanashi","山梨県"],["Ōita","大分県"],["Ōsaka","大阪府"]', '["Hokkaidō","北海道"],["Aomori","青森県"],["Iwate","岩手県"],["Miyagi","宮城県"],["Akita","秋田県"],["Yamagata","山形県"],["Fukushima","福島県"],["Ibaraki","茨城県"],["Tochigi","栃木県"],["Gunma","群馬県"],["Saitama","埼玉県"],["Chiba","千葉県"],["Tōkyō","東京都"],["Kanagawa","神奈川県"],["Niigata","新潟県"],["Toyama","富山県"],["Ishikawa","石川県"],["Fukui","福井県"],["Yamanashi","山梨県"],["Nagano","長野県"],["Gifu","岐阜県"],["Shizuoka","静岡県"],["Aichi","愛知県"],["Mie","三重県"],["Shiga","滋賀県"],["Kyōto","京都府"],["Ōsaka","大阪府"],["Hyōgo","兵庫県"],["Nara","奈良県"],["Wakayama","和歌山県"],["Tottori","鳥取県"],["Shimane","島根県"],["Okayama","岡山県"],["Hiroshima","広島県"],["Yamaguchi","山口県"],["Tokushima","徳島県"],["Kagawa","香川県"],["Ehime","愛媛県"],["Kōchi","高知県"],["Fukuoka","福岡県"],["Saga","佐賀県"],["Nagasaki","長崎県"],["Kumamoto","熊本県"],["Ōita","大分県"],["Miyazaki","宮崎県"],["Kagoshima","鹿児島県"],["Okinawa","沖縄県"]'}}

```

replaceフィルターは文字列を書き換えるようなので、書き換え対象の文字列に記号まで含めて指定できればまとめて置換できるのではと考え、いくつか試したところ上記のコードが動作した次第です。

Debutかつフォームの動作のみを確認し、かつ、かなり無理やりなため動作は保証できませんので、その点は留意ください。

※この手法の可否に関しまして他の方のご意見も伺えればと思います

---

<div class="post-metadata">

**Author:** ![miz](https://avatars.discourse-cdn.com/v4/letter/m/e0b2c6/32.png) [@miz](https://community.shopify.com/u/miz)\
**Post date:** [September 23, 2020, 8:48am UTC](https://community.shopify.com/t/topic/20828/5 "2020-09-23T08:48:46Z")

</div>

jizo様

お世話になっております！

ご丁寧にご教示いただき誠にありがとうございます！

ご教示いただいた内容で登録しましたら、無事に北海道からの表示順になりました！

 ![無題.png](https://canada1.discourse-cdn.com/shopifyforum/original/4X/a/4/f/a4f59129b1d72ef28f75f6c350ab40095a595f2c.png)

大変助かります！

今後とも何卒よろしくお願いします！

---

<div class="post-metadata">

**Author:** ![drumsoft](https://avatars.discourse-cdn.com/v4/letter/d/45deac/32.png) [@drumsoft](https://community.shopify.com/u/drumsoft)\
**Post date:** [March 26, 2023, 12:00am UTC](https://community.shopify.com/t/topic/20828/6 "2023-03-26T00:00:24Z")

</div>

（解決済みですが、探している方がいるかもしれないので）ぺージ表示後にJavascriptで並べ替えるソリューションを投稿します。 window.onload の中に追加してください。県名で並び替えるので少しだけ（Shopifyによる）変更に強いかも…？

```javascript
// sort province options
(
  pcodes => document.querySelectorAll('select[name="address[province]"]').forEach(
    select => Array.from(select.options).sort(
      (a,b) => pcodes[a.textContent] - pcodes[b.textContent]
    ).forEach(
      option => select.appendChild(option)
    )
  )
)({"北海道":1,"青森県":2,"岩手県":3,"宮城県":4,"秋田県":5,"山形県":6,"福島県":7,"茨城県":8,"栃木県":9,"群馬県":10,"埼玉県":11,"千葉県":12,"東京都":13,"神奈川県":14,"新潟県":15,"富山県":16,"石川県":17,"福井県":18,"山梨県":19,"長野県":20,"岐阜県":21,"静岡県":22,"愛知県":23,"三重県":24,"滋賀県":25,"京都府":26,"大阪府":27,"兵庫県":28,"奈良県":29,"和歌山県":30,"鳥取県":31,"島根県":32,"岡山県":33,"広島県":34,"山口県":35,"徳島県":36,"香川県":37,"愛媛県":38,"高知県":39,"福岡県":40,"佐賀県":41,"長崎県":42,"熊本県":43,"大分県":44,"宮崎県":45,"鹿児島県":46,"沖縄県":47});

```
