# Web Widget

### Channel Integration

{% embed url="<https://drive.google.com/file/d/1XqNsn4Lutalq5aWkcdnGNOztbx6bt7-u/view?usp=sharing>" %}

### How to create a Web Widget?

**Step 1:** From left sidebar, click **Channels**, From Web Widget channel click the Add New button to create a new Web Widget

<figure><img src="https://3400071099-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FypCKq44Psaly6khgrY7x%2Fuploads%2FGR11O18cPVbAblmHKZFB%2Fimage.png?alt=media&#x26;token=b2ea25fa-5150-47a2-bfbf-286e4d7992c0" alt=""><figcaption></figcaption></figure>

**Step 2:** Input your Web Widget name and click CREATE.

* This Web Widget name represents the internal label for your Web Widget.

<figure><img src="https://3400071099-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FypCKq44Psaly6khgrY7x%2Fuploads%2FoFzPjDxFD8j6G8x09wWR%2Fimage.png?alt=media&#x26;token=bb4b389c-73ba-460e-afa2-5e43d12cac40" alt=""><figcaption></figcaption></figure>

**Step 3:** A “**Setup Needed**” label will appear next to the Web Widget name, click on the edit icon to complete the Web Widget setup.

<figure><img src="https://3400071099-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FypCKq44Psaly6khgrY7x%2Fuploads%2F0kV5ySQVHyHa4gmykIrq%2Fimage.png?alt=media&#x26;token=0c53e14c-9921-4fa1-99c1-71b6d69a0f4d" alt=""><figcaption></figcaption></figure>

**Step 4:** After the Web Widget Customization menu popped out, input your Widget window name, Widget chatbot name and a Welcome Message.

* **Widget window name** – This will display as the Web Widget's title.
* **Widget chatbot name** – Name for the chatbot interacting with users.
* **Welcome message** – The initial greeting users will see upon opening the Web Widget.
* Optionally, upload a Widget window logo and a profile image for the chatbot.

<figure><img src="https://3400071099-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FypCKq44Psaly6khgrY7x%2Fuploads%2FwdTFhWzuJ4juBW4OwtZd%2Fimage.png?alt=media&#x26;token=a9c49aaf-3f60-479a-b9a7-869635b1ba46" alt=""><figcaption></figcaption></figure>

**Step 5:** In the next section which is Offline Email, input your Email subject title, Email sender’s name, Sender’s email address and CTA button URL link.&#x20;

* **Offline Email** – This email message will be sent to customers using the provided email address when customers are offline.
* **Email subject title** – Main title for the email message.
* **Email sender’s name** – The displayed name of the email sender.
* **Sender’s email address** – Email address of the sender.
* **CTA button URL link** – Redirect link for the Call-to-Action (CTA) button in the email.

<figure><img src="https://3400071099-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FypCKq44Psaly6khgrY7x%2Fuploads%2FKa0NECWdMI1oFzqIY7XD%2Fimage.png?alt=media&#x26;token=b8486947-2cf9-4e64-9a51-08e8a751296a" alt=""><figcaption></figcaption></figure>

* Optionally, you can select the option to display your own Legal disclaimer and a Powered by iMBrace text.

<figure><img src="https://3400071099-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FypCKq44Psaly6khgrY7x%2Fuploads%2F0pVuR8vrvDR90WJmWS0L%2Fimage.png?alt=media&#x26;token=c1bb5cf3-396e-4356-94b2-5033eb331b05" alt=""><figcaption></figcaption></figure>

**Step 6:** Click on **DONE** and then click on **SAVE AND ACTIVATE** to activate the Web Widget.

<figure><img src="https://3400071099-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FypCKq44Psaly6khgrY7x%2Fuploads%2FIQJS6iJsYm57slxGg0hG%2Fimage.png?alt=media&#x26;token=4cd59f96-7412-4a75-bac7-868b5ec48fe1" alt=""><figcaption></figcaption></figure>

* Copy and Paste the Installation Code on your website code to make the Web Widget appear on your website.

<figure><img src="https://3400071099-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FypCKq44Psaly6khgrY7x%2Fuploads%2FlxBPFiF5LlZFQJOMnQxF%2Fimage.png?alt=media&#x26;token=50ce99d3-7c80-40fd-b65b-adf475574745" alt=""><figcaption></figcaption></figure>
