Hoe plaats ik de Website Widget?

Wanneer je wilt dat jouw chat ook zichtbaar is op jouw website, zul je een stukje code moeten plaatsen op jouw website. Hoe je jouw chat widget plaatst, leggen we uit in dit artikel.

Voor het aanpassen of aanmaken van een website widget, zul je een beheerder rol in het platform moeten hebben. Heb je dit niet? Vraag dan een van jouw collega's om dit voor je uit te voeren!

Het ophalen van de code

Voordat we de website widget op jouw website kunnen plaatsen, hebben we de code nodig. Heb je nog geen website widget aangemaakt? Lees in dit artikel hoe je dit kunt doen.

Je haalt de code als volgt op:

  • Ga naar Instellingen.
  • Kies voor Kanalen verbinden/wijzigen en selecteer vervolgens Website widget.
  • Open de website widget die je wilt plaatsen.
  • Ga naar code inzien.
  • Klik op Kopieer code om de code te kopiëren naar jouw klembord.

Plaatsen bestaande website widget

Let op: beheer jij niet jouw eigen website? Stuur de code dan door aan jouw websitebeheerder! Hij kan de code gemakkelijk op de website plaatsen.

Het plaatsen van de code in de <head> tag

  • Open jouw Wordpress omgeving.
  • Ga in het Dashboard naar Weergave.
  • Ga naar Thema editor.
  • Zoek naar het Header bestand (header.php).
  • Voeg de eerder gekopieerde code toe na de <head> tag.
  • Klik op bestand bijwerken. Jouw website widget is nu toegevoegd aan je website.

Kun je niet bij de header.php, of lukt het niet om de code hier te plaatsen? Plaats de code dan in functions.php.

Het gebruiken van Google Tag manager

Maak je gebruik van Google Tag Manager? In dit artikel leggen we je in 7 stappen uit hoe je jouw Website Widget plaatst via Google Tag Manager.

Het gebruiken van de Wordpress plugin

  • Download de Watermelon plugin in WordPress-Plugin Store. Dit doe je doorin WordPress te gaan naar Plugins. Klik op Nieuwe plugin. Typ in de zoekbalk in: "Watermelon". Je kan de plugin ook hier downloaden.
  • Na het downloaden van de plugin moet je deze activeren in je WordPress account. Ga opnieuw naar Plugins. Kies nu voor Geinstalleerde plugins. Zoek naar de Watermelon plugin en klik op activeren.
  • Klik onder Geinstalleerde plugins op de Instellingen van de Watermelon Plugin. Hier kun je de Key invullen. Je kunt de Watermelon key uit jouw eerder gekopieerde code van je website widget halen. Zie de dikgedrukte code in het voorbeeld hieronder. Vul deze Watermelon Key in, in jouw Wordpress-plugin, en de website widget is gekoppeld!

<script type="text/javascript">
window.Watermelon = window.Watermelon || {};
window.Watermelon.key = "ZNntxcSvPNBdmRtwXAiOvYnSNRBUQgnd7bX4sNZkF6gi3ZYuZGmrlFfOztFz";
window.Watermelon.toggled = false;
(function(d,s) {
s = d.createElement('script');
s.type = 'text/javascript';
s.async = true;
s.src = "https://wm-livechat-2-prod-dot-watermelonmessenger.appspot.com/assets/js/wm_plugin.js";
d.getElementsByTagName('script')[0].appendChild(s);
}(document));
</script>