Toolbar

toolbar#

Type: false | object

Default: object with sticky/placement defaults (see nested keys below)

Pass false to disable the toolbar feature. The toolbox may still render if pathbar is enabled.

const app = Redactor('#entry', {
  toolbar: false
});

toolbar.add#

Type: object

Default: {}

Extra toolbar buttons at init (name → button config).

const app = Redactor('#entry', {
  toolbar: {
    add: {
      templates: {
        title: 'Templates',
        command: 'templates.open',
        position: { after: 'add' }
      }
    }
  }
});

toolbar.hide#

Type: string[]

Default: []

Button names to hide from the main toolbar.

const app = Redactor('#entry', {
  toolbar: {
    hide: ['table', 'image']
  }
});

toolbar.target#

Type: false | string

Default: false

CSS selector for an external element that receives the entire toolbox (pathbar + toolbar + extrabar).

const app = Redactor('#entry', {
  toolbar: {
    target: '#editor-toolbar'
  }
});

toolbar.sharedTarget#

Type: boolean

Default: false

For multiple editors sharing one toolbar.target: only the first instance renders the toolbox; others hide their duplicate toolbox (display: none) until focused.

const app1 = Redactor('#editor-1', {
  toolbar: { target: '#shared-toolbar', sharedTarget: true }
});
const app2 = Redactor('#editor-2', {
  toolbar: { target: '#shared-toolbar', sharedTarget: true }
});

toolbar.sticky#

Type: boolean

Default: true

Enables sticky toolbox behavior on scroll.

const app = Redactor('#entry', {
  toolbar: {
    sticky: false
  }
});

toolbar.stickyMobileBottom#

Type: boolean

Default: false

Below toolbar.stickyBreakpoint width, sticks the toolbox to the bottom of the viewport instead of the top.

const app = Redactor('#entry', {
  toolbar: {
    stickyMobileBottom: true
  }
});

toolbar.stickyMinHeight#

Type: number

Default: 200

Minimum editor height (px) required before sticky mode activates.

const app = Redactor('#entry', {
  toolbar: {
    stickyMinHeight: 400
  }
});

toolbar.stickyTopOffset#

Type: number

Default: 0

Extra top offset (px) when the toolbox is fixed on desktop.

const app = Redactor('#entry', {
  toolbar: {
    stickyTopOffset: 20
  }
});

toolbar.stickyBottomTolerance#

Type: number

Default: 20

Tolerance (px) near the bottom of the editor before unsticking on desktop.

const app = Redactor('#entry', {
  toolbar: {
    stickyBottomTolerance: 0
  }
});

toolbar.stickyBreakpoint#

Type: number

Default: 768

Viewport width (px) that switches between desktop (top sticky) and mobile behavior.

const app = Redactor('#entry', {
  toolbar: {
    stickyBreakpoint: 480
  }
});

toolbar.stickyZIndex#

Type: number

Default: 299

z-index applied to the fixed toolbox.

const app = Redactor('#entry', {
  toolbar: {
    stickyZIndex: 99
  }
});