Liquid and JavaScript

Metafield Data

We store customer information in two places - our database and metafields. When a customer is saved, metafields will be stored with the customr namespace and a key that relates to the key setup if the fields section. Of course, this data is accessible to either the Shopify API or front-end liquid as such:

Custom Fields

Sweet. You're a rockstar and want to develop out your own form submission UI. You could use our form builder, but really you're cooler than that. Guess what? You don't have to! All you must do is create hidden fields for the attributes you want to capture in fields and build your own markup with the associated names. You must namespace the form names as such:

Now you can go nuts and build out that special UI you're after.

Reset Password Field

Currently, Customer Fields will hide all password fields within the edit account form so that customers don't inadvertently change their password. If you'd like an option for customers to reset their password we suggest looking at Shopify's native method for doing so.

Shopify Fields

If you name a field with a key that relates to a Shopify customer attribute, we'll assign the value of that field to the customer data field within Shopify. For example, if you name a key "tags" or "first_name", a change within Customr will be reflected in the actual Shopify customer in the admin.


Skip Validation

If you need to prevent field validations (required fields), you can add the `skip_validation` param to the form.

<input type="hidden" name="skip_validation" value="true" />


By default, Customer Fields will autofill any field with a value, even if it's blank. If you don't want this to happen, add the data-nofill="true" attribute to the input field and it will be ignored.

<input type="hidden" name="customer[custom_field]" value="custom value" data-nofill="true"/>

Callback Hooks

If you want to do development work with Customr, you'll want to use event hooks that allow you to do JavaScript when you need. Within the customr.liquid snippet, a global Customr object is defined. Within this object, you can use the following callback methods. Note that if a function returns false the current function will be returned and will not continue to execute.