# Custom widget

**Note: Some features only work with the upgraded plan.**

### **Step 1: Enable the App**

* Turn on the app using the **Enable** button.
* You can change the **title** of the protection plan—or keep the default title provided.
* Add **descriptions** for both scenarios:
  * When the insurance option is **selected**.
  * When the insurance option is **deselected**.

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

### **Step 2: Update the Insurance Product**

* Change the **image** of the insurance product if needed.
* Customize the **title** and **description** based on your preferences and requirements.

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

### **Step 3: Enable Auto Add to Cart**

* Activate the **Auto Add to Cart** feature.\
  This allows the insurance protection to be automatically added to the customer’s cart without requiring manual selection.

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

### **Step 4: Choose Fulfillment Type**

* Decide how the protection plan should be fulfilled after the order is placed.\
  You can choose between:
  * **Immediately after purchase (shipping protection will fulfill automatically after purchase)**
  * **Manual fulfillment (Customer have to manually fulfill shipping protection)**

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

### **Step 5: Update Product Image**

* You can change the **product image** displayed to customers as per your preference.

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

### **Step 6: Select Insurance Widget Template**

* Choose your preferred **widget template** from the available design options.

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

### **Step 7: Configure Input and Reason Options**

* Decide whether the **image upload field** is required or optional.
* Allow customers to provide a reason using one of two input types:
  * **Textarea** (for free-text responses)
  * **Dropdown** (for predefined reasons)

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

### **Step 8: Manage Default Reasons (for Dropdown Option)**

* If you select the **Dropdown** option, customers will see five default reasons to choose from.
* These reasons can be customized based on your needs.

**Default Reasons:**

1. The customer’s package was delivered but got stolen.
2. The package did not arrive within the expected timeframe.
3. The package was delivered to the wrong address.
4. The package was lost.
5. The package was damaged during shipping.

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

### **Step 9: Customize Widget Appearance**

* Adjust the **Widget Space Settings**, such as
  * Icon size
  * Inner spacing
  * Outer spacing
* Modify **Font Settings**, including:
  * Heading font size
  * Subheading font size
* Customize **Container Settings**, such as
  * Border radius
  * Border size
* Select **colors** that match your store’s theme.\
  These customization options allow you to align the widget’s look and feel with your store’s branding.

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


---

# 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://docs.centousapps.com/insureful/app-set-up/custom-widget.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.