> For the complete documentation index, see [llms.txt](https://docs.saas.haut.ai/haut.ai/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.saas.haut.ai/haut.ai/haut.ai-features/consumer-apps/make-real-time-data-connection-with-external-platforms-via-webhooks/example-of-haut.ai-saas-integration-with-klaviyo-via-zapier-with-the-recommendation-system-2.0.md).
# Example of Haut.AI SaaS integration with Klaviyo via Zapier (with the recommendation system 2.0)
This page describes how to pass data from Haut.AI to Klaviyo via Zapier, including results from Recommendation System 2.0.
{% hint style="success" %}
Integration with external platforms via webhooks is available for **all** plans.
{% endhint %}
{% hint style="warning" %}
To use webhooks in Zapier, you need a "Professional" plan in Zapier or higher.
You can check Zapier plans and pricing here: .
{% endhint %}
{% hint style="info" %}
Check the no-code integration of the Consumer App with Klaviyo that allows to capture e-mails in the Consumer App and send them to the Klaviyo.
{% endhint %}
## Steps of Integration
To integrate Haut.AI SaaS with Klaviyo via Zapier, you need to complete a few steps:
1. [Set up and configure webhook in Zapier.](#set-up-and-configure-webhook-in-zapier)
2. [Test configured webhook.](#test-configured-webhook)
3. [Parse data passed via webhook.](#parse-data-passed-via-webhooks)
4. [Structure data.](#structure-data)
5. [Send data to Klaviyo.](#sending-results-to-klaviyo)
***
## Set up and configure webhook in Zapier
The first step is to receive data from SaaS to Zapier.
1. Login into your Zapier account.
2. Click on the "Create" button in the top-left corner.
3. Select "Zaps" in the dropdown.
4. You will see the blank canvas as shown below. Click on the "Trigger" area.
5. In the window that pops up, select "Webhooks by Zapier."
6. In the window on the right, click on the "Choose an event" dropdown and select "Catch Raw Hook."
7. Click "Continue" in the bottom right corner.
8. Click "Continue" again on the next step to skip it.
9. Copy the webhook URL by clicking on the "Copy" button.
10. Now go to your Haut.AI account,
11. Go to "Dataset" and open the dataset connected to your Consumer App. You can find this dataset by going to the Consumer App and clicking on ID of the Linked dataset.
12. Click "Settings" in the top menu of the Dataset.
13. Scroll down to the "Webhook (for developers)" section.
14. Paste the URL that you copied from Zapier to the URL field.
15. In the "Authorization method" field, select "Basic."
16. In the "Authorization key" and "Authorization value" fields, paste any value because Zapier does not require authorization.
17. In the "Request method" field, select "POST."
18. To add Survey answers to the webhook, select "Add survey answers to webhook." See [how to configure Survey questions in Step 1](/haut.ai/haut.ai-features/consumer-apps/make-real-time-data-connection-with-external-platforms-via-webhooks.md).
19. Select "Merge webhooks" to receive one webhooks for all attached applications.
20. Click "Save changes."
***
## Test configured webhook
The next step is to check that data received from SaaS is visible in Zapier.
1. Open your Consumer App.
2. Conduct skin analysis.
3. Go back to your Zapier account.
4. Click "Test trigger."
5. If everything is set correctly, you can see webhook results.
6. If you click on the record, you will see skin something similar to the screen below.
7. Select the record and click "Continue with selected record."
***
## Parse data passed via webhooks
The key important step is to parse received data in order to prepare it for connection with your 3rd party platform (e.g. Klaviyo)
1. For the action step, select "Code by Zapier"
2. In the window on the right, select "Run Python" and click "Continue."
3. Now, you need to feel the "Input Data."
4. Paste `raw_data` into the left field, as shown on the screen below
5. Click on the "+" button and select "Raw Body"
***
## Structure data
1. Copy and paste the following code in to the "Code" field and click "Continue".
```python
import json
# Load the raw data from input
raw_data = input_data.get('raw_data', '{}')
data = json.loads(raw_data)
# Extract survey questions and answers
survey_questions = [answer['question_text'] for answer in data.get('survey_answers', [])]
survey_answers = [', '.join(answer['answer_values']) for answer in data.get('survey_answers', [])]
subject_id = data.get('subject_id', '')
# Create a dictionary mapping questions to answers
questions_answers_mapping = dict(zip(survey_questions, survey_answers))
# Get all face area results
face_area_results = [algorithm for algorithm in data.get('area_results', []) if algorithm.get('area_name') == 'face']
# For Eye Condition - additional metrics are stored as submetrics
eye_area_condition = [result for result in face_area_results if result.get('tech_name') == 'eye_area_condition']
if len(eye_area_condition) > 0:
eye_area_condition = eye_area_condition[0]['sub_metrics']
eye_area_condition = [metric for metric in eye_area_condition if 'score' in metric.get('tech_name')]
# Add Eye Condition additional metrics to all metrics
face_area_results += eye_area_condition
# Perform metrics mapping - take only public name and value
metrics_mapping = {
area['name']: area['value']
for area in face_area_results
}
# Extract product recommendations (category as key, list of names as values)
recommendations = {}
recommendation_system_result = data.get('recommendation_system_result', {})
# Handle recommended products
for category, products in recommendation_system_result.get('recommended_products', {}).items():
recommendations[category] = [product.get('name') for product in products]
# Handle featured products
for category, products in recommendation_system_result.get('featured_products', {}).items():
if category in recommendations:
recommendations[category].extend(product.get('name') for product in products)
else:
recommendations[category] = [product.get('name') for product in products]
# Get event name
event = data.get('event')
# Prepare final output
output = {
'Questions_answers': questions_answers_mapping,
'Metrics': metrics_mapping,
'Subject_id': subject_id,
'Event': event,
'Recommendations': recommendations
}
```
2. Click on the "Test step" button.
3. Check the test results and move to the next step.
## Handling errors
In rare cases, a photo may take longer than usual to process (more than 60 seconds). In such cases, if you choose the ‘merge webhooks’ option, you will get two webhooks:
* The first webhook will include the results of applications that were completed within 60 seconds. This webhook will contain the parameter `"event": "photo_calculated_by_all_apps_timeout"`
* The second will include all results from all applications. This webhook will contain the parameter This webhook will contain the parameter `"event": "photo_calculated_by_all_apps"`
### Step-by-step guide for handling errors
* Click "Add step"
* Select "Filter by Zapier"
* Select "Event" as a field
* Select "(Text) Does not contain"
* Paste `timeout` into the text field
* Now, your Zap will send data to Klaviyo only if the data is complete
## Format the data
{% hint style="info" %}
Skip this step if you do not collect users phone number
{% endhint %}
1. Click on the "+" button on the canvas and select "Formatter" by Zapier
2. Click on the "Action event" dropdown, select "Numbers," and click "Continue."
3. In the next step, click the "+" icon and select the data item with a phone number from the list. For the format, select "E164" and choose the country code. Click "Continue."
***
## Send results to Klaviyo
1. Click on the "+" button on the canvas.
2. Type "Klaviyo" in the search field and select it from the search results.
3. Click on the "Action event" dropdown and select "Create Profile."
4. Click on the "Account" and connect your Klaviyo account. Once you connect the account, click "Continue."
5. Now, you need to map all the structured data from the previous step with Klaviyo fields.
1. Add custom properties to map the skin analysis results
2. You can either put all the products recommended to the user in one field, or you can put them in several separate fields for each step. In the example, we have shown how to combine all recommended products into one field.\
6. Once you finish mapping, click "Continue" and then click "Test step." Check if new record appears in Klaviyo.
7. If everything works correctly, click on the "Publish" button.
***
{% hint style="warning" %}
Not a Haut.AI client yet?
{% endhint %}
Book a demoPlatform overview on haut.ai
---
# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.
## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.
Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:
```
GET https://docs.saas.haut.ai/haut.ai/haut.ai-features/consumer-apps/make-real-time-data-connection-with-external-platforms-via-webhooks/example-of-haut.ai-saas-integration-with-klaviyo-via-zapier-with-the-recommendation-system-2.0.md?ask=&goal=
```
`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
