1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283 |
- ---
- title: Registries
- ---
- Registries allow multiple editors with different formats to coexist on the same page.
- If you register a format with `Quill.register()`, the format will be registered to a global registry,
- which will be used by all Quill instances.
- However, in some cases, you might want to have multiple registries, so that different Quill instances
- can have different formats. For example, you might want to have a Quill instance that only supports
- bold and italic, and another Quill instance that supports bold, italic, and underline.
- ## Usage
- To create a Quill with a custom registry, you can pass in a registry object to the Quill constructor:
- ```js
- const registry = new Parchment.Registry();
- // Register the formats that you need for the editor with `registry.register()`.
- // We will cover this in more detail in the next section.
- const quill = new Quill('#editor', {
- registry,
- // ...other options
- })
- ```
- ## Register Formats
- A custom registry doesn't come with any formats by default. You should register the formats that you need with `registry.register()`.
- There are some essential formats that you will need to register in order to have a functional editor:
- <Sandpack
- defaultShowPreview
- files={{
- 'index.html': `
- <!-- Include stylesheet -->
- <link href="{{site.cdn}}/quill.snow.css" rel="stylesheet" />
- <div id="editor">
- </div>
- <!-- Include the Quill library -->
- <script src="{{site.cdn}}/quill.js"></script>
- <script src="/index.js"></script>`,
- "/index.js": `
- const Parchment = Quill.import('parchment');
- // Essential formats
- const Block = Quill.import('blots/block');
- const Break = Quill.import('blots/break');
- const Container = Quill.import('blots/container');
- const Cursor = Quill.import('blots/cursor');
- const Inline = Quill.import('blots/inline');
- const Scroll = Quill.import('blots/scroll');
- const Text= Quill.import('blots/text');
- const registry = new Parchment.Registry();
- registry.register(
- Scroll,
- Block,
- Break,
- Container,
- Cursor,
- Inline,
- Text,
- );
- const quill = new Quill('#editor', {
- registry,
- theme: 'snow'
- });
- `}}
- />
- <Hint>
- You may have noticed that the format buttons on the toolbar above doesn't work.
- This is because we haven't registered any of the corresponding formats yet.
- The toolbar module doesn't detect whether a format is available or not, so it will always show the buttons.
- Follow [this guide](/docs/modules/toolbar) to learn more about how to customize the toolbar.
- </Hint>
|