WYSIWYGエディターの導入

コンポーザーインストール

 

$ composer require unisharp/laravel-ckeditor

 

登録    config/app.php

Unisharp\Ckeditor\ServiceProvider::class,

設定ファイル作成

$ php artisan vendor:publish –tag=ckeditor

 

使い方

使いたいフォームのbladeで以下のテキストエリアを準備

<div class=”form-group”>
{!! Form::label(‘contents’, ‘本文:’) !!}
{!! Form::textarea(‘contents’, null , [‘class’ => ‘form-control’ , ‘id’ => ‘contents’]) !!}
</div>

 

ブレードのケツにJavaScriptをたしてレイアウトブレードに反映させます。

@section(‘js’)
<script src=”{{ url(‘../vendor/unisharp/laravel-ckeditor/ckeditor.js’) }}”></script>
<script>
CKEDITOR.replace(‘contents’,{
extraPlugins:’codesnippet’,
codeSnippet_theme:’dark’,
height:’370px’,
//removeButtons:’Unlink,Anchor, NewPage,DocProps,Preview,Print,Templates,Cut,Copy,Paste,PasteText,PasteFromWord,Undo,Redo,Find,Replace,SelectAll,Scayt,RemoveFormat,Outdent,Indent,Blockquote,Styles,About’
});
</script>
@endsection

レイアウトブレード側フッターの直前に以下を記入

@yield(‘js’)

読み込むJavaScriptがvender内にある時、venderフォルダーに.haccessでdenyかけてるとJavaScriptの読み込みができないので注意。

 

表示するときはデリミタを{{~~~}}からエスケープしない{‼~~~!!}へ変更すること。

 

参考サイト

https://note.com/nanas0100/n/nbc42dc6dd85a

https://qiita.com/qwe001/items/9a86839db4da5a7ab763

https://liberty-dock.com/business_post/53058/

 

 

画像のアップロード、貼り付けのやり方。

はて、どれにするかな?

Laravel のFile Manegerとドッキング

参考サイト

https://www.webopixel.net/php/1264.html

インストールでつまづくところの解説
https://sharediary.net/2019/04/17/laravel-filemanager-%E5%B0%8E%E5%85%A5/

 

KCfinderを使うやり方

参考サイト

https://pon6.com/memo/memoShow?id=33

 

ckeditorの機能拡張するやり方

参考サイト

https://www.ryotaku.com/entry/2019/07/11/003721#%E3%83%89%E3%83%A9%E3%83%83%E3%82%AF%E3%83%89%E3%83%AD%E3%83%83%E3%83%97%E3%81%A7%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB%E3%82%A2%E3%83%83%E3%83%97%E3%83%AD%E3%83%BC%E3%83%89uploadfile