Change display of tags in inspector to custom text

[ok-ttc]

Is there a way to change the display of the tags in the inspector to custom text? I want to offer this to an inexperienced audience and they do not know what h1, p or td means. Instead I would like to have something like Heading, Paragraph or Table Cell.

Is that possible or is there a way to accomplish that?

[anthonyjb]

Hi @ok-ttc,

Simplest approach I can think of would be something like...

const customTagNames = {
    'h1': 'Heading',
    'p': 'Body text'
}

ContentTools.TagUI.prototype.mount = function (domParent, before=null) {
    this._domElement = this.constructor.createDiv(['ct-tag'])
    this._domElement.textContent = customTagNames[this.element.tagName()]

    ContentTools.AnchoredComponentUI.prototype.mount.call(this, domParent, before)
}