Snippets

Adds an addbar button for inserting HTML snippets loaded from a URL or a static object. Snippets are inserted at the caret without replacing the whole document.

Open the addbar and choose Snippets, then pick an entry from the list.

Load the bundle

<script src="/assets/redactor/redactor.js"></script>
<script src="/assets/redactor/plugins/snippets/snippets.js"></script>

Initialization

const app = Redactor('#entry', {
    plugins: ['snippets'],
    snippets: {
        snippets: {
            quote: {
                name: 'Quote block',
                html: '<blockquote><p>A memorable quote.</p></blockquote>'
            }
        }
    }
});

Options

snippets (object | string | false)
- default false
- Snippet source. Object map keyed by id ({ name, html } per entry), or URL string to load JSON. The plugin is inactive when false.
toolbar (boolean)
- default false
- When true, also adds the button to the main toolbar after Add.
icon (string)
- SVG icon HTML for the addbar (and toolbar) button.

Redactor('#entry', {
    plugins: ['snippets'],
    snippets: {
        toolbar: true,
        snippets: '/api/snippets.json'
    }
});

Static object format:

snippets: {
    alert: {
        name: 'Alert',
        html: '<p class="alert">Important message.</p>'
    }
}

Language strings

en: {
    snippets: {
        snippets: 'Snippets'
    }
}

Events

This plugin does not emit events.

API

insert

Inserts a snippet by key and closes the dropdown.

Parameters:

key (string) — snippet id from the loaded JSON.

app.snippets.insert({ key: 'quote' });