quill: Configurable block tag (div, paragraph)

Whilst div tags are quite acceptable for most cases, there are some uses where paragraph tags are necessary over div’s.

As an example: I work on an application that allows authors to write content for ePubs. For both logical structure and ePub rendering reasons we like to use paragraph tags.

From a very shallow inspection of the source it would appear this would involve changing references to the dom.DEFAULT_BLOCK_TAG variable with an option defined at initialisation.

Is there enough reason to warrant this change?
Are there any unintended consequences of implementing a change like this? @jhchen
How should configuration be handled? Define in the constructor options hash as block_tag: 'p'?

About this issue

Original URL
State: closed
Created 10 years ago
Comments: 27 (3 by maintainers)

Most upvoted comments

The default block tag in the 1.0 beta release is <p>, with no bottom margin. If you want the bottom margin you can add it with css. If you want the default block tag to be <div> like it was before, you can configure with Parchment:

var Parchment = Quill.import('parchment');
var Block = Parchment.query('block');
Block.tagName = 'DIV';
// or class NewBlock extends Block {}; NewBlock.tagName = 'DIV';
Quill.register(Block /* or NewBlock */, true);

// Create your Quill editor like before
var quill = new Quill('#editor');

jhchen on May 15, 2016

This approach does not work with multiple instances of Quill editor in the same page using different tagNames.

let Block = Parchment.query('block');
Block.tagName = 'DIV';
Quill.register(Block, true);
let editor1 = new Quill({...});

let Block = Parchment.query('block');
Block.tagName = 'P';
Quill.register(Block, true);
let editor2 = new Quill({...});

Both editors are using same last tagName=‘P’. Do you know any way to do that?

mdperez86 on Jul 31, 2018