# Wix Smart Chat: De chat ontwerpen en aanpassen

Source: https://support.wix.com/nl/article/wix-smart-chat-de-chat-ontwerpen-en-aanpassen (updated 2026-04-08)
Related: Wix developer documentation, https://dev.wix.com/docs/llms.txt; Help Center index, https://support.wix.com/en/llms.txt

Met Wix Smart Chat kun je je merkstem en -stijl weergeven door je chat-interface te ontwerpen en aan te passen. Je kunt kleuren, tekst, indeling en meer rechtstreeks in je editor aanpassen, waardoor het gemakkelijk wordt voor bezoekers om te gebruiken.

Door dit gepersonaliseerde tintje kunnen ze zich meer verbonden voelen met je merk en is de kans groter dat ze hun aankoop voltooien. Door websitebezoekers aan te moedigen contact op te nemen, verhoog je de betrokkenheid en bied je betere dienst aan.

![2 screenshots naast elkaar met verschillende ontwerpopties voor Wix Smart Chat.](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/3eadcc04-813b-4e69-acf6-5bb047eced92/2026/01/22/8a72c39b-0543-48d8-b99d-e0dd5be161de/fb94d5a7-7dfc-4bf6-942b-81a0b58f906f.png)

---

## De chat-indeling aanpassen

Kies hoe je de chat op je website wilt weergeven. Kies waar op de pagina het wordt weergegeven en hoe nieuwe berichten voor bezoekers worden weergegeven.

### Om de indeling aan te passen:

**Wix Editor:**

1. [Ga naar je editor](https://manage.wix.com/account/site-selector/?actionUrl=https%3A%2F%2Fwww.wix.com%2Feditor% 2F%7BmetaSiteId%7D%3FeditorSessionId%3D%7Besi%7D%26).
2. Klik op de chat-widget.
3. Klik op **Instellingen**.
4. Klik op het **Indeling**-tabblad.
5. Kies wat je aan wilt passen:  
   * **Positie:** Bepaal of je wilt dat je chatbox linksonder of rechtsonder op je website verschijnt.  
   * **Breedte en hoogte:** Kies je chatbreedte en -hoogte. Je kunt de standaardinstellingen gebruiken of deze aanpassen met de schuifregelaar.

![Een screenshot van het Indeling-tabblad van de instellingen van de Wix Smart Chat-widget in de Wix Editor.](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/3eadcc04-813b-4e69-acf6-5bb047eced92/2026/03/10/bece571b-4d28-4ac1-b6f0-d28a406c55b2/f8803478-7d6d-4fcb-a19d-d2d0b44b28e3.png)

**Studio Editor:**

1. [Ga naar je editor](https://manage.wix.com/account/site-selector/?actionUrl=https%3A%2F%2Fwww.wix.com%2Feditor% 2F%7BmetaSiteId%7D%3FeditorSessionId%3D%7Besi%7D%26).
2. Klik op de chat-widget.
3. Klik op **Instellingen**.
4. Klik op het **Indeling**-tabblad.
5. Kies wat je aan wilt passen:  
   * **Positie:** Bepaal of je wilt dat je chatbox linksonder of rechtsonder op je website verschijnt.  
   * **Breedte en hoogte:** Kies je chatbreedte en -hoogte. Je kunt de standaardinstellingen gebruiken of deze aanpassen met de schuifregelaar.

> **Let op:** Standaard zijn de wijzigingen die je in dit paneel aanbrengt, van toepassing op alle breekpunten.

![Een screenshot van het Indeling-tabblad van de instellingen van de Wix Smart Chat-widget in de Studio Editor.](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/3eadcc04-813b-4e69-acf6-5bb047eced92/2026/03/10/3a1912aa-b129-42c2-98fc-9b93186d53c3/b1c6c86d-8afc-47f5-b2b3-4d06eb281c8e.png)

---

## De tekstinstellingen van de chat configureren

Voer de tekst in die je wilt weergeven wanneer de chat geminimaliseerd of offline is. Geef je bezoekers vooraf informatie, zoals de normale reactietijd.

### Om je tekstinstellingen te configureren:

**Wix Editor:**

1. [Ga naar je editor](https://manage.wix.com/account/site-selector/?actionUrl=https%3A%2F%2Fwww.wix.com%2Feditor% 2F%7BmetaSiteId%7D%3FeditorSessionId%3D%7Besi%7D%26).
2. Klik op de chat-widget.
3. Klik op **Instellingen**.
4. Klik op het **Tekst**-tabblad.
5. Kies welke modus je wilt aanpassen: **AI Chat-tekst** of **Handmatige chat-tekst**.
6. Kies wat je aan wilt passen:  
   * **Koptekst:** Voer de naam in die je in de koptekst wilt weergeven wanneer het chatvak open is.  
   * **Hulptekst invoeren:** Stel de standaardtekst in die bezoekers wordt gevraagd een bericht in te voeren (bijvoorbeeld: 'Typ je bericht...').  
   * **Wanneer chat online is:** Voer de tekst in die websitebezoekers zien wanneer je chatbox beschikbaar is om te chatten, maar geminimaliseerd is.  
   * **Wanneer chat offline is:** Voer de tekst in die websitebezoekers zien wanneer je chatbox niet beschikbaar en geminimaliseerd is.  
   **Let op:** Deze optie is alleen beschikbaar als je een geminimaliseerde chatindeling die tekst bevat op het **Ontwerp-** tabblad hebt geselecteerd.

![Een screenshot van het Tekst-tabblad van de instellingen van de Wix Smart Chat-widget in de Wix Editor.](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/3eadcc04-813b-4e69-acf6-5bb047eced92/2026/03/10/8b48cafa-94cd-45c9-b1dc-abf5bed89ba7/f8097624-6882-489f-a1e0-46c8ead89c8b.png)

**Studio Editor:**

1. [Ga naar je editor](https://manage.wix.com/account/site-selector/?actionUrl=https%3A%2F%2Fwww.wix.com%2Feditor% 2F%7BmetaSiteId%7D%3FeditorSessionId%3D%7Besi%7D%26).
2. Klik op de chat-widget.
3. Klik op **Instellingen**.
4. Klik op het **Tekst**-tabblad.
5. Kies welke modus je wilt aanpassen: **AI Chat-tekst** of **Handmatige chat-tekst**.
6. Kies wat je aan wilt passen:  
   * **Koptekst:** Voer de naam in die je in de koptekst wilt weergeven wanneer het chatvak open is.  
   * **Hulptekst invoeren:** Stel de standaardtekst in die bezoekers wordt gevraagd een bericht in te voeren (bijvoorbeeld: 'Typ je bericht...').  
   * **Wanneer chat online is:** Voer de tekst in die websitebezoekers zien wanneer je chatbox beschikbaar is om te chatten, maar geminimaliseerd is.  
   * **Wanneer chat offline is:** Voer de tekst in die websitebezoekers zien wanneer je chatbox niet beschikbaar en geminimaliseerd is.  
   **Let op:** Deze optie is alleen beschikbaar als je een geminimaliseerde chatindeling die tekst bevat op het **Ontwerp-** tabblad hebt geselecteerd.

![Een screenshot van het Tekst-tabblad van de instellingen van de Wix Smart Chat-widget in de Studio Editor.](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/3eadcc04-813b-4e69-acf6-5bb047eced92/2026/03/10/58d187b8-f371-4622-bb10-1a7113bdee3e/c63558d9-aac5-410c-b279-2249767295ca.png)

> **Let op:** Standaard zijn wijzigingen die je in dit paneel aanbrengt, van toepassing op desktop en tablet. Om het ontwerp op mobiel aan te passen, ga je naar het mobiele breekpunt. [Lees meer over breekpunten](https://support.wix.com/nl/article/studio-editor-ontwerpen-voor-meerdere-breekpunten).

---

## Je chat ontwerpen

Ontwerp elk onderdeel van de chat in je editor.

### Om je chat te ontwerpen:

**Wix Editor:**

1. [Ga naar je editor](https://manage.wix.com/account/site-selector/?actionUrl=https%3A%2F%2Fwww.wix.com%2Feditor% 2F%7BmetaSiteId%7D%3FeditorSessionId%3D%7Besi%7D%26).
2. Klik op de chat-widget.
3. Klik op **Instellingen**.
4. Klik op het **Ontwerp**-tabblad.
5. Kies wat je wilt ontwerpen:

**Koptekst**

Pas de koptekst van je chatbox aan:

* **Achtergrond-, lettertype- en knopkleuren:** Selecteer een kleur van het thema van je website of kies een aangepaste kleur.
* **Lettertype:** Kies een stijl en lettertype met behulp van de dropdowns en pas de grootte aan met de schuifregelaar.
* **AI-pictogram weergeven:** Klik op de schakelaar om het AI-pictogram uit de koptekst weer te geven of te verbergen.

**Achtergrond**

Kies hoe je wilt dat de achtergrond van je chatbox eruitziet:

* **Kleuren wijzigen:** Selecteer een kleur van het thema van je website of kies een aangepaste kleur.
* **Schaduw toepassen:** Klik op de schakelaar om schaduw weer te geven of te verbergen. Gebruik de schuifregelaars om de dekking, vervaging, spreiding en richting van de schaduw aan te passen.

**Berichten**

Kies of je berichten van bezoekers, AI-berichten of kaarten wilt ontwerpen, en hun elementen aanpassen:

* **Kleuren:** Selecteer een kleur van het thema van je website of kies een aangepaste kleur.
* **Lettertype:** Kies een stijl en lettertype met behulp van de dropdowns en pas de grootte aan met de schuifregelaar.
* **Schaduw toepassen:** Klik op de schakelaar om de schaduw weer te geven of te verbergen. Gebruik de schuifregelaars om de dekking, vervaging, spreiding en richting van de schaduw aan te passen.
* **Randen aanpassen:** Gebruik de schuifregelaars om de dekking, breedte en straal van de rand aan te passen.

**Invoerveld**

Pas aan hoe het tekstinvoerveld eruitziet voor je gebruikers wanneer ze de chat openen, het veld aanwijzen of erop focussen (klikken):

* **Randen aanpassen:** Gebruik de schuifregelaars om de dekking, breedte en straal van de rand aan te passen.
* **Kleuren:** Selecteer een kleur van het thema van je website of kies een aangepaste kleur.
* **Lettertype:** Kies een stijl en lettertype met behulp van de dropdowns en pas de grootte aan met de schuifregelaar.

**Geminimaliseerde chat**

Pas aan hoe je chatbox eruitziet wanneer deze is geminimaliseerd:

* **Chatbel:** Pas de kleur, het lettertype en de schaduw aan voor wanneer een chatbericht boven de knop verschijnt.
* **Chat-knop:** Pas het ontwerp voor de chatknop aan.  
   * **Ontwerp:** Kies een ontwerp voor een chatbox:  
         * **Standaard:** De chat zweeft boven de benedenhoek van je website.  
         * **Tab:** De chat wordt gekoppeld aan de onderrand van je website.  
         * **compact:** De chat toont alleen het door jou gekozen AI-pictogram zonder tekst.  
   * **Weergave:** Kies een stijl voor je geminimaliseerde chatbox: **Tekst en pictogram**, **Tekst** of **Pictogram**.  
   * **Opvulkleur:** Selecteer een kleur uit het thema van je website of kies een aangepaste kleur.  
   * **Letterstijl en kleur:** Kies een stijl en lettertype met behulp van de dropdowns.  
   * **Kleur pictogram:** Kies een kleur voor het pictogram knop).  
   * **Knoppictogram:** Kies een pictogramstijl uit de beschikbare opties.  
   * **Schaduw toepassen:** Klik op de schakelaar om de schaduw weer te geven of te verbergen. Gebruik de schuifregelaars om de dekking, vervaging, spreiding en richting van de schaduw aan te passen.  
   * **Nudge-animatie toepassen:** Klik op de schakelaar om een nudge-animatie in te schakelen die wordt afgespeeld wanneer de slimme chat een nieuw bericht verzendt terwijl het chatvak is geminimaliseerd.  
   * **Animatie rand toepassen:** Klik op de schakelaar om een animatie in te schakelen die de aandacht op de chat vestigt.

![Een screenshot van het Ontwerp-tabblad van de instellingen van de Wix Smart Chat-widget in de Wix Editor.](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/3eadcc04-813b-4e69-acf6-5bb047eced92/2026/03/10/07eabb78-89c6-494e-8a32-88c331f898a6/4e9ade2e-3751-4e15-a7c6-c17233778f2a.png)

**Studio Editor:**

1. [Ga naar je editor](https://manage.wix.com/account/site-selector/?actionUrl=https%3A%2F%2Fwww.wix.com%2Feditor% 2F%7BmetaSiteId%7D%3FeditorSessionId%3D%7Besi%7D%26).
2. Klik op de chat-widget.
3. Klik op **Instellingen**.
4. Klik op het **Ontwerp**-tabblad.
5. Kies wat je wilt ontwerpen:

> **Let op:** Standaard zijn wijzigingen die je in dit paneel aanbrengt, van toepassing op desktop en tablet. Om het ontwerp op mobiel aan te passen, ga je naar het mobiele breekpunt. [Lees meer over breekpunten](https://support.wix.com/nl/article/studio-editor-ontwerpen-voor-meerdere-breekpunten).

**Koptekst**

Pas de koptekst van je chatbox aan:

* **Achtergrond-, lettertype- en knopkleuren:** Selecteer een kleur van het thema van je website of kies een aangepaste kleur.
* **Lettertype:** Kies een stijl en lettertype met behulp van de dropdowns en pas de grootte aan met de schuifregelaar.
* **AI-pictogram weergeven:** Klik op de schakelaar om het AI-pictogram uit de koptekst weer te geven of te verbergen.

**Achtergrond**

Kies hoe je wilt dat de achtergrond van je chatbox eruitziet:

* **Kleuren wijzigen:** Selecteer een kleur van het thema van je website of kies een aangepaste kleur.
* **Schaduw toepassen:** Klik op de schakelaar om schaduw weer te geven of te verbergen. Gebruik de schuifregelaars om de dekking, vervaging, spreiding en richting van de schaduw aan te passen.

**Berichten**

Kies of je berichten van bezoekers, AI-berichten of kaarten wilt ontwerpen, en hun elementen aanpassen:

* **Kleuren:** Selecteer een kleur van het thema van je website of kies een aangepaste kleur.
* **Lettertype:** Kies een stijl en lettertype met behulp van de dropdowns en pas de grootte aan met de schuifregelaar.
* **Schaduw toepassen:** Klik op de schakelaar om de schaduw weer te geven of te verbergen. Gebruik de schuifregelaars om de dekking, vervaging, spreiding en richting van de schaduw aan te passen.
* **Randen aanpassen:** Gebruik de schuifregelaars om de dekking, breedte en straal van de rand aan te passen.  
![Een screenshot van het Berichten-menu wordt geopend op het Ontwerp-tabblad van de AI Site-Chat-instellingen, met verschillende ontwerpopties.](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/3eadcc04-813b-4e69-acf6-5bb047eced92/2025/01/30/854eac5b-611f-4ce6-a52f-9c0b5df51ac4/edf338ac-2c76-488f-912b-47281899a877.png)

**Invoerveld**

Pas aan hoe het tekstinvoerveld eruitziet voor je gebruikers wanneer ze de chat openen, het veld aanwijzen of erop focussen (klikken):

* **Randen aanpassen:** Gebruik de schuifregelaars om de dekking, breedte en straal van de rand aan te passen.
* **Kleuren:** Selecteer een kleur van het thema van je website of kies een aangepaste kleur.
* **Lettertype:** Kies een stijl en lettertype met behulp van de dropdowns en pas de grootte aan met de schuifregelaar.

**Geminimaliseerde chat**

Pas aan hoe je chatbox eruitziet wanneer deze is geminimaliseerd:

* **Chatbel:** Pas de kleur, het lettertype en de schaduw aan voor wanneer een chatbericht boven de knop verschijnt.
* **Chat-knop:** Pas het ontwerp voor de chatknop aan.  
   * **Ontwerp:** Kies een ontwerp voor een chatbox:  
         * **Standaard:** De chat zweeft boven de benedenhoek van je website.  
         * **Tab:** De chat wordt gekoppeld aan de onderrand van je website.  
         * **compact:** De chat toont alleen het door jou gekozen AI-pictogram zonder tekst.  
   * **Weergave:** Kies een stijl voor je geminimaliseerde chatbox: **Tekst en pictogram**, **Tekst** of **Pictogram**.  
   * **Opvulkleur:** Selecteer een kleur uit het thema van je website of kies een aangepaste kleur.  
   * **Letterstijl en kleur:** Kies een stijl en lettertype met behulp van de dropdowns.  
   * **Kleur pictogram:** Kies een kleur voor het pictogram knop).  
   * **Knoppictogram:** Kies een pictogramstijl uit de beschikbare opties.  
   * **Schaduw toepassen:** Klik op de schakelaar om de schaduw weer te geven of te verbergen. Gebruik de schuifregelaars om de dekking, vervaging, spreiding en richting van de schaduw aan te passen.  
   * **Nudge-animatie toepassen:** Klik op de schakelaar om een nudge-animatie in te schakelen die wordt afgespeeld wanneer de slimme chat een nieuw bericht verzendt terwijl het chatvak is geminimaliseerd.  
   * **Animatie rand toepassen:** Klik op de schakelaar om een animatie in te schakelen die de aandacht op de chat vestigt.

![Een screenshot van het Ontwerp-tabblad van de instellingen van de Wix Smart Chat-widget in de Studio Editor.](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/3eadcc04-813b-4e69-acf6-5bb047eced92/2026/03/10/c235abe8-8764-4b55-ad1a-515c4ffeb8a8/4d8caad7-41a8-428a-88e4-2db49a2eae77.png)