This tutorial, We will learn how to use wysiwyg html editor on codeigniter framework with Responsive Filemanager. TinyMCE is editor provide the html code automatically. The Responsive filemanager is a free open-source file manager and image manager that offers a nice way to upload and insert files, images and videos. In this scenario we combine the TinyMCE and Responsive filemanager on codeigniter framework. The responsive filemanager is provide default CRUD operation, we don’t need to write any code for CRUD operation perform on image. for tutorial we need download codeigniter framework and responsive filemanager plugin from official website.

1. Paste the 'filemanager' folder where you want in your codeigniter root folder.
2. Create a folder for your uploaded files and give it write full permission.
3. Open filemanager/config/config.php and edit the settings for path like base URL.
4. Great! Your work is finished!

Copy tinymce/plugins/responsivefilemanager folder to tinymce/plugins/ in your root folder

Settings of tinymce should be like this

            	<script src="<?= base_url("Assets/tinymce/js/tinymce/tinymce.min.js"); ?>"></script>
              	<script>
              tinymce.init({
                selector: "textarea",theme: "modern",height: 500,
                relative_urls : false,
                remove_script_host : false,
                convert_urls : false,
                  codesample_languages: [
                    {text: 'HTML/XML', value: 'markup'},
                    {text: 'JavaScript', value: 'javascript'},
                    {text: 'CSS', value: 'css'},
                    {text: 'PHP', value: 'php'},
                    {text: 'Ruby', value: 'ruby'},
                    {text: 'Python', value: 'python'},
                    {text: 'Java', value: 'java'},
                    {text: 'C', value: 'c'},
                    {text: 'C#', value: 'csharp'},
                    {text: 'C++', value: 'cpp'}
                ],
                plugins: [
                     "advlist autolink link image lists charmap print preview hr anchor pagebreak",
                     "searchreplace wordcount visualblocks visualchars insertdatetime media nonbreaking codesample",
                     "table contextmenu directionality emoticons paste textcolor responsivefilemanager code "
               ],
               toolbar1: "undo redo | bold italic underline | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | styleselect",
               toolbar2: "| responsivefilemanager | link unlink anchor | codesample image media | forecolor backcolor  | print preview code ",
               image_advtab: true ,
               
               external_filemanager_path:"<?php echo base_url(); ?>filemanager/",
               filemanager_title:"Responsive Filemanager" ,
               external_plugins: { "filemanager" : "<?php echo base_url(); ?>filemanager/plugin.min.js"}
             });
            </script>