Installation

Also see our help center article on Liquid installation.

The simplest way to get the app installed on a theme is to use our quick installer for a form within the app. Start by creating a form, continuing to the install step, choosing a theme, and selecting the desired locations. This will add the necessary Liquid code to use the app on a specific theme. The installer adds the following files plus any additional location-specific modifications:

snippets/customer-fields.liquid
assets/customer-fields.js
assets/customer-fields.css

Other location install

If you’d like to render a form in a specific place in your theme (say, a pop-up modal or product page), you’ll want to go through the installation process as normal and check “Other location”. This will generate a unique ID for this form, which is passed into a snippet render. It will look something like this:

{% render "customer-fields", form_id: "gK7tlA" %}

Paste this in any Liquid template you need, and the form will be rendered in that place.

Making Liquid modifications

It’s not safe to edit snippets/customer-fields.liquid, assets/customer-fields.js, or assets/customer-fields.css. These files will change as new updates become available and any changes will be overwritten. Instead, you should follow our JavaScript API guide or build a custom form, where you can create custom experiences.

JavaScript API

If you’re only wanting to get and set data on a customer dynamically with JavaScript, you don’t need any other resource other than snippets/customer-fields.liquid. Using the customer_api flag to true when rendering the snippet won’t include additional scripts, which are larger in size than the API script.

Add this to the <head> inside your layout/theme.liquid:

{% render 'customer-fields', customer_api: true, version: '<Version number>' %}