Deploy WalkMe Using a JavaScript Snippet

Last Updated September 11, 2023

Brief Overview

The WalkMe snippet is what allows WalkMe to run on your site. Pages or browsers that include the snippet are able to access published WalkMe files on a server, allowing users to access and play content.

The snippet is a piece of JavaScript code that must be running in a user’s browser for WalkMe to work on the page. Each snippet is tied to a specific WalkMe Editor account. When items are published in the WalkMe Editor, they are accessible to users that have the associated snippet running on their browser.

Follow the steps below to deploy WalkMe using a snippet.

Deployment Guide

1. Obtain the snippet code

Expand

The snippet code is available from the WalkMe Editor. If you haven’t installed the Editor yet, please view these instructions. 

  1. Click Snippet in the Editor main menu
  2. Select the environment from the dropdown (Test/Production)
    • Environments have a slightly different snippet code
    • If you have a test/sandbox/staging site, select the snippet for Test
    • If you would like the snippet for publishing to your end-users, select the snippet for Production


      Note

      The environment in the Snippet screen will automatically show the same environment as in the main Editor view.

  3. Click Copy Code to copy the snippet

If you haven’t been able to retrieve the snippet code, contact our support team.


Note

The Snippet Code is a piece of code that needs to be added to your website for the desired functionality. You must have access to the code of the application in order to install the snippet directly to the website. 

2. Access your website’s backend

Expand

Log in to the backend or content management system (CMS) of your website.

If you are not familiar with accessing the backend, consult your website developer or administrator for assistance.

Expand

Navigate to the section of your CMS that allows you to edit the header or footer of your website.

This section is typically found in the settings, appearance, or theme customization area.

Expand

In the header/footer section, find the section where you can add custom code or scripts.

This section might be referred to as “Custom Scripts,” “Header Scripts,” “Footer Scripts,” or something similar.

5. Add the snippet code

Expand

Paste the Snippet Code (that was copied in step 1) into the designated area in the header/footer section of your CMS.

Required:

  • The WalkMe snippet must be placed in the HTML of every page you want WalkMe to load on
  • WalkMe checks for a unique user ID (UUID) upon page load

Best Practice: Place the snippet after the login page

  • The UUID is not available until the user is logged in. If the desired UUID is not available, a randomly generated session ID will be created
  • If you need to create certain content on the login page, please make sure that a complete page load occurs after logging in. This is necessary for capturing UUID
  • For single page applications: If WalkMe loads on the login page, a page refresh will be required after logging in to make sure the UUID can be loaded

6. Save the changes

Expand

  1. Save the changes after pasting the Snippet Code to the header/footer section in your CMS
  2. This action may involve pressing a “Save,” “Update,” or “Publish” button
  3. In order for WalkMe to load correctly on the site, it is necessary to publish the settings from the Editor. This will generate the required files and enable WalkMe to function properly

7. Verify installation

Expand

  1. Visit your website and go to the specific page where you want the Snippet Code to work
  2. Inspect the page to make sure that the desired functionality or feature is now active
  3. If you notice that the Snippet Code is not working as expected, double-check the placement of the code 
  4. If you still have issues, feel free to reach out to our support team for assistance

Once the snippet is in place, you will be able to see your published content from the Editor. To test the snippet and make sure it’s set up correctly:

  1. Open your site
  2. Right-click and select inspect the page
  3. Open the console
  4. Enter the following text query:  _walkMe.getEnvId()
  5. This command will return a value indicating which environment loaded:
    1. 0 = Production
    2. 1 = Preview
    3. 2 = Play
    4. 3 = Test
    5. Undefined = The snippet is not set up properly and you should contact support for assistance

That’s it! You have successfully installed the snippet code on your website. If you have any further questions or need assistance, please don’t hesitate to reach out to us.

🎓 Digital Adoption Institute

Was this article helpful?

Thanks for your feedback!
×

Select account type

Close
< Back

Mobile account login

< Back