CkEditor text align : left plugin = style='text-align:left'

Question

Hello I am using Ckeditor 4.5.10, I am facing an issue with internal left align plugin. Default left align just remove style attribute from selected tag. What I need, it should be like this <p style='text-align:left'>test</p> however it is doing like this <p>test</p>

if someone can help me for this thing

Answer 1

Please replace this function inside ckeditor.js and inline text align left start working:-

 g.prototype = {
                        exec: function(a) {
                            var c = a.getSelection(),
                                b = a.config.enterMode;
                            if (c) {
                                for (var h = c.createBookmarks(), d = c.getRanges(), e = this.cssClassName, g, f, k = a.config.useComputedState, k = void 0 === k || k, m = d.length - 1; 0 <= m; m--)
                                    for (g = d[m].createIterator(), g.enlargeBr = b != CKEDITOR.ENTER_BR; f = g.getNextParagraph(b == CKEDITOR.ENTER_P ? "p" : "div");)
                                        if (!f.isReadOnly()) {
                                            f.removeAttribute("align");
                                            f.removeStyle("text-align");                                       
 f.setStyle("text-align", this.value);

                                            //console.log(this.value);
                                            var l = e && (f.$.className = CKEDITOR.tools.ltrim(f.$.className.replace(this.cssClassRegex, ""))),
                                                p = this.state == CKEDITOR.TRISTATE_OFF && (!k || n(f, !0) != this.value);
                                            e ? p ? f.addClass(e) : l || f.removeAttribute("class") : p && f.setStyle("text-align", this.value)
                                        }
                                a.focus();
                                a.forceNextSelectionCheck();
                                c.selectBookmarks(h)
                            }
                        },
                        refresh: function(a, c) {
                            var b = c.block || c.blockLimit;
                            this.setState("body" != b.getName() && n(b, this.editor.config.useComputedState) == this.value ? CKEDITOR.TRISTATE_ON : CKEDITOR.TRISTATE_OFF)
                        }
                    };

I have included this line in above function:- f.setStyle("text-align", this.value);

Answer 2

I had the same problem with CKEditor4. I managed to solve it by using a custom build. First of all, you have to be familiar with CKEditor4 custom build process. If you are, you can continue, if not, it is highly recommended to follow the instruction:

The development repository of CKEditor 4

If you are here, it means that you are familiar with the custom build process of CKEditor4. In order to address this problem, we should modify the Justify plugin. You have to edit the file in plugins/justify/plugin.js path, and replace

} else if ( apply && isAllowedTextAlign ) {

With

} else {

In other words, you have to get rid of the condition of setting the text-align CSS style.