GetmeUK / ContentTools

A JS library for building WYSIWYG editors for HTML content.
http://getcontenttools.com
MIT License
3.95k stars 395 forks source link

How to replace <p> by <span>? #468

Closed babenkoma closed 6 years ago

babenkoma commented 6 years ago

How do I configure the plugin to have a "span" element instead of "p" inside the container? For example: <div data-editable data-name="text"><span>Text</span></div>

anthonyjb commented 6 years ago

You can do the following:

<div data-editable data-name="text"><span data-ce-tag="p">Text</span></div>
babenkoma commented 6 years ago

Thank you. For editing, this works. But if I press Enter, a new line "p" appears, not "span"

anthonyjb commented 6 years ago

@babenkoma if you want to change the default tag that's generated when a user presses return you'd have to modify the _keyReturn handler method (https://github.com/GetmeUK/ContentEdit/blob/master/src/scripts/text.coffee#L394).

>>> from >>>

element = new @constructor('p', {}, tail.trim())

>>> to >>>

element = new @constructor('span', {'data-ce-tag': 'p'}, tail.trim())

Potentially I could make the out of this configurable as an enhancement, but currently it's not possible to configure this behaviour.

anthonyjb commented 6 years ago

@babenkoma just thinking if you don't want the user to be able to be able to create new paragraphs at all you could use a fixture, e.g:

<div><span data-fixture data-name="text" data-ce-tag="p">Text</span></div>
babenkoma commented 6 years ago

<div><span data-fixture data-name="text" data-ce-tag="p">Text</span></div> Thank you! That's what I need!