# Customer Birthday Popup

### Raven setup

{% hint style="warning" %}
This App Embed is an example to demonstrate what you might be able to build on top of FieldsRaven.
{% endhint %}

<figure><img src="https://1211303336-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNP07jPPCyBlsAnUAqYNM%2Fuploads%2FqAQvIS0ZZITXGLyVs1O8%2FFieldsRaven%20Dev%20%C2%B7%20FieldsRaven%20%5BDEV%5D%20%C2%B7%20Shopify%202023-03-13%2008-53-22.png?alt=media&#x26;token=21e04a4c-0484-4dec-abfc-15b67d2ced2e" alt=""><figcaption><p>Create a raven, make sure to match the properties in the screenshot</p></figcaption></figure>

<figure><img src="https://1211303336-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNP07jPPCyBlsAnUAqYNM%2Fuploads%2FZ1PvddHdc12G6kN22ZeG%2FFieldsRaven%20Dev%20%C2%B7%20FieldsRaven%20%5BDEV%5D%20%C2%B7%20Shopify%202023-03-13%2008-55-27.png?alt=media&#x26;token=18a74988-56d7-48ba-9bdd-0ebd7ded94a4" alt=""><figcaption><p>Copy raven ID</p></figcaption></figure>

### Theme customizer settings

<figure><img src="https://1211303336-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNP07jPPCyBlsAnUAqYNM%2Fuploads%2FDXdWF0j7F85N9FzU9hD7%2FFieldsRaven%20Dev%20%C2%B7%20Customize%20FieldsRaven%20%5BDev%5D%20%C2%B7%20Shopify%202023-03-11%2009-18-19.png?alt=media&#x26;token=b2fd6988-3082-4fb6-b9b8-77d4faa2d57f" alt=""><figcaption><p>Make sure that the Storefront Kit is enabled and AlpineJS in included</p></figcaption></figure>

<figure><img src="https://1211303336-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNP07jPPCyBlsAnUAqYNM%2Fuploads%2FKHlm7ss0hCn7W8DiCawP%2FFieldsRaven%20Dev%20%C2%B7%20Customize%20FieldsRaven%20%5BDev%5D%20%C2%B7%20Shopify%202023-03-13%2008-56-50.png?alt=media&#x26;token=cfe82fe0-a62a-49a7-8a96-0aad6f0415fd" alt=""><figcaption><p>1) Go to App Embeds in theme customizer 2) Enable Birthday Popup 3) Paste raven ID from the previous step</p></figcaption></figure>

<figure><img src="https://1211303336-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNP07jPPCyBlsAnUAqYNM%2Fuploads%2F6JBxBO78JQLuyN41EeXU%2FFieldsRaven%20Dev%20%C2%B7%20Customize%20FieldsRaven%20%5BDev%5D%20%C2%B7%20Shopify%202023-03-13%2009-01-07.png?alt=media&#x26;token=54b473d3-6b54-44a6-bcb9-2f37abb7b11c" alt=""><figcaption><p>Adjust app embed settings</p></figcaption></figure>

<figure><img src="https://1211303336-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNP07jPPCyBlsAnUAqYNM%2Fuploads%2FcoiodlSIvdYnNSdmoE7N%2FFieldsRaven%20Dev%20%C2%B7%20Customize%20FieldsRaven%20%5BDev%5D%20%C2%B7%20Shopify%202023-03-13%2009-04-53.png?alt=media&#x26;token=b6162f3f-1834-458e-bc33-ff970c86a92f" alt=""><figcaption><p>Save your changes!</p></figcaption></figure>

### Storefront

<figure><img src="https://1211303336-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNP07jPPCyBlsAnUAqYNM%2Fuploads%2F8VvmTWNKiBa3FX2iuvvr%2FFieldsRaven%20Dev%202023-03-13%2009-03-10.png?alt=media&#x26;token=c7ee8e5f-87d3-4e10-a8ad-c895c5eb699d" alt=""><figcaption><p>Birthday popup trigger on the storefront</p></figcaption></figure>

<figure><img src="https://1211303336-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNP07jPPCyBlsAnUAqYNM%2Fuploads%2Fgkq1jLjKV7IixteYjZEg%2FFieldsRaven%20Dev%202023-03-13%2009-10-12.png?alt=media&#x26;token=c3dca8df-6f55-4858-86a5-4c4ae07a6bbb" alt=""><figcaption><p>Customer logged-out state</p></figcaption></figure>

<figure><img src="https://1211303336-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNP07jPPCyBlsAnUAqYNM%2Fuploads%2FB8bMs82HPwfNCzMXnwzs%2FAccount%20%E2%80%93%20FieldsRaven%20Dev%202023-03-13%2009-11-13.png?alt=media&#x26;token=f420dd26-0412-4f0a-bc10-0bbfbf83867f" alt=""><figcaption><p>Customer logged-in, before adding a birthday state</p></figcaption></figure>

<figure><img src="https://1211303336-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNP07jPPCyBlsAnUAqYNM%2Fuploads%2FgjAvyDskEskV5j2YNJR3%2FAccount%20%E2%80%93%20FieldsRaven%20Dev%202023-03-13%2009-12-50.png?alt=media&#x26;token=3831662c-f336-4eb6-b29a-be4dada69c8e" alt=""><figcaption><p>After customer submits their birthday</p></figcaption></figure>

<figure><img src="https://1211303336-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNP07jPPCyBlsAnUAqYNM%2Fuploads%2F3nuUSbP5uQQRK4Oyynyz%2FFieldsRaven%20Dev%202023-03-13%2009-13-56.png?alt=media&#x26;token=909e6f84-8dc2-43b6-a4ad-c749ef8d33d4" alt=""><figcaption><p>Birthday message</p></figcaption></figure>