Disclaimer: All Customer Fields forms installed after November 8, 2022 use Shopify's theme app extensions for form installation. The new form installation process does not add any files to a store's theme, nor does it change any of a theme's existing files. All details in the article below only pertain to shops that have used the app's vintage form installation process (prior to Nov 8, 2022).

Fast, lightweight, and unobtrusive

The installation tool in our Customer Fields app has been purpose-built with one primary goal in mind: to make things fast and easy for everyone involved. By everyone, we mean store owners & staff, agencies, developers, Shopify, and even us here at Helium!

In fact, we're on a mission to set a higher standard for app developers within the Shopify ecosystem. Providing transparency regarding changes to theme code and giving the user control over these changes are critical pieces of the puzzle, yet they are often overlooked or in some cases outright disregarded. We want to be different - we want to be better. This is why we've detailed out exactly what the app changes in a theme, when it is changed, and how it is changed.

Select a theme

The form installer will display a list of all of the store's available themes in a dropdown. Note that the store's live (aka "published") theme will always show at the top of the list, appended with the word live in parenthesis. Simply select the theme you wish to use so the app knows where to install the frontend code. You can find more details on the frontend code at the bottom of this article.

Install Location(s)

After selecting a theme, you'll need to choose an install location for the form. There are normally 4 options to choose from, but in some cases, a 5th option will show:

Registration page
Login page (only shown if the selected theme has a signup form on login)
Edit account page
Separate page
Other location

All of the options above are referred to as Install locations in the app admin. Each install location has its own unique set of changes that are made to the theme's templates, and these specific changes are noted directly in the app under the Theme changes section. See below for an example:

Frontend app code

In addition to the location-specific changes, the following changes are also made to the selected theme when a form is installed or updated:

Create/update snippets/customer-fields.liquid
Create/update assets/customer-fields.js
Create/update assets/customer-fields.css
Create/update assets/cf_form_data.<FORM ID>.json

Notice that the last file in the list above is a form-specific asset, with the form's ID in the file name. If there are multiple forms installed on the same theme, then there will be multiple JSON asset files in that theme.

❗ Important note

Do not make any code edits to the 4 files listed above, otherwise you'll run the risk of breaking things. If you need any help making customizations to the app or its forms, please contact us via live chat or email and we'll be happy to assist, or at least point you in the right direction 👍

Developer docs

Looking for more technical details? Want to build a custom solution using Customer Fields?

Head over to our developer docs to find more information and developer-focused guides:

developers.customerfields.com