添加富文本框以及图片灯箱

laravel-admin添加富文本框以及图片灯箱 方式如下

添加富文本框

安装

// laravel-admin 1.x
composer require "laravel-admin-ext/wang-editor:1.*"

// laravel-admin 2.x
composer require laravel-admin-ext/wang-editor

然后

php artisan vendor:publish --tag=laravel-admin-wangEditor

配置

config/admin.php文件的extensions,加上属于这个扩展的一些配置

'extensions' => [

        'wang-editor' => [
        
            // 如果要关掉这个扩展,设置为false
            'enable' => true,
            
            // 编辑器的配置
            'config' => [
                
            ]
        ]
    ]

编辑器的配置可以到wangEditor文档找到,比如配置上传图片的地址上传图片

'config' => [
        // `/upload`接口用来上传文件,上传逻辑要自己实现,可参考下面的`上传图片`
        'uploadImgServer' => '/upload'
    ]

使用

在form表单中使用它:

$form->editor('content');

报错

Field type [editor] does not exist.

修改app\Admin\bootstrap.php

Encore\Admin\Form::forget(['map', 'editor']);
改为
Encore\Admin\Form::forget(['map']);

结束上图

可能删除’editor’也不能生效,就是第一次生效了后来我又加上看报错提示是什么,再删除就不管用了,php artisan config:cache清除缓存,重启服务器,php等都不管用,只能重新composer一下,在删除才可以。

添加图片灯箱

安装

composer require laravel-admin-ext/grid-lightbox

然后

php artisan vendor:publish --tag=laravel-admin-grid-lightbox

配置

'extensions' => [

        'grid-lightbox' => [
        
            // Set to `false` if you want to disable this extension
            'enable' => true,
        ]
    ]

使用

// simple lightbox
$grid->colunm('cover')->lightbox();

//gallery
$grid->colunm()->gallery();

//zoom effect
$grid->colunm()->lightbox(['zooming' => true]);
$grid->colunm()->gallery(['zooming' => true]);

//width & height properties
$grid->colunm()->lightbox(['width' => 50, 'height' => 50]);
$grid->colunm()->gallery(['width' => 50, 'height' => 50]);

//img class properties
$grid->colunm()->lightbox(['class' => 'rounded']);
$grid->colunm()->gallery(['class' => ['circle', 'thumbnail']]);
0 评论
内联反馈
查看所有评论