GrapesJS / ckeditor

This plugin replaces the default Rich Text Editor with the one from CKEditor
BSD 3-Clause "New" or "Revised" License
103 stars 102 forks source link

span couldn't edit with CKEditor #8

Closed richieteh94 closed 6 years ago

richieteh94 commented 6 years ago

HI @artf I'm having an issue for allowing element to edit with CKEDITOR. Currently I could allow a span to be read and now it get an error like image

my code is below. `

        var editor = grapesjs.init({
            container: '#gjs',
            fromElement: true,
            plugins: ['gjs-preset-newsletter','gjs-plugin-export','gjs-plugin-ckeditor'],
            pluginsOpts: {
                'gjs-plugin-ckeditor': {
                    position: 'center',
                    option: {
                        enterMode: CKEDITOR.ENTER_BR,
                        toolbar: [
                            { name: 'styles', items: ['Font', 'FontSize'] },
                            { name: 'basicstyles', items: ['Bold', 'Italic', 'Strike', '-', 'RemoveFormat'] },
                            { name: 'paragraph', items: ['NumberedList', 'BulletedList', '-', 'JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock'] },
                            { name: 'links', items: ['Link', 'Unlink'] },
                            { name: 'colors', items: ['TextColor', 'BGColor'] }
                        ]
                    }
                }
            }
        });
        var domC = this.editor.DomComponents;
        var textType = domC.getType('text');
        domC.addType('span', {
            model: textType.model.extend(
                {},
                {
                    isComponent(el) {
                        if (el.tagName == 'SPAN') {
                            return {
                                type: 'Span',
                                src: el.src,
                                tagName: el.tagName.toLowerCase(),
                                editable:true
                            };
                        }
                    }
                }
            ),
            view: textType.view
        });

        editor.runCommand('gjs-get-inlined-html');/*make the template respond to changes immediately*/

     `
artf commented 6 years ago

https://stackoverflow.com/questions/14575036/enable-ckeditor4-inline-on-span-and-other-inline-tags