---
title: "JavaScript SDK: Code snippet"
description: "Install Gleap using the website code snippet with the Gleap JavaScript SDK. Follow the integration code examples."
url: https://docs.gleap.ai/en/articles/394-javascript-sdk-code-snippet
collection: "JavaScript"
updated: 2026-11-01
language: en
---

# JavaScript SDK: Code snippet

Install Gleap using the website code snippet with the Gleap JavaScript SDK. Follow the integration code examples.

Add the following code snippet to the `<head>`\-tag of your website or web app. Replace `API-KEY` with your API key. The snippet below will load the Gleap widget asynchronously, to ensure it won't affect your page speed.

The code snippet loads the Gleap JS SDK and its CSS. Additionally, it prefills all required methods and caches their calls, even when the SDK itself hasn't been loaded yet. This way, you can directly call the SDK right after adding the code snippet to your `<head>`\-tag.

**minified**

```html
<script>
!function(){if(!(window.Gleap=window.Gleap||[]).invoked){window.GleapActions=[];var e=new Proxy({invoked:!0},{get:function(e,n){return"invoked"===n?e.invoked:function(){var e=Array.prototype.slice.call(arguments);window.GleapActions.push({e:n,a:e})}},set:function(e,n,t){return e[n]=t,!0}});window.Gleap=e;var n=document.getElementsByTagName("head")[0],t=document.createElement("script");t.type="text/javascript",t.async=!0,t.src="https://sdk.gleap.io/latest/index.js",n.appendChild(t),
    window.Gleap.initialize("API_KEY")
}}();
</script>
```

**Source**

```html
<script>
    !(function () {
    if (!(window.Gleap = window.Gleap || []).invoked) {
      window.GleapActions = [];

      // Create a Proxy to handle ANY method call dynamically
      var gleapProxy = new Proxy(
        {
          invoked: true,
        },
        {
          get: function (target, prop) {
            // Always return the invoked property if accessed
            if (prop === "invoked") {
              return target.invoked;
            }
            
            return function () {
              var args = Array.prototype.slice.call(arguments);
              window.GleapActions.push({ e: prop, a: args });
            };
          },
          set: function (target, prop, value) {
            target[prop] = value;
            return true;
          },
        }
      );

      // Replace window.Gleap with our proxy
      window.Gleap = gleapProxy;

      // Load the SDK script
      var head = document.getElementsByTagName("head")[0];
      var script = document.createElement("script");
      script.type = "text/javascript";
      script.async = true;
      script.src = "https://sdk.gleap.io/latest/index.js";
      head.appendChild(script);

      // Queue the initialize call using the proxied version
      window.Gleap.initialize("API_KEY");
    }
  })();
</script>
```

## Related

- [JavaScript SDK setup](https://docs.gleap.ai/en/articles/393-javascript-sdk-setup.md)
- [JavaScript SDK: User identity](https://docs.gleap.ai/en/articles/395-javascript-sdk-user-identity.md)
- [JavaScript SDK: Callbacks](https://docs.gleap.ai/en/articles/396-javascript-sdk-callbacks.md)
- [JavaScript SDK: AI chatbar](https://docs.gleap.ai/en/articles/397-javascript-sdk-ai-chatbar.md)
- [JavaScript SDK: Frontend tools](https://docs.gleap.ai/en/articles/398-javascript-sdk-frontend-tools.md)
