Opencart : How to add Ckeditor for your textarea field

Sharing is caring!

Opencart ( is an open source PHP-based online e-commerce solution that has powerful features and a lot of extension for customization.

Today i would like to share how you can add ckeditor feature to the Catalog > Reviews “Text” field (textarea). This tips you can apply too for your extension development.

Step 1

Open review_form.tpl from ‘/admin/view/template/catalog’

You can find the code where show textarea code:

<td><textarea name="text" cols="60" rows="8"><?php echo $text; ?></textarea>

Add id=”description1″ to the textarea, new updated code is shown as below:

<td><textarea name="text" cols="60" rows="8" id="description1"><?php echo $text; ?></textarea>

Step 2

Put extra code at the bottom before <?php echo $footer; ?>

<script type="text/javascript" src="view/javascript/ckeditor/ckeditor.js"></script>
<script type="text/javascript"><!--
CKEDITOR.replace('description1', {
 filebrowserBrowseUrl: 'index.php?route=common/filemanager&token=<?php echo $token; ?>',
 filebrowserImageBrowseUrl: 'index.php?route=common/filemanager&token=<?php echo $token; ?>',
 filebrowserFlashBrowseUrl: 'index.php?route=common/filemanager&token=<?php echo $token; ?>',
 filebrowserUploadUrl: 'index.php?route=common/filemanager&token=<?php echo $token; ?>',
 filebrowserImageUploadUrl: 'index.php?route=common/filemanager&token=<?php echo $token; ?>',
 filebrowserFlashUploadUrl: 'index.php?route=common/filemanager&token=<?php echo $token; ?>'
<?php echo $footer; ?>

Step 3

Save the file and reload the page, done!

For more my extension, you can go to this LINK. Cheers!

12 thoughts on “Opencart : How to add Ckeditor for your textarea field”

  1. Well i figured it out, admin\view\template\sale\contact.tpl 🙂

    Though its weird, how a script of ckeditor was already there

  2. For me the above is not working. In my development system its ok but not the production ie where i have the live shop. What setting should i check?

  3. Hi, thanks for great tutorial, but it doesn’t work with Open Cart Could you please create a tutorial to port full CkEditor on Open Cart


  4. This guide is working even today for opencart 3+ with minor modifications:
    Step1: open review_form.twig instead of review_form.tpl
    don’t add id=”description1″ there is already the id=”input-text”
    Step2: follow step 2 but change the ‘description1’ with ‘input-text’.
    step3: download the latest version from the official site the ckeditor and upload the files to “admin/view/javascript/ckeditor/’

Leave a Comment

Your email address will not be published. Required fields are marked *