# Chat widgets and buttons

It's easy to create a chat widget or button that will make it easy for clients and customers to start a conversation over WhatsApp from your website.

This can be done in two ways - from within your Converso account, and/or from your WhatsApp Business Account (WABA).

From Converso:

Go to your workspace, and click on Channels > WhatsApp > Embed. If you have a WhatsApp channel connected you will see the option to choose either a chat button or a chat widget, and a code generator that creates a simple code snippet that can be installed on your website.

The chat button, once clicked will open the contact's WhatsApp web app (if on a desktop) or their WhatsApp device app (if on a mobile) and enable them to start a conversation to your number with a predefined message from them.

This message could be used to identify the page from which they are chatting eg "Please send me more information on your conveyancing services".

The chat widget, once clicked, will open up a window that has a message and a click to chat via WhatsApp button, with similar experience to the above. (In the future other channels such as webchat and SMS will be added to give your contact choice of connecting over their favourite channel).  

It's also possible to change the style, size, colouring and positioning of the buttons, as well as the business and contact messages for both button and widget.

<figure><img src="https://lh7-us.googleusercontent.com/LG6pwkYRuyI-Z13xj6Oc6ToJw0D54mV4YF1FzMo0VWwimsTAVM7vtDzq88JtUyVZgTZGPAGrjUcZxC1rCl3De0o_jpPbhVs7_ceva2TMQElhMui_ab2m0uDQxJyyIevxeWoaBy62ng8fc-Vn1OTyaNU" alt="" width="375"><figcaption></figcaption></figure>

From your WABA:

It's also possible to generate a QR code and chat button from your WhatsApp Business Account, accessed via your Meta Business Manager account.

Just follow these instructions:

1\. At the Home page, click on WhatsApp Manager

<figure><img src="https://lh7-us.googleusercontent.com/pGW7hOerzEgW4Yp5lfBzhVIjL5aw4UamwXrXkg44Qvt2q5wZpHnVXJs7ec-Zsc6SBCNv5dKyNMBIT7QimF4sicevxcsrFtvK486zq5eRjYVqDaI3Caz4JlGecrgLDjwCq9lU1vwM3sxvZqTefd_vxyY" alt="" width="375"><figcaption></figcaption></figure>

2\. Then click on Phone numbers under Account tools on left hand menu

<figure><img src="https://lh7-us.googleusercontent.com/bftlKtpFnccgCAk5g0ZOdFffO_vsI63FuwEpnvcrlC5pi9fkT8BIXCPFr6rvm4hW2ZlKqFV_CrfKhGy_dl5AgE9-QLmuZhogHO0zAHKB-X-IG-9Zf4YzOlR9ZDs6p25kQ8Y5wJuAmHr9WnA1yjHopA0" alt="" width="375"><figcaption></figcaption></figure>

3\. Make sure you have selected the right account via the dropdown in the top right corner, and then click on the Settings cog:

<figure><img src="https://lh7-us.googleusercontent.com/HOADLVPXKI6-vGQKFbufS2umY8Y78JZgh6AbOS9E_ny-YVwEj59SuWrsF7GEQCv2VHoi9QCrUuK8D4Tyh53IIORtYclIYrSj-16SVFuZ62PEjn1wyKeLrgbydXruB6qTJcu5pJ-w_zyJCh0espbzPV4" alt="" width="375"><figcaption></figcaption></figure>

4\. Now click on Message links

<figure><img src="https://lh7-us.googleusercontent.com/VJ8FoTtLVyHhtvN_5O2S4dNsikJG6LcqERtXXGyS8dYUXe0L2BEeFCvuD5uHJzPWoCOR0VdNydozfNRBiBdiPzz3YVl9r1rV7H-CZU5dXf1-yQ4dD0850bab23BWgEa_al3iZJ_1UFWAv5RZVloRL6I" alt="" width="375"><figcaption></figcaption></figure>

5\. Here you can create your link and QR code:

<figure><img src="https://lh7-us.googleusercontent.com/IOUqtz-ve-1oRNsxEZuwwAM1j3RuOP9kE-uQ40dihOPfI4sUjSCR62KaOxA48QoUyNHPR3Q3VZLbSPwPjr_9aBVYJz4e4HVf_ckUpkwh73gDPofR7HGX7foXLCnlU_pGDypN-GnehdyjMJvuDIyjXgs" alt="" width="563"><figcaption></figcaption></figure>

These can then be embedded on your website.&#x20;

Alternatively, you can create your own by following the instructions[ here.](https://faq.whatsapp.com/5913398998672934) This link also contains branded Chat on WhatsApp buttons that you can add to your site, as shown below:

<figure><img src="https://lh7-us.googleusercontent.com/BHSLITV59VvNV_vkjsM3zZ4sw0bHvBBNi_ul_Nl3ub4Z0s0usBiVYJsQz5jlZEtypGq7R9e8DitF0ObeSMGdlLgTFddEt9TCp2o0cWy5mywUOmXikNU0UXsSkH8JvlNxewcsbPPUTfLDU_t7hx0bLgM" alt="" width="188"><figcaption></figcaption></figure>

It's useful to note that the initial message from the contact can be generated, pre-filled in their message box. This can be useful in order to identify where on the site the customer clicked the button and initiated a chat conversation.&#x20;

<br>


---

# 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://converso.gitbook.io/product-documentation/channels/whatsapp/chat-widgets-and-buttons.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.