Defined Links

Adds a preset link picker to the built-in link form. When the link dropdown opens, a select field appears above the URL input with your predefined links.

No toolbar button is added. Configure items or load links from a URL, then use the editor Link button as usual.

Load the bundle

<script src="/assets/redactor/redactor.js"></script>
<script src="/assets/redactor/plugins/defined-links/defined-links.js"></script>

Initialization

const app = Redactor('#entry', {
    plugins: ['definedLinks']
});

Options

  • items (object[] | function | false)
    • default false
    • Preset links. Each item: { name: string, url: string }. Can be a static array or a function that returns an array (sync or async).
  • url (string | false)
    • default false
    • Endpoint to load links as JSON. Used when items is not a static array. Response can be an array or { items: [...] }.
  • method (string)
    • default 'GET'
    • HTTP method for url requests.
Redactor('#entry', {
    plugins: ['definedLinks'],
    definedLinks: {
        items: [
            { name: 'Home', url: '/' },
            { name: 'About', url: '/about' },
            { name: 'Contact', url: '/contact' },
            { name: 'External', url: 'https://example.com' }
        ]
    }
});

Async items:

Redactor('#entry', {
    plugins: ['definedLinks'],
    definedLinks: {
        items: async (app) => {
            const res = await fetch('/api/links');
            return res.json();
        }
    }
});

Language strings

en: {
    definedLinks: {
        select: 'Select...'
    }
}

Events

This plugin does not emit events.

API

This plugin does not expose a public API.