To access the Redactor's API from external scripts, you need to get an instance of the running editor:
let app = Redactor('#entry');
Or after starting the editor by accessing the element by ID:
let app = Redactor('#my-element-id');
After that you can call the API commands:
app.editor.insertContent({ html: '<p>Hello world!</p>' });
If Redactor is running for multiple elements, it returns instances as an array:
// elements
<textarea class="entry"></textarea>
<textarea class="entry"></textarea>
// call
let apps = Redactor('.entry');
API instances is accessed as below:
apps[0].editor.insertContent({ html: '...' });
apps[1].editor.insertContent({ html: '...' });
You can also access the API of a specific Redactor by element ID.
// elements
<textarea id="entry-1" class="entry"></textarea>
<textarea id="entry-2" class="entry"></textarea>
// call
Redactor('.entry');
// api
let app1 = Redactor('#entry-1');
let app2 = Redactor('#entry-2');
app1.editor.insertContent({ html: '...' });
app2.editor.insertContent({ html: '...' });
Inside the plugins, you can access to the editor API by using this.app
.
Redactor.add('plugin', 'myplugin', {
start() {
this.app.toolbar.add('mybutton', {
title: 'My Button',
icon: '<svg...>',
command: 'myplugin.insert'
});
},
insert() {
this.app.editor.insertContent({
html: '<p>Hello world!</p>'
});
}
});