Iframe host

css#

Type: false | string

Default: false

Base path to Redactor CSS assets. When set, the editor runs inside an iframe instead of the host page.

const app = Redactor('#entry', {
  css: '/assets/redactor/'
});

The iframe loads redactor.min.css from specified dir.

cssFile#

Type: string | false

Default: 'redactor.min.css'

Stylesheet file name appended to css in iframe mode.

const app = Redactor('#entry', {
  css: '/assets/redactor/',
  cssFile: 'redactor.css'
});

csscache#

Type: boolean

Default: false

Appends a cache-busting timestamp query (?ts=...) to CSS URLs loaded into the iframe (css + cssFile and external entries in custom.css).

const app = Redactor('#entry', {
  css: '/assets/redactor/',
  csscache: true
});

custom.css#

Type: false | string | string[]

Default: false

Extra styles injected into the iframe <head>. Each entry can be:

  • a URL (http... or path ending in .css) — loaded as <link>
  • a CSS string — injected as <style>
const app = Redactor('#entry', {
  css: '/assets/redactor/',
  custom: {
    css: [
      '/styles/editor.css',
      'body { font-family: sans-serif; }'
    ]
  }
});

custom.js#

Type: false | object

Default: false

Extra scripts injected into the iframe document.

const app = Redactor('#entry', {
  css: '/assets/redactor/',
  custom: {
    js: {
      head: ['/scripts/helpers.js'],
      bodyEnd: ['console.log("ready");']
    }
  }
});
Field Description
head Scripts appended to <head> (URL or inline code).
bodyEnd Scripts appended before </body>.

frame.lang#

Type: false | string

Default: false

Sets the lang attribute on the iframe <html> element.

const app = Redactor('#entry', {
  css: '/assets/redactor/',
  frame: {
    lang: 'en'
  }
});

frame.dir#

Type: false | string

Default: false

Sets the dir attribute on the iframe <html> element (ltr, rtl, etc.).

const app = Redactor('#entry', {
  css: '/assets/redactor/',
  dir: 'rtl',
  frame: {
    dir: 'rtl'
  }
});

frame.doctype#

Type: string

Default: '<!doctype html>'

Doctype prepended to the iframe srcdoc HTML.

const app = Redactor('#entry', {
  css: '/assets/redactor/',
  frame: {
    doctype: '<!DOCTYPE html>'
  }
});