Google Tag Manager

WARNING:
We do not recommend using this installation method. Google Tag Manager can produce unexpected, undesired and/or unknown complications with your Olark chat widget. While we're able to offer the installation, we are not able to troubleshoot errors caused by using Olark with Google Tag Manager. For best results, we recommend using our manual installation method.

If you would like to use Olark with Google Tag Manager you can follow the guide below. There is an assumption that you already have your site and container setup, if you don't please follow this guide from google

Setup Guide

1. Login to Google Tag Manager
2. Go into your site container.
3. Choose "Triggers" from the menu on the left hand side, then "New". Name your trigger "GTM Dom Loaded"
4. Click on the "Trigger Configuration" section in the middle of the page.
5. Choose "DOM Ready" as the trigger, then "Continue"
6. "All DOM Ready Events" will already be chosen. Click "Save"
7. Now go to tags, on the left hand side. Create a new Tag, name it "Olark".
8. Click on "Tag Configuration" and choose "Custom HTML"
9. In the HTML text area paste your install code found in your Olark settings.
10. Check the box next to "Support document.write"
11. After the Support "document.write" option, is the "Triggering" section. Click on that area.
12. A dialogue box will open showing the trigger you created earlier. Select "GTM Dom Loaded"
13. Save the tag.
14. You should then see your new tag listed. It won't start working until you publish the new version. You can do that by clicking "Publish" in the top right and following the instructions. Olark will not work in GTM preview mode.

That's it, you should be able to go to your site and see Olark showing up. If it isn't make sure you've cleared your browser cache and refreshed the page.

We've had sporadic reports of Olark not working well with a Google Tag Manager installation. It's usually related to custom scripts that have been added to Google Tag Manager which we cannot see, and therefore cannot troubleshoot. If you find Olark is not working after following the directions above, you may want to try our regular HTML installation guide.

Using GTM + Google Analytics

If you're using GTM to with GA4, follow the steps in our Setting up the GA4 integration with Google Tag Manager article.

Using our API with GTM

You can use the Olark API with Google Tag Manager to customize your chatbox functionality.

olark.configure calls can be placed directly inside your Olark snippet right beneath the /* Add configuration calls below this comment */ line or you can add additional script tags below the Olark snippet in the HTML section of your tag like so.

<!-- end olark code -->
<script type="text/javascript">
  olark('api.box.expand');
</script>

‍