laravel-admin集成ueditor百度編輯器
什麽是ueditor
ueditor是百度開源的一款編輯器,其中它的源代碼模式真的是非常實用的,能讓你更大限度的定制你的內容。
什麽是laravle-admin
Laravle-admin是基於laravle的一個後臺管理包,但其默認編輯器是ckeditor,個人不太喜歡,所以就把它換成ueditor
安裝步驟
- 執行命令如下命令下載安裝插件
composer require "overtrue/laravel-ueditor:~1.0" - 發布配置
php artisan vendor:publish --provider=‘Overtrue\LaravelUEditor\UEditorServiceProvider‘ - 增加laravel-admin組件文件
增加組件文件:app/Admin/Extensions/Form/uEditor.php:<?php
namespace App\Admin\Extensions\Form;
use Encore\Admin\Form\Field;
/**
- 百度編輯器
- Class uEditor
-
@package App\Admin\Extensions\Form
*/
class uEditor extends Field
{
// 定義視圖
protected $view = ‘admin.uEditor‘;// css資源
protected static $css = [];// js資源
public function render()
{
$this->script = <<<EOT
//解決第二次進入加載不出來的問題
UE.delEditor("ueditor");
// 默認id是ueditor
var ue = UE.getEditor(‘ueditor‘, {
// 自定義工具欄
toolbars: [
[‘bold‘, ‘italic‘, ‘underline‘, ‘strikethrough‘, ‘blockquote‘, ‘insertunorderedlist‘, ‘insertorderedlist‘, ‘justifyleft‘, ‘justifycenter‘, ‘justifyright‘, ‘link‘, ‘insertimage‘, ‘source‘, ‘fullscreen‘]
elementPathEnabled: false,
enableContextMenu: false,
autoClearEmptyNode: true,
wordCount: false,
imagePopup: false,
autotypeset: {indent: true, imageBlockLine: ‘center‘}
});
ue.ready(function () {
ue.execCommand(‘serverparam‘, ‘_token‘, ‘{{ csrf_token() }}‘);
});
EOT;
return parent::render();
}
}
4.增加視圖文件: resources/views/admin/uEditor.blade.php
@include(‘vendor.ueditor.assets‘)
<div class="form-group {!! !$errors->has($errorKey) ?: ‘has-error‘ !!}">
<label for="{{$id}}" class="col-sm-2 control-label">{{$label}}</label>
<div class="col-sm-8">@include(‘admin::form.error‘)
br/>@include(‘admin::form.error‘)
<textarea type=‘text/plain‘ style="height:400px;" id=‘ueditor‘ id="{{$id}}" name="{{$name}}" placeholder="{{ $placeholder }}" {!! $attributes !!} class=‘ueditor‘>
{!! old($column, $value) !!}@include(‘admin::form.help-block‘)
br/>@include(‘admin::form.help-block‘)
</div>
5. 然後註冊進laravel-admin,在app/Admin/bootstrap.php中添加以下代碼
use App\Admin\Extensions\Form\uEditor;
use Encore\Admin\Form;
Form::extend(‘ueditor‘, uEditor::class);
6. 調用
$form->ueditor(‘content‘, ‘內容‘)->rules(‘required‘);;
laravel-admin集成ueditor百度編輯器