Customer Birthday Popup

A worked example — collect a customer's birthday from the storefront into a customer metafield.

This embed is an example, not a finished feature — it's labelled (example) in the theme customizer for that reason. It exists to show a complete path from a storefront interaction to a Shopify metafield. Treat it as a reference implementation you'd replace with your own.

A logged-in customer sees a prompt for their date of birth. Submitting it writes to a customer metafield through FieldsRaven. On the customer's birthday, the embed shows them a greeting.

Prerequisites: the Storefront Kit embed enabled with Include AlpineJS ticked — this embed is built with Alpine and does nothing without it.

Raven setup

Create a raven with:

• Resource customer

• Namespace fields_raven and key birthday — the embed reads customer.metafields.fields_raven.birthday directly, so both must match exactly

• Type single_line_text_field

Then copy the raven's id into the embed's Raven ID setting.

Settings

Setting	Purpose
Raven ID	The raven the submission writes through.
Submit button text	Label on the submit button.
Customer logout text	Shown to visitors who aren't logged in — the embed needs a customer to attach the metafield to.

Create a raven, make sure to match the properties in the screenshot

Copy raven ID

Theme customizer settings

Make sure that the Storefront Kit is enabled and AlpineJS in included

1) Go to App Embeds in theme customizer 2) Enable Birthday Popup 3) Paste raven ID from the previous step

Adjust app embed settings

Save your changes!

Storefront

Birthday popup trigger on the storefront

Customer logged-out state

Customer logged-in, before adding a birthday state

After customer submits their birthday

Birthday message