> For the complete documentation index, see [llms.txt](https://docs.beacon.li/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.beacon.li/how-to-setup-sdk.md).

# How to setup SDK?

Welcome to the integration guide for the Beacon SDK. This document will walk you through the process of connecting the Beacon SDK to your website.

Integrate the Beacon SDK into your website by following these steps or simply use "npm i @beacon.li/bar" for seamless implementation.

#### Step 1: Copy the Script

Copy the following script and paste it into the `<head>` of every page you wish to have beacon bar.

```javascript
<script>
(function(b,e,a,c,o,n) {b[c] = {orgId:n, open:()=>{b[c].opened=true}};
  var s = e.createElement(a);
  s.src='https://cdn.beacon.li/sdk/latest.js';s.async=true;s.type='module';
  var d = e.createElement(o);
  d.id='beacon-user';
  e.body.appendChild(d);
  e.head.appendChild(s);
})(window, document, 'script', 'BeaconBar', 'div','US6P8B');
</script>
```

#### Step 2: Replace YOUR\_ORG\_ID

On the Beacon dashboard's overview page, you can find organization IDs for both the sandbox and live environments. Choose your preferred environment and replace "YOUR\_ORG\_ID" with the corresponding ID.

<figure><img src="/files/GQeXf0WF0YNr2IrVOZaL" alt=""><figcaption></figcaption></figure>

#### Step 3: Save and Deploy

Save your changes and deploy your website with the updated code.

### Testing:

To ensure successful integration, visit your website in a browser and use the keyboard shortcut "Command + K" (for Mac) or "CTRL + K" (for Windows). The command palette will appear, as illustrated in the screenshot below.

<figure><img src="/files/m2cBf4HDfhhve7vyp2tV" alt=""><figcaption></figcaption></figure>

If you already have a function assigned to "Command + K" (for Mac) or "CTRL + K" (for Windows) shortcut, you can modify the Beacon shortcut in the Beacon dashboard. To make changes, navigate to Config > Bar Config > Bar Shortcuts. For both Mac and Windows, click 'x' to cancel the current shortcut and enter your preferred shortcut.

<figure><img src="/files/FerOliK27G6LJr2HVVzm" alt=""><figcaption></figcaption></figure>

If you encounter any issues or have further questions, please refer to the [Developer Docs](https://api.beacon.li/) or you can contact us at <support@beacon.li>
