Google Tag manager
How to include the DialoX chat widget using Google Tag Manager
When you are managing multiple third party tags and scripts on your website, it might be a good idea to start using a service to keep track of them easily. Google Tag manager is one of those services.
This page explains how to use Google Tag manager to expose the DialoX chat widget on your website.
Get google tag manager
First make sure you have an account to goolge tag manager. For this, go to:
After you've signed up, you will receive two HTML snippets that you need to incorporate in your website according the instructions provided by google.
![](https://manuals.dialox.ai/~gitbook/image?url=https%3A%2F%2F3356808761-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FEBQHGJABNTj5ISSOTRxM%252Fuploads%252FfMCyhwEhQAsPlmzIyLoC%252Fimage.png%3Falt%3Dmedia%26token%3D929c1490-791e-4701-8d45-ff9de16fe86b&width=768&dpr=4&quality=100&sign=1b91250c&sv=1)
When you are using a CMS like Wordpress or Wix, you don't need to worry about applying these snippets to your HTML code. You only need to make sure the plugin or widget you are using is connected to your Google Tag manager account.
Add a custom tag
When you have an account to google tag manager and implemented Google Tag manager on your website, you can now start adding services to is, like the DialoX web widget. You can do this by adding a custom tag.
Go to your overview page and click on "Add a new tag"
![](https://manuals.dialox.ai/~gitbook/image?url=https%3A%2F%2F3356808761-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FEBQHGJABNTj5ISSOTRxM%252Fuploads%252FVTNUGk7sa0nlAVMioinU%252Fimage.png%3Falt%3Dmedia%26token%3D4e9e1c9e-178b-4bce-bf92-bee0a0259d7e&width=768&dpr=4&quality=100&sign=c89ce9ac&sv=1)
Google will open the following page in which you will need to provide two pieces of information:
Tag configuration
Triggering
![](https://manuals.dialox.ai/~gitbook/image?url=https%3A%2F%2F3356808761-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FEBQHGJABNTj5ISSOTRxM%252Fuploads%252FXEZyNkaq9yo0iuXUMygf%252Fimage.png%3Falt%3Dmedia%26token%3D0f7e9450-7cf1-4911-b424-e1d9c5aa41bf&width=768&dpr=4&quality=100&sign=35fb8e6b&sv=1)
Step 1 Add tag configuration
Click on Tag Configuration and select Custom HTML in the list on the next form:
![](https://manuals.dialox.ai/~gitbook/image?url=https%3A%2F%2F3356808761-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FEBQHGJABNTj5ISSOTRxM%252Fuploads%252FjGMqJKvCfwdGvtiIot0A%252Fimage.png%3Falt%3Dmedia%26token%3Dfe8538f6-2f73-4344-9ba3-dc024a656adb&width=768&dpr=4&quality=100&sign=a4abbefd&sv=1)
Now go to the Channels page in the DialoX studio and click on Web Widget. Here you can find the Web Widget snippet. Copy it to your clipboard:
![](https://manuals.dialox.ai/~gitbook/image?url=https%3A%2F%2F3356808761-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FEBQHGJABNTj5ISSOTRxM%252Fuploads%252FYK26oiNDjaPg5IVbujqX%252Fimage.png%3Falt%3Dmedia%26token%3D15acb2de-28b2-4db2-8fee-dc46857972fc&width=768&dpr=4&quality=100&sign=a7c8cbec&sv=1)
Now go back to the Google Tag manager page that you just opened, paste and save the snippet in there and continue with step 2.
Step 2 Triggering
Now open the triggering page and select All Pages to have the Chat widget on all pages of your website.
![](https://manuals.dialox.ai/~gitbook/image?url=https%3A%2F%2F3356808761-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FEBQHGJABNTj5ISSOTRxM%252Fuploads%252FSOPRNU3PE65WwB8wxPpe%252Fimage.png%3Falt%3Dmedia%26token%3D2970870f-be8f-435c-a317-0808abd1ae72&width=768&dpr=4&quality=100&sign=2d504fe1&sv=1)
Submit your tag
Now you've configured your tag you first need to submit it before it becomes active on your website.
For this click on the submit button on the overview page in Tag Manager.
![](https://manuals.dialox.ai/~gitbook/image?url=https%3A%2F%2F3356808761-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FEBQHGJABNTj5ISSOTRxM%252Fuploads%252FzCXZqErknjhb3kpqKjyv%252Fimage.png%3Falt%3Dmedia%26token%3D1135640c-bdba-415c-be11-0af193cc0696&width=768&dpr=4&quality=100&sign=ce419729&sv=1)
Now give your version a descriptive name and click on the Submit button:
![](https://manuals.dialox.ai/~gitbook/image?url=https%3A%2F%2F3356808761-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FEBQHGJABNTj5ISSOTRxM%252Fuploads%252FaVc7Kf3VQlEPX1UjKvcr%252Fimage.png%3Falt%3Dmedia%26token%3D3cf97c40-05c7-4d82-96e0-02ca10fce354&width=768&dpr=4&quality=100&sign=2ff88e21&sv=1)
Now go to your website and check it. It should now show the web widget icon you configured for your website in the right lower corner of your website.
![](https://manuals.dialox.ai/~gitbook/image?url=https%3A%2F%2F3356808761-files.gitbook.io%2F%7E%2Ffiles%2Fv0%2Fb%2Fgitbook-x-prod.appspot.com%2Fo%2Fspaces%252FEBQHGJABNTj5ISSOTRxM%252Fuploads%252FdgacOFxivefyzCBYNm7u%252Fimage.png%3Falt%3Dmedia%26token%3D33617a6c-3101-47cb-8dc5-58abb73e5ec9&width=768&dpr=4&quality=100&sign=a760d70f&sv=1)
Last updated