CKEditor alters content - ckeditor

When I save my content, it changes things that I don't want to be changed. How can I make it so it would just save my content without changing anything?
Content before saving:
<a anything</a>
After save, the above example becomes:
<a a="" anything=""> </a>
I'm trying to find a config option that would make it so when I save my content, it would save it just as it is - without adding anything of its own.

This <a anything</a> is not a valid HTML and CKEditor works only with a valid HTML. So once you try to load this content into CKEditor it (or the browser) tries to fix it.
Quoting CKEditor basic concepts:
CKEditor is not a tool that will let you input invalid HTML code. CKEditor abides by W3C standards so it will modify code if it is invalid.

Related

CKEDITOR extra html tag when paste from word

I have blog page in my website and website try to write content with CKEDITOR and copy it from word but when the content publiched, the html have too many extra tag that the are not useful.
how can we filter and delete extra tag and just save main html tag for blog page
thank you
As you did not provide any code sample, its hard to find out your problem. From my understanding I am writing this answer. Hope this will help.
When you save the text from the CKEDITOR fields, it saves text and HTML tags as well. So while viewing the saved texts, you can use the Laravel blade engine print function like this.
{!! $variale->field_name !!}
It will remove the HTML tags and only the text will be shown.

Deled special tgas inckeditor

I have this line in code into a longtext field in ckeditor:
<div style="width:100%"> <canvas id="canvas3"></canvas></div>
but when I save then delete and replace by:
<div style="width:100%"> </div>
so delete all: I use to show graphics. Any idea to solved it?
Thanks
You need to add config.extraAllowedContent = 'canvas[*]{*}(*)'; inside your config.js. Basically none of existing plugins has reported canvas element to Advanced Content Filter (ACF) thus they get removed. This filter lets you decide what tags, attributes, styles and classes can be used inside the editor.
Once you add this, please simply switch to source mode. If canvas are there it means CKEditor is fixed and it no longer removes that tag. If the tag, despite being in editor, still isn't saved in your data base, please check your server-side code for potential HTML filters.
If you wish learn more about ACF, please see:
https://docs.ckeditor.com/ckeditor4/latest/guide/dev_acf.html
https://docs.ckeditor.com/ckeditor4/latest/guide/dev_advanced_content_filter.html
https://ckeditor.com/docs/ckeditor4/latest/guide/dev_disallowed_content.html
https://ckeditor.com/docs/ckeditor4/latest/api/CKEDITOR_config.html#cfg-allowedContent
https://ckeditor.com/docs/ckeditor4/latest/api/CKEDITOR_config.html#cfg-extraAllowedContent
https://ckeditor.com/docs/ckeditor4/latest/api/CKEDITOR_config.html#cfg-disallowedContent
https://ckeditor.com/docs/ckeditor4/latest/api/CKEDITOR_filter.html#method-addTransformations

How to add more html to sweetalert after html to content update?

I saw previously you could edit the html portion of the sweetalert, but now that has been changed to content instead of doing raw html. Is there a way to go back to using html or another way of adding in an input. I saw in another post that it may be better to just use a modal instead.
https://github.com/sweetalert2/sweetalert2/issues/451 here is the guide with the html.
You are using SweetAlert2.
The plain HTML option still exists.
This is used as follows:
swal({
title: 'Title',
html: 'A custom <span style="color: #F8BB86">html<span> message.'
});
Javascript Sweet Alert and html link inside text

CKEditor HTML Autocorrection Issue

I have few lines of HTML in my database. I want to edit the content in CKEditor. But when I open that in editor the HTML gets break down. The HTML gets rearranged.
Below is the HTML which is in database:
<span class="sec_title">
<h1><span>Web</span> Engineering</h1>
<hr>
</span>
And when I open it in CKEditor the HTML looks likes below:
<h1><span class="sec_title"><span>Web</span> Engineering</span></h1>
<hr />
Some one please help me. I tried config.allowedContent = true; but it is also not stopping the CKEditor to do the modifications.
CKEditor works with a valid HTML only and <h1> is not a valid content of <span>. Quoting CKEditor basic concepts:
CKEditor is not a tool that will let you input invalid HTML code. CKEditor abides by W3C standards so it will modify code if it is invalid.

Insert HTML codes in CKEditor textarea

I would like to know if there is a plugin in order to insert HTML codes in a CKEditor textarea?
I tried to install the PBCKCode plugin but it doens't work because the HTML is executed in my textarea.
Anthony
EDIT1 ----- INSERTPRE Plugin -------
Query when I add the post :
INSERT INTO `Posts` (`slug`,`title`,`thumbnail`,`content`,`tags`,`state`,`click`,`createdAt`,`updatedAt`,`id`) VALUES ('dsq','dsq','http://4.bp.blogspot.com/-knCgLUMOkJc/TeMY2jkmACI/AAAAAAAAAV0/VByHmoMa2N8/s1600/first+blog+posting.jpg','<pre class="prettyprint">\r\n<div>toto</div></pre>\r\n\r\n<p>dqsdqs</p>\r\n','toto','0',0,'2013-04-30 12:15:46','2013-04-30 12:15:46',NULL);
The result in my textarea when I try to edit the post :
<pre class="prettyprint">
</pre>
<div>toto</div>
<p>dqsdqs</p>
As you can see the "div" have changed of place.
EDIT2 ----- Escape HTML -------
Screenshot : http://grab.by/m8bs
As you can see it works in a P tag (just above the slug) but it doesn't work in my textarea. I think CKEditor encode my content but I don't know when and why... In my database everything is ok, I have the codes into the PRE tag.
Check these two plugins:
http://ckeditor.com/addon/insertpre
http://ckeditor.com/addon/syntaxhighlight
We use the first one on http://ckeditor.com/forum and it works very well.
Update: That's because you're not encoding HTML before you pass it to textarea. Use htmlspecialchars (or other similar function if you're not using PHP) to do that.
Update2: You are doing something wrong, but I don't know on what stage. The output data (editor.getData()) from the editor with one <pre> element is:
<pre class="prettyprint"><div></pre>
See that <pre> is not encoded, but <div> inside it is. Your examples show me that you "flattened" that structure - you have encoded both things equally when it should be:
<pre class="prettyprint">&lt;div&gt;</pre>
Note: &lt; is an encoded <.
You can use source menu in ck editor header to add your html
Use this tutorial
demo link
Okay Try This
for added Post
addslashes($_POST['post_from_textarea']);
to Edit
stripslashes($yourvairablegetRowsQuery)

Resources