# Widget button for your website

1. Go to the Contact Center and click on the Website widget tile\ <br>

   <figure><img src="https://1360887499-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fb61nIKR97C88XZEX04cC%2Fuploads%2F8iN8vT3qXc1IIfwU0YpE%2Fimage.png?alt=media&#x26;token=bc8963d7-8165-4ac3-b08e-497f732b7fbc" alt=""><figcaption></figcaption></figure>

2. Select  Add new widget\ <br>

   <figure><img src="https://1360887499-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fb61nIKR97C88XZEX04cC%2Fuploads%2FCSSeb2QNk7Mcmu4kfj5f%2Fimage.png?alt=media&#x26;token=27dd8ef4-1363-41d1-83dc-3035e98be9fd" alt=""><figcaption></figcaption></figure>

3. Set a name for the widget and put a check box on WhatsApp \*select the line to which your phone number is connected\ <br>

   <figure><img src="https://1360887499-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fb61nIKR97C88XZEX04cC%2Fuploads%2F60jUcf9T51jAUg51A2A0%2Fimage.png?alt=media&#x26;token=30b945a3-419c-4749-9e29-a5e34d6a6a8b" alt=""><figcaption></figcaption></figure>

4. The rest of the widget parameters can be customized at your preference, click  Save.

5. Bitrix24 will give you a code to paste into your site, if you're not the one doing it, pass it on to your programmers \ <br>

   <figure><img src="https://1360887499-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fb61nIKR97C88XZEX04cC%2Fuploads%2FrALmvMz9rs8XGarpCHD6%2Fimage.png?alt=media&#x26;token=115906a4-5ea1-4b6e-aad1-c84fb708fb9f" alt=""><figcaption></figcaption></figure>

<br>

{% hint style="info" %}
By default the WhatsApp button is orange, if you want to change the color to green use the code below for your website
{% endhint %}

WhatsApp&#x20;

```
    <style>
    [class*=ui-icon-service-bitrix_whatcrm_net]  > i {
      background-image: url(https://api.whatcrm.net/img/whatsapp.svg);
}
</style>

```