Updating customer metafield value in storefront

Hello everyone,

I need help with updating customer metafield information through the storefront. I am planning to create a small game where customers can click a button on the frontend to update their metafield value.

The game will be ladderized, where users pass to the next level after completing the current level. I will be using multiple metafields and updating each value at a time.

Thank you for your assistance.

Hi Jmdev23,

This is a very cool idea! You can update a customer metafield via the customerUpdate object, and target the metafields field. See if this works for you!

Hello Liam,

Thank you for your response. I just want to confirm if the metafield update will work on the frontend through the customer account? In other words, will the customer be able to easily update the metafield value by simply clicking a button on the frontend, such as on the game page? If so, I assume it will be done automatically.

Hey @jmdev23 !

The method suggested by Liam is to use Shopify’s Admin GraphQL API, which is a backend function and would require some custom development to build and integrate into your site.

Another possibility that may save you some development time would be using an app like Helium Customer Fields which is specifically designed for registering/updating customer accounts and customer metafields.

You could either use the app’s form editor to build forms to install on your site, which will update the metafields when submitted. Or you could also use our front-end APIs to build a more customized solution. You can check out our API docs here.

Hi Brett,

Thank you for your suggestion. Does the app have a way to update metafield value I set up from the customer?

How does it work if I use metafield for customer?

Best.

Hey @jmdev23 , the Customer Fields app currently only works with metafields that are specifically using the app’s namespace “customer_fields”, so it would not be able to directly edit other metafields that you may already have without a workaround.

Other than this limitation, you can definitely edit customer_fields metafield values, either directly through the app admin, through our APIs, or allow customers to do so directly through forms on the storefront.

Hello @Brett_Helium , does it work for gamification approach? I am asking if it can save changes through storefront so that I can use those value to compare if customer already done that specific activity of the game. Basically there are a lot of activities like ladderize activist. Does the app supports that kind of approach?

Best.

Hey @jmdev23 !

It sounds like you are essentially just wanting to read from and write to the customer metafields. It would require some custom work to set up, but you should be able to accomplish the customer data part of this by using our API.

Here’s the reference docs for our frontend JS API which allows you to both get and set customer_fields metafield values: https://developers.customerfields.com/front-end-api/customer-api/customer-data/

@jmdev23 not sure if you are still looking for a solution to this.

We at Clouver ran into a similar problem and decided to create an application that lets your store customers modify their own metafield data through Storefront. It does require you to have an AWS account, however the app handles all the authentication and requests to make the updates possible. Once you do deploy the app, you can add your metafields to the account page or create custom input and call the endpoint (generated when you deploy the app) using a POST request. The endpoint accepts customerAccessToken as a header value including body data for the metafields value.

Hope it can help you as well and happy to answer any questions.