Overview

To access the Article's API from external scripts, you need to get an instance of the running editor:

var app = ArticleEditor('#entry', {
    css: '/your-article-dist-path/'
});

Or after starting the editor by accessing the element by ID:

var app = ArticleEditor('#entry');

After that you can call the API commands:

app.editor.insertContent({ html: '<p>Hello world!</p>' });

Multiple editors

If Article is running for multiple elements, it returns instances as an array:

// elements
<textarea class="entry"></textarea>
<textarea class="entry"></textarea>

// call
var app = ArticleEditor('.entry', {
    css: '/your-article-dist-path/'
});

API instances is accessed as below:

app[0].editor.insertContent({ html: '...' });
app[1].editor.insertContent({ html: '...' });

You can also access the API of a specific Article by element ID.

// elements
<textarea id="entry-1" class="entry"></textarea>
<textarea id="entry-2" class="entry"></textarea>

// call
ArticleEditor('.entry', {
    css: '/your-article-dist-path/'
});

// api
var app1 = ArticleEditor('#entry-1');
var app2 = ArticleEditor('#entry-2');

app1.editor.insertContent({ html: '...' });
app2.editor.insertContent({ html: '...' });

API inside plugin

Inside the plugins, you can access to the editor API by using this.app.

ArticleEditor.add('plugin', 'myplugin', {
    start: function() {
        this.app.toolbar.add('mybutton', {
            title: 'My Button',
            icon: '<i class="fa fa-file-alt"></i>',
            command: 'myplugin.insert'
        });
    },
    insert: function() {
        this.app.editor.insertContent({
            html: '<p>Hello world!</p>'
        });
    }
});