1

My html code gets changed when i switched from design to source view. I pasted the following code

<div>test</div>

But when ichanged to design view and then cme again to source view code changed. Below is the changed code

<p>test</p>

Why the div changed to p Please help me how to fix this..

Improve this question
7
  • What does your CKEditor config look like? Commented Oct 30, 2013 at 6:56
  • Below is my config setting config.removeButtons = 'Underline,Subscript,Superscript'; // Se the most common block elements. config.format_tags = 'p;h1;h2;h3;pre'; // Make dialogs simpler. config.removeDialogTabs = 'image:advanced;link:advanced'; config.extraPlugins = 'strinsert'; config.startupMode = 'source'; config.removePlugins = 'help'; config.extraPlugins = 'stylesheetparser'; config.contentsCss = 'test.css'; Commented Oct 31, 2013 at 9:31
  • Is there any setting in config..? Please suggest thanks Commented Oct 31, 2013 at 9:32
  • 1
    And how do you set the data for CKEditor? Do you load it from a database and place it directly in the HTML during page load, like I did in jsfiddle or do you do it dynamically somehow using setData()? Does the data within the normal non-CKEDITOR textarea look good, meaning that it might be a htmlencoding issue. I first thought it might be an AdvancedContentFilter issue, but if that's your config i doubt it. Still, I strongly recommend trying to set config.allowedContent = true; just to be sure, try that. Do you have a link you could give where I could see the problem? Commented Oct 31, 2013 at 13:17
  • 1
    config.allowedContent = true; seems working Thanks alot for your answers :) Commented Oct 31, 2013 at 13:44

2 Answers 2

Reset to default
6

This was resolved in the comments section.

Advanced Content Filtering (ACF) was preventing DIV elements from entering into the content, it was transforming them into P elements. Setting config.allowedContent = true; solved the issue.

If the ACF should remain turned on to filter other unwanted data, another option would have been to set config.extraAllowedContent = 'div';. This way the ACF still works, but also allows DIV elements.

For more on ACF check out http://docs.ckeditor.com/#!/guide/dev_advanced_content_filter

Improve this answer
Sign up to request clarification or add additional context in comments.

4 Comments

I have my html tags like: <div class='travel_box'><a class='travel_box_link' href='/flights/cheap-flights-to-paris'><img src='//t.x-bit.us/images/portal/9/hexa-images/paris.jpg' alt ='Paris Flights'/><h3>Paris</h3><p>BOOK NOW</p></a></div>
But ckeditor change html code like : <div class="travel_box"> <a class="travel_box_link" href="/flights/cheap-flights-to-london"> <img alt="London" src="//t.x-bit.us/images/portal/9/hexa-images/london.jpg" /> </a> <h3> <a class="travel_box_link" href="/flights/cheap-flights-to-london">London</a> </h3> <a class="travel_box_link" href="/flights/cheap-flights-to-london"> </a> <p><a class="travel_box_link" href="/flights/cheap-flights-to-london">BOOK NOW</a></p> <a class="travel_box_link" href="/flights/cheap-flights-to-london"> </a></div>
I have added allowedContent true but it won't works please help
@shiva Sounds like it's not working or your situation is somehow different - please ask a separate question about that, the comment section is too small to really diagnose properly :)
0

Open Config.js, add this line before the closing curly brace (}):

config.allowedContent = true; config.extraAllowedContent = 'div';
Improve this answer

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.