Previously We discussed how to install CKEditor in Laravel. You can click HERE to read the article.
I have already installed CKEditor. Now I would like to upload the image in the textarea by CKEditor.
1. First of all create A route.
Route::post(‘ckeditor/upload’, ‘CkeditorController@upload’)->name(‘ckeditor.upload’);
2. Then create Controller named as CKeditor Controller. In cmd type
Php artisan make:controller CkeditorController
This will make the controller
- now go to the controller and paste this code.
<?PHP
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Http\Requests;
class CkeditorController extends Controller
{
public function index()
{
return view(‘ckeditor’);
}
/**
* success response method.
*
* @return \Illuminate\Http\Response
*/
public function upload(Request $request)
{
if($request->hasFile(‘upload’)) {
$originName = $request->file(‘upload’)->getClientOriginalName();
$fileName = pathinfo($originName, PATHINFO_FILENAME);
$extension = $request->file(‘upload’)->getClientOriginalExtension();
$fileName = $fileName.’_’.time().’.’.$extension;
$request->file(‘upload’)->move(public_path(‘images’), $fileName);
$CKEditorFuncNum = $request->input(‘CKEditorFuncNum’);
$url = asset(‘images/’.$fileName);
$msg = ‘Image uploaded successfully’;
$response = “<script>window.parent.CKEDITOR.tools.callFunction($CKEditorFuncNum, ‘$url’, ‘$msg’)</script>”;
@header(‘Content-type: text/html; charset=utf-8’);
echo $response;
}
}
}
- Now make a folder named images in public folder
- Now you can add this code. In the view file. Below the <textarea>
<script src=”{{ URL::asset(‘ckeditor/ckeditor.js’) }}”></script>
<script type=”text/javascript”>
CKEDITOR.replace(‘editor’, {
filebrowserUploadUrl: “{{route(‘ckeditor.upload’, [‘_token’ => csrf_token() ])}}”,
filebrowserUploadMethod: ‘form’
});
</script>
You will get Upload button then you can choose and insert according to your requirement.