Get early access
Menu
Docs

Install Wayhint with Google Tag Manager

If your marketing team manages scripts in GTM, Pepper can go in without a code deploy.

You need a site key, and your domain on its allowlist. See before you start. Replace YOUR-GUIDE-HOST and YOUR_SITE_KEY in the snippets.

  1. Option A: import the Wayhint template

    Get template.tpl from integrations/gtm in the source repository (it is not in the Community Template Gallery yet). In GTM, open Templates, Tag Templates, New, then the menu at the top right, Import, and save.

  2. Add a Wayhint guide tag

    Under Tags, New, choose Wayhint guide and paste your site key. Under Advanced you can set the API URL, accent colour and character (3D or Lite). GTM can't put data attributes on the script, so the template passes them as window.WayhintConfig and as query parameters on the script URL, which the widget reads.

    what the tag sets
    window.WayhintConfig = {
  siteKey: 'YOUR_SITE_KEY',
  assetsUrl: 'https://YOUR-GUIDE-HOST/widget/', // where the 3D chunk loads from
};
// then loads https://YOUR-GUIDE-HOST/widget/guide.js?site-key=YOUR_SITE_KEY

  3. Option B: a Custom HTML tag

    Add a new tag, choose Custom HTML and paste the script tag. GTM copies its attributes, so the widget finds data-site-key.

    html
    <script src="https://YOUR-GUIDE-HOST/widget/guide.js" data-site-key="YOUR_SITE_KEY" async></script>

  4. Trigger on the pages you want

    Use Initialization - All Pages or All Pages, or a page-path trigger to show Pepper only in your app or help center.

  5. Preview, then publish

    In Preview mode, open your site and check that the Ask Pepper button appears and window.Wayhint is defined in the console. Then submit the container.

The template only injects from the Wayhint CDN host. To self-host the widget, edit its Widget URL validation and the Injects scripts permission in the template editor.

Check it works

Open the page. An Ask Pepper button appears in the bottom corner and Pepper waves. In the browser console, window.Wayhint should be defined. If nothing appears, check the console for [web-assistant] messages: an unknown site key or a domain missing from the allowlist are the usual causes.

Next