Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How to change the class name in the editor? #43

Open
do-web opened this issue Apr 30, 2020 · 2 comments
Open

How to change the class name in the editor? #43

do-web opened this issue Apr 30, 2020 · 2 comments

Comments

@do-web
Copy link

do-web commented Apr 30, 2020

How to change the class name in the editor or disable the styles?

So i want to remove or change the classname ce-header, that the header can use the default page style.

@EChatzidakis
Copy link

Either change the ./src/index.css file or bundle the module without the css and have the styles in a separate file.

@elroliv
Copy link

elroliv commented Nov 25, 2020

Hello, to override Header I've done this :

// HeaderBulma.js
const Header = require('@editorjs/header/dist/bundle.js')
class HeaderBulma extends Header {
    constructor({ data, config, api, readOnly }) {
        super({ data, config, api, readOnly })
        this._CSS.wrapper = 'title'
        /**
         * Main Block wrapper
         *
         * @type {HTMLElement}
         * @private
         */
        this._element = this.getTag();
    }
    /**
     * Get tag for target level
     * By default returns second-leveled header
     *
     * @returns {HTMLElement}
     */
    getTag() {
        const tag = super.getTag()
        let headerClass = 'is-'+this.currentLevel.number
        tag.classList.add(headerClass);

        return tag;
    }
}
module.exports = HeaderBulma
// main.js
let editor = new EditorJS({
    tools: {
        header: {
            class: HeaderBulma,
        },
    }
}

I hope it's help you 😉

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants