WooCommerceのチェックアウト項目のカスタマイズ方法

作成日： 2022年12月13日
更新日：2024年4月09日

Woocommerceのチェックアウト項目のカスタマイズが出来なくなった！

WooCommerceは簡単にオンラインショップサイトが構築できる便利なプラグインです。
しかしデフォルト設定は国や州の選択や通貨がUSAになっているため、日本仕様に変更しなければなりません。
またチェックアウトページの国の選択を非表示にする方法や住所の並び替えなど簡単に出来ない仕様となっています。
そこで今回はチェックアウトページの項目をプラグイン「Checkout Field Editor」を使ってカスタマイズする方法を解説します。
尚、前提条件としてWooCommerceは既にインストール済みとします。

【やりたいこと】

国または地域を非表示にする
国は日本限定にして都道府県を選択できるようにする
通貨を日本円にして小数点以下の桁数をカットする
住所の並び順を変更する
名前にフリガナ入力欄を追加する

Add a header to begin generating the table of contents

１．日本仕様へのカスタマイズ

ダッシュボードからWooCommerce＞設定＞一般を選択します。
店舗の住所の各設定を編集することで日本仕様にすることができます。
変更箇所は以下の通り。
「販売を展開する地域」　→　特定の国に販売する
「特定の国に販売する」　→　日本
「配送可能な地域」　→　販売するすべての国に出荷する

続いて「通貨のオプション」の変更
「通貨」　→　日本円
「小数点以下の桁数」　→　0

設定は以上です。最後に「変更を保存」ボタンをクリックします。

ここまでの状態でページを見てみましょう。
国または地域が日本になっています。
都道府県の選択項目が追加され、金額もドルから円に変わっており、小数点以下も無くなっています。

WooCommerceの設定で出来るのはここまです。
次に「Checkout Field Editor」というプラグインを使って国または地域の非表示と住所の並び順の変更、フリガナ入力欄の追加を行います。

２．Checkout Field Editorのインストール

ダッシュボード＞プラグイン＞新規追加からキーワードに「Checkout Field Editor」と検索するとCheckout Field Editor (Checkout Manager) for WooCommerceのプラグインが表示されると思います。
それをインストールして有効化します。

３．国または地域を非表示にする

ダッシュボード＞Woocommerce＞購入手続きフォームを選択します。

「購入手続きフィールド」タブを開き、請求先フィールドから各項目の設定内容が表示されます。
ラベル列に「国または地域」とある行が有効になっていると思います。左側のチェックボックスにチェックを入れ、下の「無効化」ボタンをクリックします。

左下の「変更を変更」ボタンをクリックして設定を保存します。
それではチェックアウトページを見てみましょう。
国または地域の項目がなくなっているはずです。

４．住所の並び順を変更する

日本では通常、住所を入力する順番は郵便番号→都道府県→市町村→番地→アパート名（部屋番号）の順だと思います。
変更するには請求先フィールドから各項目を自由に入れ替えることが出来ます。
画面左側の赤枠部にマウスを置くとマウスカーソルが十字になりますので、クリックしながら上下に動かすと表示順を変えることが出来ます。

５．フリガナ入力欄を追加する

フリガナ入力欄を追加します。
「フィールドを追加」ボタンをクリックすると、フィールドを編集の画面が表示されます。
タイプ　→　テキスト
Name　→　billing_first_kana　※分かりやすい名前にしましょう。
ラベル　→　フリガナ（性）
クラス　→　form-row-first
を入力したら、保存して閉じるをクリックします。