DeskCrew

Install DeskCrew on Astro, Docusaurus, or Nuxt (npm packages)

DeskCrew ships official npm packages for the three big JavaScript site frameworks. Astro, Docusaurus, and Nuxt. Each one adds the support widget (live chat, instant answers from your help articles, and your help center) to every page with a single config entry. Prefer zero dependencies? The one-line script paste works on all three too. Both options are below.

Your widget key (pub_…) for every option is on Dashboard → Install.

Astro. @deskcrew/astro

npm install @deskcrew/astro

// astro.config.mjs
import { defineConfig } from 'astro/config'
import deskcrew from '@deskcrew/astro'

export default defineConfig({
  integrations: [
    deskcrew({
      widgetKey: 'pub_xxxxxxxx', // required. from Dashboard → Install
      // board: 'your-workspace', // optional
      // color: '#4f46e5',        // optional accent colour
      // position: 'right',       // optional: 'left' | 'right'
      // greeting: 'Hi! How can we help?', // optional
    }),
  ],
})

Deploy. The widget appears on every page. Package page: https://www.npmjs.com/package/@deskcrew/astro

Docusaurus. @deskcrew/docusaurus-plugin

npm install @deskcrew/docusaurus-plugin

// docusaurus.config.js
module.exports = {
  // ..
  plugins: [
    [
      '@deskcrew/docusaurus-plugin',
      {
        widgetKey: 'pub_xxxxxxxx', // required. from Dashboard → Install
        // board, color, position, greeting. same optional keys as above
      },
    ],
  ],
}

Rebuild and deploy. Package page: https://www.npmjs.com/package/@deskcrew/docusaurus-plugin

Nuxt. @deskcrew/nuxt

npm install @deskcrew/nuxt

// nuxt.config.ts
export default defineNuxtConfig({
  modules: ['@deskcrew/nuxt'],
  deskcrew: {
    widgetKey: 'pub_xxxxxxxx', // required. from Dashboard → Install
    // board, color, position, greeting. same optional keys as above
  },
})

Works in Nuxt 3 and 4. Package page: https://www.npmjs.com/package/@deskcrew/nuxt

No package manager? Paste the script instead

All three frameworks also accept the plain widget tag. In Astro's base layout <head>, Docusaurus's scripts config field, or Nuxt's app.head.script:

<script src="https://deskcrew.io/desk.js" data-key="pub_YOUR_KEY" data-board="your-board" defer></script>

Add your site's URL under Allowed Origins on the Install page so the widget is authorized (the npm packages ship the same tag under the hood, so the same rule applies).

Troubleshooting

  • Widget not appearing? Check Allowed Origins first. See "Why your widget isn't appearing: allowed origins".
  • Wrong colour or position? The optional keys override the dashboard defaults; remove them to manage appearance from the dashboard instead.

Per-framework guides with FAQs: https://deskcrew.io/integrations/astro · https://deskcrew.io/integrations/docusaurus · https://deskcrew.io/integrations/nuxt

Related articles