> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.co-din.com/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# How do I install Crisp Live Chat on Nuxt.js

Articles on: [Install Crisp](/en/category/install-crisp-8bn075/)

Are you using Nuxt.js to create your new web application? Here is how you can add the Crisp chatbox on it in less than 2 minutes.  
  
*   Create an account on Crisp.
  
*   Go to ` Settings`. Then, ` Website Settings`.
  
*   Next to your website, click on ` Settings`.
  
*   Click on ` Setup instructions`.
  
*   Click on ` Chatbox setup instructions`.
  
*   Select ` HTML`.
  
  
![](https://storage.crisp.chat/users/helpdesk/website/9b350c805700e000/3df8f609-47b2-418a-89ea-fbfccb_1oc920j.png)  
*   Copy the JavaScript code to retrieve your ` CRISP_WEBSITE_ID`.
  
  
![](https://storage.crisp.chat/users/helpdesk/website/da43d0701c310800/79609da9-071d-41b0-8b04-0db46b_1tkez4g.png)  
*   Inside your ` plugins` folder, create a file ` crisp.js` and paste this code below. Replace the ` CRISP_WEBSITE_ID` with yours.
  
  

``` export default () => { window.$crisp = []; window.CRISP_WEBSITE_ID = "-Jz83enQu9383enYV8"; (function() { var d = document; var s = d.createElement("script"); s.src = "https://client.crisp.chat/l.js"; s.async = 1; d.getElementsByTagName("head")[0].appendChild(s); })(); };```

  
  
Make sure to replace

` CRISP_WEBSITE_ID`

with yours. Otherwise, this will not work!  
  
Then, we tell Nuxt.js to import it in our main application. Open

` nuxt.config.js`

:  
  

``` module.exports = { plugins: [{ src: "~plugins/crisp.js", mode: "client" }] };```

  
  
For your information, setting

` mode`

to

` client`

tells the server that this plugin should only be run on the browser. Rendering this plugin server-side would trigger an error as it is making use of the

` window`

object.  
  
If you refresh the page, you should now see your brand new Crisp livechat appearing on your website.

Updated on: 11/03/2024