Berikut merupakan cara mengimplementasikan fitur upload image pada TinyMCe ke CodeIgniter
Buat Controller untuk mengupload file di dalam folder Controller aplikasi anda.
Note : saya menamakan controllernya Tinymce.php
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class Tinymce extends CI_Controller {
function tinymce_upload() {
$config['upload_path'] = './uploadResource/Subimg/';
$config['allowed_types'] = 'jpg|png|jpeg';
$config['max_size'] = 0;
$this->load->library('upload', $config);
if ( ! $this->upload->do_upload('file')) {
$this->output->set_header('HTTP/1.0 500 Server Error');
exit;
} else {
$file = $this->upload->data();
$this->output
->set_content_type('application/json', 'utf-8')
->set_output(json_encode(['location' => base_url().'uploadResource/Subimg/'.$file['file_name']]))
->_display();
exit;
}
}
}
Copy script berikut pada halaman "view" dimana anda ingin menggunakan fitur upload
<script type="text/javascript">
tinymce.init({
selector: "#post_content",
plugins: [
"advlist autolink lists link image charmap print preview hr anchor pagebreak",
"searchreplace wordcount visualblocks visualchars code fullscreen",
"insertdatetime nonbreaking save table contextmenu directionality",
"emoticons template paste textcolor colorpicker textpattern"
],
toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image responsivefilemanager",
automatic_uploads: true,
image_advtab: true,
images_upload_url: "<?php echo base_url("Tinymce/tinymce_upload")?>",
file_picker_types: 'image',
paste_data_images:true,
relative_urls: false,
remove_script_host: false,
file_picker_callback: function(cb, value, meta) {
var input = document.createElement('input');
input.setAttribute('type', 'file');
input.setAttribute('accept', 'image/*');
input.onchange = function() {
var file = this.files[0];
var reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = function () {
var id = 'post-image-' + (new Date()).getTime();
var blobCache = tinymce.activeEditor.editorUpload.blobCache;
var blobInfo = blobCache.create(id, file, reader.result);
blobCache.add(blobInfo);
cb(blobInfo.blobUri(), { title: file.name });
};
};
input.click();
}
});
</script>
Semoga bermanfaat
sumber : https://mahfudivanpatoni.blogspot.com/2017/10/upload-image-pada-texteditor-tinymce-codeigniter.html
