【Shopify】アカウントページを日本仕様にする（Debut編）

管理画面左側メニューの、オンラインストア > テーマ
アクション > コードを編集する

Templatesファイルの上から8つめあたり「customers/addresses.liquid」を編集する。

23〜69行（下記）を

<div class="grid">
            <div class="grid__item medium-up--one-half">
              <label for="AddressFirstNameNew">{{ 'customer.addresses.first_name' | t }}</label>
              <input type="text" id="AddressFirstNameNew" name="address[first_name]" value="{{ form.first_name }}" autocomplete="given-name">
            </div>

            <div class="grid__item medium-up--one-half">
              <label for="AddressLastNameNew">{{ 'customer.addresses.last_name' | t }}</label>
              <input type="text" id="AddressLastNameNew" name="address[last_name]" value="{{ form.last_name }}" autocomplete="family-name">
            </div>
          </div>

          <div class="grid">
            <div class="grid__item">
              <label for="AddressCompanyNew">{{ 'customer.addresses.company' | t }}</label>
              <input type="text" id="AddressCompanyNew" name="address[company]" value="{{ form.company }}" autocomplete="organization">

              <label for="AddressAddress1New">{{ 'customer.addresses.address1' | t }}</label>
              <input type="text" id="AddressAddress1New" name="address[address1]" value="{{ form.address1 }}" autocomplete="street-address address-line1">

              <label for="AddressAddress2New">{{ 'customer.addresses.address2' | t }}</label>
              <input type="text" id="AddressAddress2New" name="address[address2]" value="{{ form.address2 }}" autocomplete="street-address address-line2">
            </div>
          </div>

          <div class="grid">
            <div class="grid__item medium-up--one-half">
              <label for="AddressCityNew">{{ 'customer.addresses.city' | t }}</label>
              <input type="text" id="AddressCityNew" name="address[city]" value="{{ form.city }}" autocomplete="address-level2">
            </div>

            <div class="grid__item medium-up--one-half">
              <label for="AddressCountryNew">{{ 'customer.addresses.country' | t }}</label>
              <select id="AddressCountryNew" name="address[country]" data-default="{{ form.country }}" autocomplete="country">{{ all_country_option_tags }}</select>
            </div>
          </div>

          <div id="AddressProvinceContainerNew" style="display:none">
            <label for="AddressProvinceNew">{{ 'customer.addresses.province' | t }}</label>
            <select id="AddressProvinceNew" name="address[province]" data-default="{{ form.province }}" autocomplete="address-level1"></select>
          </div>

          <label for="AddressZipNew">{{ 'customer.addresses.zip' | t }}</label>
          <input type="text" id="AddressZipNew" name="address[zip]" value="{{ form.zip }}" autocapitalize="characters" autocomplete="postal-code">

          <label for="AddressPhoneNew">{{ 'customer.addresses.phone' | t }}</label>
          <input type="tel" id="AddressPhoneNew" name="address[phone]" value="{{ form.phone }}" autocomplete="phone">

↓　以下のコードに置き換える

<div class="grid">
            <div class="grid__item medium-up--one-half">
              <label for="AddressLastNameNew">{{ 'customer.addresses.last_name' | t }}</label>
              <input type="text" id="AddressLastNameNew" name="address[last_name]" value="{{ form.last_name }}" autocomplete="family-name">
            </div>
            
            <div class="grid__item medium-up--one-half">
              <label for="AddressFirstNameNew">{{ 'customer.addresses.first_name' | t }}</label>
              <input type="text" id="AddressFirstNameNew" name="address[first_name]" value="{{ form.first_name }}" autocomplete="given-name">
            </div>
          </div>

          <!-- <div class="grid">
            <div class="grid__item">
              <label for="AddressCompanyNew">{{ 'customer.addresses.company' | t }}</label>
              <input type="text" id="AddressCompanyNew" name="address[company]" value="{{ form.company }}" autocomplete="organization">
            </div>
          </div> -->

          <div class="grid">
            <div class="grid__item medium-up--one-half">
              <label for="AddressZipNew">{{ 'customer.addresses.zip' | t }}</label>
              <input type="text" id="AddressZipNew" name="address[zip]" value="{{ form.zip }}" autocapitalize="characters" autocomplete="postal-code">
            </div>

            <div class="grid__item medium-up--one-half">
              <label for="AddressPhoneNew">{{ 'customer.addresses.phone' | t }}</label>
              <input type="tel" id="AddressPhoneNew" name="address[phone]" value="{{ form.phone }}" autocomplete="phone">
            </div>
            
            <div class="grid__item">
              <label for="AddressCountryNew">{{ 'customer.addresses.country' | t }}</label>
              <select id="AddressCountryNew" name="address[country]" data-default="{{ form.country }}" autocomplete="country">{{ all_country_option_tags }}</select>
            </div>
            
            <div id="AddressProvinceContainerNew" class="grid__item medium-up--one-half" style="display:none">
            <label for="AddressProvinceNew">{{ 'customer.addresses.province' | t }}</label>
            <select id="AddressProvinceNew" name="address[province]" data-default="{{ form.province }}" autocomplete="address-level1"></select>
          　</div>
            
            <div class="grid__item medium-up--one-half">
              <label for="AddressCityNew">{{ 'customer.addresses.city' | t }}</label>
              <input type="text" id="AddressCityNew" name="address[city]" value="{{ form.city }}" autocomplete="address-level2">
            </div>
          </div>

      　　　　<label for="AddressAddress1New">{{ 'customer.addresses.address1' | t }}</label>
              <input type="text" id="AddressAddress1New" name="address[address1]" value="{{ form.address1 }}" autocomplete="street-address address-line1">

              <label for="AddressAddress2New">{{ 'customer.addresses.address2' | t }}</label>
              <input type="text" id="AddressAddress2New" name="address[address2]" value="{{ form.address2 }}" autocomplete="street-address address-line2">

会社名も表示させたい場合は、35行目のコメントアウトを解除する。