ckeditor installation into drupal with imce

As a professional app developer, I faced to install ckeditor into drupal many times. Each times I need to dig again and again to its working. So, now I think I have to write it down that will help me and others too ūüėČ

Install ckeditor into Drupal with IMCE

Its simple two step > Download & Put it into right place, Configure & use.

Download & Put it into right place

1. Download Drupal module of ckeditor from https://drupal.org/project/ckeditor
2. Download Drupal module for IMCE from https://drupal.org/project/imce
3. Put those module into “sites/all/modules” folder or where you think appropriate
4. Now download full version of ckeditor from http://ckeditor.com/download
5. Put full version of ckeditor into “<path where you put your ckeditor drupal module>/” please visit¬†http://docs.cksource.com/CKEditor_for_Drupal/Open_Source/Drupal_7/Installation for details instruction where to put

That’s it, you are done the first step

Configure & use

Now enable that two module from your Drupal control panel.

1. Fix permission for ckeditor
2. Configure IMCE
3. Configure text format –¬†Administration > Configuration > Content authoring > Text formats
3.a) For Advanced Html >> enable filter “limit allowed html tags” and leave it as it is or put “<a> <p> <div> <h1> <h2> <h3> <img> <hr> <br> <br /> <ul> <ol> <li> <dl> <dt> <dd> <em> <b> <u> <i> <strong> <del> <ins> <sub> <sup> <quote> <blockquote> <pre>” allowed or as your requirement
3.b) For Full Html >> enable filter “limit allowed html tags” and put “<a>¬†<abbr> <acronym> <address> <area> <article> <aside> <audio> <b> <bdo> <bgsound> <big> <blockquote> <br> <br /> <button> <canvas> <caption> <center> <cite> <code> <col> <colgroup> <command> <datalist> <dd> <del> <details> <dfn> <div> <dl> <dt> <em> <fieldset> <figcaption> <figure> <font> <footer> <form> <h1> <h2> <h3> <h4> <h5> <h6> <header> <hgroup> <hr> <hr /> <i> <img> <input> <ins> <kbd> <keygen> <label> <legend> <li> <link> <map> <mark> <marquee> <menu> <meter> <nav> <object> <ol> <optgroup> <option> <output> <p> <param> <pre> <progress> <q> <rp> <rt> <samp> <section> <select> <small> <source> <span> <strong> <sub> <summary> <sup> <table> <tbody> <td> <textarea> <tfoot> <th> <thead> <time> <tr> <tt> <ul> <var> <video> <wbr>” allowed¬†or define tag to allow as your requirement
4. Now configure ckeditor. Specially for file browser settings. Point it to IMCE. Please configure both profile (Full, Advanced)

That’s it. nJoy….

Advertisements