Registration form - can't see a new field I added in the customer section

[Ben1000]

Hi,

I'm using the Dawn theme.

I added new field "City" to the registration form. so now it looks like this:

But somehow I can't see the City field in the customer section, there is no 'City' tag.

The 'Location' field that was already existing doesn't help much - it shows:

1. only the Country

2. The city only if the customer already purchased something

But I need to know the city the user filled in case he is not a customer yet.

How can I see this information?

Thanks

[AvadaCommerce]

Hi @Ben1000 ,

May you try to add customers by manually and check it if it show city on that or not? 

As normail, it will show city on Location 

If it still do not show on that, then you should check your themes and contact with Shopify to check it much more.

Hope you are doing well, Have a nice day.

[Ben1000]

Hi @AvadaCommerce,

The case you have mentioned works, but I was talking about another case.

When a user creates an account, I added a "city" field to the registration form, but I don't see it in the Shopify customer section, in the area you shared in the last screenshot.

Here is the code for customers/register.liquid

{{ 'customer.css' | asset_url | stylesheet_tag }}

<div class="customer register">
  <svg style="display: none">
    <symbol id="icon-error" viewBox="0 0 13 13">
      <circle cx="6.5" cy="6.50049" r="5.5" stroke="white" stroke-width="2"/>
      <circle cx="6.5" cy="6.5" r="5.5" fill="#EB001B" stroke="#EB001B" stroke-width="0.7"/>
      <path d="M5.87413 3.52832L5.97439 7.57216H7.02713L7.12739 3.52832H5.87413ZM6.50076 9.66091C6.88091 9.66091 7.18169 9.37267 7.18169 9.00504C7.18169 8.63742 6.88091 8.34917 6.50076 8.34917C6.12061 8.34917 5.81982 8.63742 5.81982 9.00504C5.81982 9.37267 6.12061 9.66091 6.50076 9.66091Z" fill="white"/>
      <path d="M5.87413 3.17832H5.51535L5.52424 3.537L5.6245 7.58083L5.63296 7.92216H5.97439H7.02713H7.36856L7.37702 7.58083L7.47728 3.537L7.48617 3.17832H7.12739H5.87413ZM6.50076 10.0109C7.06121 10.0109 7.5317 9.57872 7.5317 9.00504C7.5317 8.43137 7.06121 7.99918 6.50076 7.99918C5.94031 7.99918 5.46982 8.43137 5.46982 9.00504C5.46982 9.57872 5.94031 10.0109 6.50076 10.0109Z" fill="white" stroke="#EB001B" stroke-width="0.7">
    </symbol>
  </svg>
  <h1>
    {{ 'customer.register.title' | t }}
  </h1>
  {%- form 'create_customer', novalidate: 'novalidate' -%}
    {%- if form.errors -%}
      <h2 class="form__message" tabindex="-1" autofocus>
        <svg aria-hidden="true" focusable="false" role="presentation">
          <use href="#icon-error" />
        </svg>
        {{ 'templates.contact.form.error_heading' | t }}
      </h2>
      <ul> 
        {%- for field in form.errors -%}
          <li>
            {%- if field == 'form' -%}
              {{ form.errors.messages[field] }}
            {%- else -%}
              <a href="#RegisterForm-{{ field }}">
                {{ form.errors.translated_fields[field] | capitalize }}
                {{ form.errors.messages[field] }}
              </a>
            {%- endif -%}
          </li>
        {%- endfor -%}
      </ul>
    {%- endif -%}
    <div class="field">      
      <input
        type="text"
        name="customer[first_name]"
        id="RegisterForm-FirstName"
        {% if form.first_name %}value="{{ form.first_name }}"{% endif %}
        autocomplete="given-name"
        placeholder="{{ 'customer.register.first_name' | t }}"
      >
      <label for="RegisterForm-FirstName">
        {{ 'customer.register.first_name' | t }}
      </label>
    </div>
    <div class="field">
      <input
        type="text"
        name="customer[last_name]"
        id="RegisterForm-LastName"
        {% if form.last_name %}value="{{ form.last_name }}"{% endif %}
        autocomplete="family-name"
        placeholder="{{ 'customer.register.last_name' | t }}"
      >
      <label for="RegisterForm-LastName">
        {{ 'customer.register.last_name' | t }}
      </label>
    </div>
    <div class="field">      
      <input
        type="text"
        name="customer[city]"
        id="RegisterForm-city"
        {% if form.last_name %}value="{{ form.last_name }}"{% endif %}
        autocomplete="city"
        placeholder="{{ 'customer.register.city' | t }}"
      >
      
