# How to Integrate

### <mark style="color:blue;">Prerequisites:</mark>

* Have already created a "Website" chat platform on the [MaiAgent Platform](https://admin.maiagent.ai/)
* Have already created a "Provider" and "LINE Login" channel on the [LINE Developers](https://developers.line.biz/zh-hant/) console platform

<figure><img src="https://3415477754-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNBTi475lqozGpB7xObpE%2Fuploads%2Fgit-blob-9394e2ab5bda81251ed624ff03bf4581adfc8750%2Fimage%20(4).png?alt=media" alt=""><figcaption></figcaption></figure>

<figure><img src="https://3415477754-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNBTi475lqozGpB7xObpE%2Fuploads%2Fgit-blob-3a561089a06f504505da12ec371b943e79e2a24d%2Fimage%20(2)%20(1)%20(1).png?alt=media" alt=""><figcaption></figcaption></figure>

### <mark style="color:blue;">Setup Steps:</mark>

1. On the [LINE Developers](https://developers.line.biz/zh-hant/) LINE Developers console platform, name your **LIFF app** in the "**LIFF app name**" field on the LIFF detail page.

**2. Size** field - select **Full**

**3. Endpoint URL** field

Copy the "**Public Access URL**" from the chat platform to the "**Endpoint URL**" field, and add "**/line-liff/**"

<figure><img src="https://3415477754-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNBTi475lqozGpB7xObpE%2Fuploads%2Fgit-blob-3ac598e372a6a9d6af439b9e628fb79a426e2331%2Fimage%20(5).png?alt=media" alt=""><figcaption></figcaption></figure>

<figure><img src="https://3415477754-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNBTi475lqozGpB7xObpE%2Fuploads%2Fgit-blob-abc97c27da0a0241318517170625c3713d0ea051%2Fimage%20(6).png?alt=media" alt=""><figcaption></figcaption></figure>

4. For the **Scopes** field, select **profile**
5. For the **Add friend option** field, select **On (normal)**
6. Click the "Save" button at the bottom of the page, then return to the LIFF detail page. You will see that the system has generated a **LIFF ID**. Enter this ID after ".../line-liff/" in the "Endpoint URL" field and click "**Update**"
7. Finally, go to the top and set this **LIFF** to <mark style="color:blue;">**Published**</mark> to complete the setup and go live.

<figure><img src="https://3415477754-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNBTi475lqozGpB7xObpE%2Fuploads%2Fgit-blob-f3f2b36fbf9047e6fe13237a1e5ae7b01fc53eda%2Fimage%20(7).png?alt=media" alt=""><figcaption></figcaption></figure>

### <mark style="color:blue;">Start Using!</mark>

1. The "**LIFF URL**" is the link URL for this **LIFF**.
2. When users click the "**LIFF URL**" link (rich menu) in LINE chat rooms, they will be directed to the Web Chat page to interact with the AI assistant, and the MaiAgent backend will receive user and conversation information.

<figure><img src="https://3415477754-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNBTi475lqozGpB7xObpE%2Fuploads%2Fgit-blob-ea3a8b486e612e0735802f67f158955eb5ff9408%2Fimage%20(8).png?alt=media" alt="" width="188"><figcaption></figcaption></figure>

<figure><img src="https://3415477754-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FNBTi475lqozGpB7xObpE%2Fuploads%2Fgit-blob-6abe39cd45ce7f907a720c43bac23b24365d18a8%2Fimage%20(9).png?alt=media" alt="" width="188"><figcaption></figcaption></figure>

### <mark style="color:blue;">Applicable Scenarios</mark>

Rich menu links in official accounts, online store integration, membership system integration, event registration systems, customer service systems