# Auto Insurance Marketplace

This document describes how to integrate the Auto Insurance Widget into your web application. The widget allows users to get auto insurance ads seamlessly.

## Standard Embed Implementation

Engine's embed code can be placed in any order within your page, but for optimal user experience we recommend placing the `script` tag within the same div where the content is being rendered.

**Basic Embed Syntax**

{% hint style="info" icon="triangle-exclamation" %}
**PLEASE NOTE**: Your Engine representative will provide you with your specific code snippet. Do not try to reproduce from the sample snippet outlined below.
{% endhint %}

```html
<script
  async
src="https://www.moneylion.com/network/{channel}/{zone}/web-component/{component-name}/index.js"
  data-embed-type="auto-mount"
></script>
```

This is a representative example of what our embed code looks like, and contains placeholders as defined below. Placeholders and will be replaced with precise values in the embed code provided to you.

**Embed Components**

* **Channel:** placeholder that will be replaced with precise values in the embed code provided to you.
* **Zone:** placeholder that will be replaced with precise values in the embed code provided to you.
* **Component Name:** corresponds to the specific product or Engine experience type that's being rendered.
* **data-embed-type:** enables Engine's auto-mount functionality; without this attribute, the component will not render.
  * **Acceptable Value:** "auto-mount"

**Customization & Auto Sizing**

The web component loads iFrame and will automatically fill the container. Embeds are rendered wherever you include our HTML tag on your page and will responsively scale to fill the space available to it.

## Auto Insurance Specific Syntax

### Component Name

* **auto-insurance-listing:** marketplace widget that drops a geo-aware, scrollable list of auto insurance offers into your page (e.g., blog or product flow) with Engine handling carrier connectivity, geo/state eligibility, and monetization behind the scenes.

### HTML Attributes

**data-prefetch:** Enable prefetching and pre-filling of offers

* **Acceptable Values**: true, false

**data-query:** Defines fields to prefill in the embed experience

* **Acceptable Values:** Text Field

## Auto Insurance Embed Demo

<figure><img src="/files/N8vHYiCUEmAZPSorJF0B" alt=""><figcaption></figcaption></figure>

## **Client Tags & Pre-populating Customer Data**

Engine's Auto Insurance Marketplace embed supports appending client tags for channel partner reporting. This marketplace works slightly differently than other Engine embeds when it comes to pre-population of customer data. This is because Auto Insurance has its own prefill schema layered on top of our embeds.

Including these tags is completely optional, but enables functionality that has **significant downstream benefits**. From an implementation perspective for each use case:

* Pre-populating Customer Data for certain non-PII fields
  * `data-query`: Decreases friction in the user experience and increases application submission rates
* Channel Partner Reporting
  * `data-tags` : enables more robust reporting

### How to Implement Tags & Customer Data Prefill

To **add client tags** in an embed, use the following syntax in the `data-tags` attribute within the embed script:

```
tag.key_1=value_1&tag.key_2=value_2
```

To **pre-populate fields** in an embed, use the following syntax in the `data-query` attribute within the embed script:

```
app.key_1=value_1&app.key_2=value_2
```

#### <mark style="color:$primary;">Sample Implementation</mark>

```html
"<script 
      async src=\"https://www.moneylion.dev/network/{channel}/{zone}/web-component/auto-insurnace-listing/index.js\" 
      data-tags=\"tag.clientId=c1&tag.source=email\"
      data-query=\"app.providedCreditRating=fair&app.zipcode=90210\"
      data-embed-type=\"auto-mount\" 
></script>"
```

<mark style="color:$primary;">In the above example, "clientId" and "source" are available as tags for reporting purposes and "providedCreditRating" and "zipcode" will be prepopulated in the embed user interface.</mark>

### Supported Client Tag Keys

These are the keys that are currently fully supported across all Engine embeds. Please note that the keys below are case-sensitive:

* agentId
* campaignId
* clientId
* deviceid
* medium
* sourceId
* subid
* subid1
* subid2
* subid3
* target
* trafficsource
* userid

If a different key is needed, please reach out to your Partner Manager - we *may* be able to accommodate, but adding nonstandard keys will increase the time it takes Engine to report Client Tag values back to you and is therefore not recommended.

### Supported Tag Keys for Prefill <a href="#integration-with-html" id="integration-with-html"></a>

Engine's Auto Insurance marketplace accepts the following parameters and values for customer data pre-population purposes:

| Field                                                                            | Parameter                   | Acceptable Values                                                                                                                                                                                        |
| -------------------------------------------------------------------------------- | --------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Zip Code                                                                         | `app.providedCreditRating`  | <ul><li>excellent</li><li>good</li><li>fair</li><li>poor</li><li>limited</li><li>unknown</li></ul>                                                                                                       |
| Credit Rating                                                                    | `app.zipcode`               | US 5-digit numeric ZIP code, e.g. `10001`. No leading/trailing whitespace                                                                                                                                |
| Age Range                                                                        | `app.ageRange`              | <ul><li>AGE\_RANGE\_18\_20</li><li>AGE\_RANGE\_21\_24</li><li>AGE\_RANGE\_25\_34</li><li>AGE\_RANGE\_35\_44</li><li>AGE\_RANGE\_45\_54</li><li>AGE\_RANGE\_55\_64</li><li>AGE\_RANGE\_65\_PLUS</li></ul> |
| **Only insert these values if they are applicable, and set the query to `true`** |                             |                                                                                                                                                                                                          |
| Military Status                                                                  | `app.is_military`           | true                                                                                                                                                                                                     |
| Multiple Vehicle Status                                                          | `app.has_multiple_vehicles` | true                                                                                                                                                                                                     |
| Home Owner Status                                                                | `app.is_home_owner`         | true                                                                                                                                                                                                     |
| Insured Status                                                                   | `app.is_currently_insured`  | true                                                                                                                                                                                                     |

## Embed Best Practices & Troubleshooting <a href="#integration-with-html" id="integration-with-html"></a>

**Component Not Showing**

1. Check the required attribute:
   1. Make sure data-embed-type="auto-mount" is present
2. Check browser console:
   1. Open developer tools and look for error messages

**Loading Too Slowly**

1. Make sure async attribute is present on the \<script> tag
   1. This prevents block page load


---

# Agent Instructions: 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:

```
GET https://even-financial.gitbook.io/developer-center/embeddable-integrations/widgets-and-embeds/auto-insurance-marketplace.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
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.