CKEditor delete Format combobox - ckeditor

When I delete the Format combobox in toolbar, CKEditor deletes my own formatting.
I would like to use formatting as separate buttons. Is that even possible?

CKEditor by default has some filter rules, which prevent of having trash in output HTML.
When you add a plugin, then such plugin usually register set of rules which are necessary for its work. E.g. When you add an image plugin then <img> tags starts to be allowed in editor contents.
So when you remove formatting plugin, then most probably you also remove those filtering rules. That's why your formatting is removed from the editor. You can add your own custom rules with: extraAllowedContent.
I don't know how are you going to add separate buttons with formatting, but in case of creating your own plugin you can also register proper filter rules inside your plugin code.

Related

Work in 'source mode' but enable toolbar buttons

I am building a simple forum on my website using CKEditor as a BBCode editor. I managed to make CKEditor output BBCode just fine by following the example.
However, I do not want to use the 'WYSIWYG' interface. I just want a plain "bbcode source" editor. The WYSIWYG output is not exactly the same as how the output will look on my forum (because I translate the bbcode to html myself and then apply some additional styling) and I don't really like the difference. More importantly, I have a couple "custom bbcode" tags that make no sense outside of my forum and obviously CKEditor doesn't know what to do with them, so I get a mix of bbcode and WYSIWYG output which looks odd.
I can force the CKEditor into 'source mode' by setting the startupMode and removing the source button, but when I do that it disables the entire toolbar!
I want to work in source mode, but still use the various buttons like B, I, etc. When such a button is pressed I just want it to insert the [b] [/b] tags for example around the selected text.
This is pretty much how every forum I've ever seen works, but I can't figure out how to configure CKEditor to do this.
Unfortunately it's impossible. Most of the plugins require WYSIWYG mode and don't work without it.
However you could try to control the output of the editor and change it according to your needs by adjusting editor's filter or implementing custom data processor.

CKEditor -- Use Custom Style Sheet with Editor

I have been trying to work out how to get my own website's custom stylesheet to be recognized by CKEditor. The fontsize on my site is 19px, and for CKEditor it's much smaller. I would like the software to recognize my styles. I don't need (at the moment) custom styles added to dropdowns (and I see information in the docs on how to do that). It just seems odd that if my whole site uses a specific font, font size, font color, and so on that the editor doesn't seem to recognize them. This may be basic, and I've just looked past it or misunderstood something, but I can't figure it out. Thanks!
You may want to look at the contents.css (file is inside CKEditor folder), that is the stylesheet used for content inside the CKEditor. You will need to change the contents.css according to your need, in this case you want to change the font styling so it match with your current site.

Font-awesome codes overrided by toggle editor

I am editing an article and adding FontAwesome in it using Toggle Editor. I've found out that when I add the code using programmer view, it works fine. However, when I change to the designer view from the programmer view, the editor automatically edit the code like this:
Before:
After clicking "Toggle Editor":
It is quite inconvenient for me because I use the designer view to style the article frequently. Is there any solution for it?
You'll have to look into the allowed tags for the editor you're using.
In your case using JCK Editor - you can see this article on why it removes certain code
At first glance it appears there are whitelist & blacklists for some HTML. You'll probably be able to add your selectors to the whitelist and they will no longer get stripped.

I want to hide ckeditor toolbar without removing it

I want to hide ckeditor toolbar without removing it, so that I can keep using the plugins (math).
Something like set visible false.
what I did id check the generated code add make css hide the class for the header
.cke_top{display:none;}
Or
.cke_top{Visibility:hidden;}

ckeditor image plugin fine configuration

It is possible to configure image plugin dialog to change defaults (for example, change alignment from to right, HSpace to some value, etc) without actually changing javascript code of the plugin?
The cmbAlign select is in the image.js and seems to be in some long and nested object structure, specifying UI.
What is the right place to introduce the change?
You should take a look at the CKEditor Javascript API which allows you to modify the editor without having to change the original javascript code, see
http://docs.cksource.com/ckeditor_api/index.html

Resources