# Customization

## Third-Party login

```javascript
window.chatWidgetApi.thirdDIDLogin(address, thirdSignFunc, callBack)
```

| Method Name                         | Description         | Parameters                                                                                                                                                                                                                 | Return Values |
| ----------------------------------- | ------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------- |
| window\.chatWidgetApi.thirdDIDLogin | Inject login status | <p><code>address</code>: user wallet address;</p><p><code>thirdSignFunc</code>: Third party signer, eg.  <code>thirdSignFunc({ message})</code>;</p><p><code>callback</code>: callback function after successful login</p> | N/A           |

1. First, set `useThirdLogin` on the widget component: `<chat-component useThirdLogin={true} />`.
2. Call this API and provide the necessary parameters after the component has mounted, such as using *useEffect*, *ComponentDidMount* in *React*, or mounted in *Vue*. The `address` parameter represents the wallet address of the logged-in user (required), and `thirdSignFunc` is the signing function (required). When the API internally calls the `thirdSignFunc` signing function, it will pass the parameter `message`. `thirdSignFunc` should use this message to trigger wallet signing and return the result of the signature. The `thirdDIDLogin` API will wait for `thirdSignFunc` to complete and return, and then proceed with the login logic. Pseudocode example:

```javascript
thirdDIDLogin(address, thirdSignFunc, callback) {
    // Use address to call the the API and retrieve the corresponding DID.
    const sign = await thirdSignFunc({message});
    // Call didLogin(sign, ...otherParams) to perform the login.
    // Upon successful login, call callback();
}
```

3. The `callback` parameter is optional and can be used as needed. It will be invoked regardless of whether the login is successful or not. For a successful login, call callback(true), and for a failed login, call callback(false).

## Visibility

```javascript
window.chatWidgetApi.showWidget(isShow)
```

<table><thead><tr><th>Method Name</th><th>Description</th><th width="223">Parameters</th><th>Return Values</th></tr></thead><tbody><tr><td>window.chatWidgetApi.showWidget</td><td>Control Widget Visibility</td><td><code>isShow</code> (required): Specifies whether the widget should be displayed. [Type]: Boolean</td><td>N/A</td></tr></tbody></table>


---

# 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://sending-network.gitbook.io/sending.network/sdk-documentation/website-chat-widget-sdk/customization.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.
