# Botón de mensajería en el sitio web

1. **Iniciar sesión en el Centro de Contacto**

* Inicie sesión en su cuenta Bitrix24
* Vaya a la sección «Centro de Contacto

2. **Seleccionar un widget**

* En el Centro de contacto, haga clic en la ficha «Widget de sitio web».
* Seleccione «Añadir un nuevo widget».

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

3. **Crear un nuevo widget**

* Pon un nombre a tu widget.
* Marca la casilla de la opción «WhatsApp».

  <figure><img src="/files/UEHN9LlK6eN4mZTovjRn" alt=""><figcaption></figcaption></figure>
* Personaliza el resto de la configuración del widget a tu gusto.

4. **Guardar el widget**

* Haz clic en el botón «Guardar».

* Bitrix24 le dará un código para pegar en su sitio.

  <figure><img src="/files/0iJOexY1as7l6xkbW2Ld" alt=""><figcaption></figcaption></figure>

* Si no va a insertar el código usted mismo, facilite este código a sus programadores para que lo integren en el sitio.

5. **Cambia el color del botón de WhatsApp (naranja por defecto):**

* Si quieres cambiar el color del botón de WhatsApp a verde, utiliza el siguiente código y añádelo a tu página web:

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

6. **Cambiar el color del icono de Telegram:**&#x20;

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


---

# 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://whatcrm.gitbook.io/whatcrm-docs/portugues/produtos/whatsapp/bitrix24/boton-de-mensajeria-en-el-sitio-web.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.