Log in to AnswerLog in to Follow
Shaun11
14Views
7Comments
Solved
How to remove default text from CKEditor - Preview
Question
Reactive
Application Type
Reactive

Hi,

In my Reactive web app  I am using "CKEditor".  When I click on Image icon then in Preview I got by default text which I didn't mention it anywhere.

Is it any way to empty that text. And if I try  to remove this at runtime I unable to remove it as well.


Thanks

0
0
on 8th Apr

Hi Shaun,

I Just tried with my configuration and it just works fine. Try removing the "config.". This is my configuration:

"toolbarGroups: [
        { name: 'clipboard',   groups: [ 'clipboard', 'undo' ] },
        { name: 'editing',     groups: [ 'find', 'selection', 'spellchecker' ] },
        { name: 'links' },
        { name: 'insert' },
        { name: 'forms' },
        { name: 'tools' },
        { name: 'document',       groups: [ 'mode', 'document', 'doctools' ] },
        { name: 'others' },
        '/',
        { name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] },
        { name: 'paragraph',   groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ] },
        { name: 'styles' },
        { name: 'colors' },
        { name: 'about' }
    ],

    removeButtons: 'Subscript,Superscript',
    format_tags: 'p;h1;h2;h3;pre',
    image_previewText: ' '
"

Here you can see how it looks.


See solution in context
0
0
on 8th Apr

Hello Shaun,


From what I know, that text is purely informative, when you actually upload an image (or use an image URL) you won't see that text in the UI.


Regards,

Bogdan

0
0
on 8th Apr

Hi

I test this as well but after uploading an image that text still there

0
0
on 8th Apr

Indeed, in the preview it's there, but if you display the CKEditor content in another page it will be displayed correctly

The only issue I see it's the preview, but it doesn't affect the end result. Maybe the component creators can take it into consideration and remove the preview, or make it work properly.


Regards,

Bogdan

0
0
on 8th Apr

Hi Shaun,

CKEditor is higlhy customizable. Here you can have a look at all the available configuration options.

You can change the default settings by updating the config parameter value:


I'm not sure if what you want is possible or not, but the configuration image_previewText is worth a look. As far as I can see is that the config injecting that text as placeholder.

Edit: I saw here someone mentioning to use config.image_previewText = ' '; to address this same issue.

IG




0
0
on 8th Apr

Hi Ivo,

I tested this but because of config.image_previewText =' ' or config.image_previewText: ' ' CKEditor's toolbar not display. But i remove this property then it display properly.

0
0
on 8th Apr

Hi Shaun,

I Just tried with my configuration and it just works fine. Try removing the "config.". This is my configuration:

"toolbarGroups: [
        { name: 'clipboard',   groups: [ 'clipboard', 'undo' ] },
        { name: 'editing',     groups: [ 'find', 'selection', 'spellchecker' ] },
        { name: 'links' },
        { name: 'insert' },
        { name: 'forms' },
        { name: 'tools' },
        { name: 'document',       groups: [ 'mode', 'document', 'doctools' ] },
        { name: 'others' },
        '/',
        { name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] },
        { name: 'paragraph',   groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ] },
        { name: 'styles' },
        { name: 'colors' },
        { name: 'about' }
    ],

    removeButtons: 'Subscript,Superscript',
    format_tags: 'p;h1;h2;h3;pre',
    image_previewText: ' '
"

Here you can see how it looks.


0
0
on 8th Apr

Replying to Ivo Gonçalves' comment on 08 Apr 2021 11:30:59


Hi Ivo,

Your code is working fine but still i can see dummy text in Preview box. 

And if I add this code then my CKEditor not displayed

"toolbarGroups: [
        { name: 'clipboard',   groups: [ 'clipboard', 'undo' ] },
        { name: 'editing',     groups: [ 'find', 'selection', 'spellchecker' ] },
        { name: 'links' },
        { name: 'insert' },
        { name: 'forms' },
        { name: 'tools' },
        { name: 'document',       groups: [ 'mode', 'document', 'doctools' ] },
        { name: 'others' },
        '/',
        { name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] },
        { name: 'paragraph',   groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ] },
        { name: 'styles' },
        { name: 'colors' },
        { name: 'about' }
    ],

    removeButtons: 'Subscript,Superscript',    
    image_previewText: ' '
"

thanks

0
0
11 days ago
Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.