How to install CKEditor plugins in Q2A?

Question

I appreciate the help of @pupi1985 for giving a light on the plugin source of ckeditor

See: http://www.question2answer.org/qa/66191/how-can-i-activate-the-html-source-plugin-in-ckeditor-4

ckeditor 4 has many add-ons and batteries that can theoretically add functions to the default editor if q2a.

See: https://ckeditor.com/cke4/addons/plugins/all

When you download the add-on they make it seem very easy to do but it's not like that. They say that I follow these two steps but the truth is that it's not that simple

Is there any step-by-step method for the editor (wysiwyg-editor) in which we can install this plugins? Since it is not as they say on the ckeditor page.

Could someone write a tutorial on how to install add-ons?

Answer 1

The other approach would be using the builder. I faced some issues using it but it may work for you. It will also upgrade your CKEditor. So you can't just install a plugin this way without getting the latest 4.x version of CKEditor at the same time.

1. Navigate to https://ckeditor.com/cke4/builder
2. Click on Upload build-config.js
3. Upload the file qa-plugin/wysiwyg-editor/ckeditor/build-config.js
4. Select the plugins, theme and languages you'd like to have included in your CKEditor
5. Download the Optimized version of CKEditor
6. Backup and delete the qa-plugin/wysiwyg-editor/ckeditor/ directory
7. Decompress the downloaded CKEditor .zip file and move the ckeditor directory into qa-plugin/wysiwyg-editor/
8. Copy ckeditor/contents-custom.css from the Q2A CKEditor and paste it inside the new ckeditor directory
9. Theoretically, you should merge the files ckeditor/styles.js and ckeditor/config.js from the Q2A CKEditor and the new one. If you don't know the word merge then plan B would be to replace those files in the new CKEditor with the ones from the Q2A CKEditor
10. Make sure the directory and subdirectories have the appropriate file permissions for your web server to make use of them
11. Navigate to a question page (or any with a WYSIWYG editor) and clear the browser's cache and refresh the page. In Chrome (and most browsers), you can do this by hitting F12 and then pressing CTRL+SHIFT+R

Comments

you have reason, in fact, it works. just that for example attach image does not work for me. It says that server problems. when attaching image some yes and others do not work. and the permissions on it I have no idea. I read that 0700 but in what folder? I know this is another question but as you indicate it is another way.

---

The most flexible permission is 777. If it doesn't work with that it just won't. I believe there is some kind of backwards incompatible change in CKEditor 4.9 or 4.10 which would require the Q2A code to be updated to support it.

---

Thanks for the information. Please take this for version 1.9 that I read there will have to leave ...

---

If this PR gets merged https://github.com/q2a/question2answer/pull/658/files then you will be able to follow these steps in Q2A 1.8.1 :)

If you are impatient, you could download the bugfix branch from GitHub ( https://github.com/q2a/question2answer/archive/40f15d44a49a21d7640e31c36e2facb1c74c4c06.zip ), install a new CKEditor plugin following the steps in my answer and then apply the fix in PR 658.

I bet that should fix the image issue.

---

Interesting. I followed these steps, cleared browser's cache. But I still have my old editor. I checked everything twice. The files were updated. But no effect.

UPDATE:  I applied config.js from CKEditor and now it works.

Answer 2

After installing plugins you may need to enable some functions in config.js for the plugin to take effect. Some plugins need to install some dependent plugins too. It's very easy.

Comments

If it's so easy, why do not you dare to do a little tutorial?
if the answer to activate the sorucehtml plugin is not so easy