<label for="RegisterForm-city">
        {{ 'customer.register.city' | t }}
      </label>
    </div>
    <div class="field">      
      <input
        type="email"
        name="customer[email]"
        id="RegisterForm-email"
        {% if form.email %} value="{{ form.email }}"{% endif %}
        spellcheck="false"
        autocapitalize="off"
        autocomplete="email"
        aria-required="true"
        {% if form.errors contains 'email' %}
          aria-invalid="true"
          aria-describedby="RegisterForm-email-error"
        {% endif %}
        placeholder="{{ 'customer.register.email' | t }}"
      >


      
      <label for="RegisterForm-email">
        {{ 'customer.register.email' | t }}
      </label>
    </div>
    {%- if form.errors contains 'email' -%}
      <span id="RegisterForm-email-error" class="form__message">
        <svg aria-hidden="true" focusable="false" role="presentation">
          <use href="#icon-error" />
        </svg>
        {{ form.errors.translated_fields['email'] | capitalize }} {{ form.errors.messages['email'] }}.
      </span>
    {%- endif -%}
    <div class="field">     
      <input
        type="password"
        name="customer[password]"
        id="RegisterForm-password"
        aria-required="true"
        {% if form.errors contains 'password' %}
          aria-invalid="true"
          aria-describedby="RegisterForm-password-error"
        {% endif %}
        placeholder="{{ 'customer.register.password' | t }}"
      >
      <label for="RegisterForm-password">
        {{ 'customer.register.password' | t }}
      </label>
    </div>
    {%- if form.errors contains 'password' -%}
      <span id="RegisterForm-password-error" class="form__message">
        <svg aria-hidden="true" focusable="false" role="presentation">
          <use href="#icon-error" />
        </svg>
        {{ form.errors.translated_fields['password'] | capitalize }} {{ form.errors.messages['password'] }}.
      </span>
    {%- endif -%}
    <button>
      {{ 'customer.register.submit' | t }}
    </button>
  {%- endform -%}
</div>

[AvadaCommerce]

Hi @Ben1000 ,

I'm not a developer, so unfortunately I can't comment on your code or why it's not working.

May you try to add this code under your code: 

<label for="AddressCityNew" class="label--hidden">{{ 'customer.addresses.city' | t }}</label>
<input type="text" id="AddressCityNew" class="input-full" name="address[city]" placeholder="City" value="{{ form.city }}" autocapitalize="words">

<label for="AddressCountryNew" class="label--hidden">>{{ 'customer.addresses.country' | t }}</label>
<select id="AddressCountryNew" class="input-full" name="address[country]" data-default="{{ form.country }}">{{ all_country_option_tags }}</select>

What I do know is that Shopify does some dynamic validation of addresses which may be the reason you're having a difficult time saving that data. For example, Shopify provides dynamic values for the State/Province field based on the input for the Country field. It's also possible the Country data isn't saving because it doesn't exactly meet Shopify's validation requirements.

So I think you can contact shopify support to check on that

Have a nice day.

[michael-helium]

@Ben1000 - The only way to add new fields to the customer registration form that sync to the Shopify Admin > Customers page is via the Shopify Admin API. Said another way, an app is required. Either a custom app or a ready-made third-party app.

We built the Customer Fields app to help bridge this gap, and it works seamlessly with customer addresses. This feature is available on the app's Lite plan at just $12/mo.