I am making a discussion forum application in Laravel . Here I want to use Ckeditor in comment sections. When somebody comments, then the code should show like here in stackoverflow.
@if(Auth::check()!=null)
<div class="col-md-6 col-md-offset-3">
<div class="panel panel-default">
<div class="panel panel-body">
<form action="/comment" method="POST">
{{ csrf_field() }}
<input type="hidden" name="user_id" value="{{ Auth::user()->id }}">
<input type="hidden" name="post_id" value="{{ $post->id }}">
<div class="form-group">
<label for="comment">Reply</label>
<textarea name="body" class="form-control" style="size: 200px"></textarea>
</div>
<input type="submit" name="com" id="com" class="btn btn-xs btn-success pull-right">
</form>
</div>
</div>
</div>
@endif
Please give me very simple steps to use ckeditor. My master file is layout.app and this file is comment.blade.php. Please guide me where I should enter what files and scripts files.
You can use laravel CKEditor Package;
How to install: Set up package
composer require unisharp/laravel-ckeditor
Add ServiceProvider
Edit config/app.php
, add the following file to Application Service Providers
section.
Unisharp\Ckeditor\ServiceProvider::class,
Publish the resources
php artisan vendor:publish --tag=ckeditor
Usage Default way (initiate by name or id) :
<script src="/vendor/unisharp/laravel-ckeditor/ckeditor.js"></script>
<script>
CKEDITOR.replace( 'article-ckeditor' );
</script>
Or if you want to initiate by jQuery selector :
<script src="/vendor/unisharp/laravel-ckeditor/ckeditor.js"></script>
<script src="/vendor/unisharp/laravel-ckeditor/adapters/jquery.js"></script>
<script>
$('textarea').ckeditor();
// $('.textarea').ckeditor(); // if class is prefered.
</script>
Example:
@if(Auth::check()!=null)
<div class="col-md-6 col-md-offset-3">
<div class="panel panel-default">
<div class="panel panel-body">
<form action="/comment" method="POST">
{{ csrf_field() }}
<input type="hidden" name="user_id" value="{{ Auth::user()->id }}">
<input type="hidden" name="post_id" value="{{ $post->id }}">
<div class="form-group">
<label for="comment">Reply</label>
<textarea id="editor1" name="body" class="form-control" style="size: 200px"></textarea>
</div>
<input type="submit" name="com" id="com" class="btn btn-xs btn-success pull-right">
</form>
</div>
</div>
</div>
@endif
<script>
$('.editor1').ckeditor(); // if class is prefered.
</script>