1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 | <?php defined('BASEPATH') OR exit('No direct script access allowed'); class Berita extends CI_Controller { function index() { $this->load->view('TinyMCE_View'); } function tinymce_upload() { $config['upload_path'] = './LOKASI_IMAGE_AKAN_DISIMPAN/'; $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().'LOKASI_IMAGE_AKAN_DISIMPAN/'.$file['file_name']])) ->_display(); exit; } } } |
Menggunakan View Sebagai Berikut
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 | <script type="text/javascript" src="tinymce/tinymce.min.js"></script> <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("CONTROLLER_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> <textarea rows="25" id="post_content" name="post_content" class="form-control ckeditor"></textarea> |
Apakah anda memerlukan jasa pembuatan website murah dan profesional kami siap membantu anda dengan memberikan pelayanan terbaik.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 | tinymce.jinit({ selector: 'textarea#file-picker', plugins: 'image code', toolbar: 'undo redo | link image | code', /* enable title field in the Image dialog*/ image_title: true, automatic_uploads: true, images_upload_url: '<?php echo base_url("AN_admin/tinymce_upload") ?>', file_picker_types: 'image', paste_data_images: true, relative_urls: false, remove_script_host: false, /* and here's our custom image picker*/ file_picker_callback: (cb, value, meta) => { const input = document.createElement('input'); input.setAttribute('type', 'file'); input.setAttribute('accept', 'image/*'); input.addEventListener('change', (e) => { const file = e.target.files[0]; const reader = new FileReader(); reader.addEventListener('load', () => { const id = 'kepsuk' + (new Date()).getTime(); const blobCache = tinymce.activeEditor.editorUpload.blobCache; const base64 = reader.result.split(',')[1]; const blobInfo = blobCache.create(id, file, base64); blobCache.add(blobInfo); /* call the callback and populate the Title field with the file name */ cb(blobInfo.blobUri(), { title: file.name }); }); reader.readAsDataURL(file); }); input.click(); }, content_style: 'body { font-family:Helvetica,Arial,sans-serif; font-size:16px }' }); |