CODEWITHSUNDEEP
javascripthtmlckeditor
B. Azizan
B. Azizan

Reputation: 93

CKEditor removing <html> and <body> tags

I using CKEditor, and if I click the Source button and paste HTML code like below : 

<html>
<head>
<meta http-equiv="Content-Type" content="text/html" />
</head>
<body>
<p>test</p>
</body>
</html>

and click to Source again and then submit the form, the html , head and , body tags are removed and just stays <p>test</p>!

CKEditor configuration: 

CKEDITOR.replace('content', {
            extraPlugins: 'font,panelbutton,colorbutton,colordialog,justify,indentblock,aparat,buyLink',
            autoGrow_onStartup: true,
            enterMode: CKEDITOR.ENTER_BR,
            FullPage : false,
            allowedContent : true,
            ProtectedTags : 'html|head|body'
        });

Can you help me?

Upvotes: 4

Views: 21842

Answers (2)

shivani sharma
shivani sharma

Reputation: 21

Just add this code to prevent editor to remove 'HEAD/BODY/HTML' tags from your source code:-

CKEDITOR.replace( 'editor1', {              
    fullPage: true,
    allowedContent: true,
    autoGrow_onStartup: true,
    enterMode: CKEDITOR.ENTER_BR
});

Upvotes: 1

Anna Tomanek
Anna Tomanek

Reputation: 2239

If you want to edit an entire HTML page, with <html>, <head> and <body> elements, you need to set the config.fullPage option to true:

CKEDITOR.replace( 'content', {
    fullPage: true,
    extraPlugins: 'font,panelbutton,colorbutton,colordialog,justify,indentblock,aparat,buyLink',
    // You may want to disable content filtering because if you use full page mode, you probably
    // want to  freely enter any HTML content in source mode without any limitations.
    allowedContent: true,
    autoGrow_onStartup: true,
    enterMode: CKEDITOR.ENTER_BR
} );

Pay attention to using proper case (fullPage is not FullPage) in your configuration. See also the following resources for more information:

If you want to use the config.autoGrow_onStartup option, you need to include the Auto Grow plugin in your setup.

Last but not least, changing the Enter Mode setting to BR or DIV is not recommended. The default CKEDITOR.ENTER_P mode is fully supported by all editor features and plugins and is also the most correct one in terms of best practices for creating web content.

If you do it to control paragraph spacing, you should use stylesheets instead. Edit the contents.css file and set up a suitable margin value for <p> elements, for example:

p { margin: 0; }

Upvotes: 19

Related Questions