strangefate / blogger
用于轻松将博客或新闻文章添加到Laravel项目的处理器
Requires
- php: >=7.1.3
- intervention/image: ^2.4
- laravel/framework: >=5.6.0
- strangefate/commenthandler: >=1.0
This package is auto-updated.
Last update: 2024-09-09 00:17:06 UTC
README
包安装
此模块提供了一些快速模板,用于将博客添加到您的Laravel网站中。它包括对CKEditor的支持,这是一个可以直接将图片附加到您的帖子上的所见即所得编辑器。CKEditor需要Vue.js,但您可以根据需要自定义项目以排除它。如果您不想使用CKEditor,还有一个简化的编辑器,它包含一个基本的文本编辑器。
依赖包
composer require strangefate/blogger
运行迁移以将所需的评论、点赞和报告表添加到数据库中
php artisan migrate
您可以将配置文件公开以覆盖一些基本配置,包括文章模型的slug。
php artisan vendor:publish --provider=StrangeFate\Blogger\BloggerServiceProvider --tag=config
CKEditor (所见即所得)
要使用CKEditor,运行此Artisan命令,它将自动化大部分安装过程。
php artisan blogeditor:install
这将通过npm安装Vue CKEditor模块并添加大多数所需模块。您仍然需要添加一个javascript处理器来上传附加到或拖到编辑器中的图片。为此,向默认Vue实例添加一个方法,指定图片上传表单的路径。
import CustomUploadAdapter from './classes/ckeditor-upload-adapter-class'; //added by blogeditor:install
const app = new Vue({
el: '#app',
mounted() {},
// This code will be inserted into your app.js file. Customize this code for your project. You can make as many of these modules as needed for your project.
methods: {
CustomUploadAdapterPlugin( editor ) {
editor.plugins.get( 'FileRepository' ).createUploadAdapter = ( loader ) => {
loader.uploadUrl = '/api/posts/editorimages';
return new CustomUploadAdapter( loader );
}
}
},
//end required code.
});
由于CKEditor使用HTML标签,您可能不想使用blades {{}} 清洁器。Blogger有自己的清洁方法来删除代码。您可以通过在发布后编辑 config\blogger.php 中的 safe_tags 数组来指定项目中可以保留的标签。
'sanitizer' => [
'safe_tags' => [
'pre','b','em','u','ul','li','ol','p','br','tt','hr','i','table','tr','th','td',
]
],
Blogger还会调整上传图片的大小以节省文件空间。您可以在Blogger配置文件中自定义图片的最大尺寸。
'social' => [
'height' => 601,
'width' => 1147,
],
路由和控制器
现在您需要为项目设置路由和控制器。由于围绕博客的多种支持案例(主要是授权),默认情况下不会执行这些操作。Blogger确实有一些快速且易于使用的Controller类,您可以使用它们来加速此过程。建议您创建一个新控制器并继承这些类,根据需要覆盖方法。
web.php
Route::resource('/posts', 'PostController');
Route::post('/posts/{post}/comment', 'PostController@comment');
Route::post('/posts/{post}/like', 'PostController@like');
Route::get('/posts/{post}/image', 'PostController@image');
php artisan make:controller PostController
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use StrangeFate\Blogger\Controllers\BloggerPostWithEditorController; //BloggerPostController without CKEdit
class PostController extends BloggerPostWithEditorController //BloggerPostController without CKEdit
{
public function __construct() {
$this->middleware('auth')->except(['index','show', 'image']);
}
}
对于CKEditor模块,还有一个基于API的控制器来处理图片上传。像前面的示例一样,您应该创建一个新控制器并继承CKEditorImageUploadController。api.php
Route::post('/posts/images', 'api\PostImageController@image_upload'); //single image upload (ImageSelector.vue)
Route::post('/posts/editorimages', 'api\PostImageController@editor_image_upload'); //CKeditor Image. This URL should match what you put in for the loader.uploadUrl in the app.js module.
php artisan make:controller api\PostImageController
<?php
namespace App\Http\Controllers\api;
use Illuminate\Http\Request;
use StrangeFate\Blogger\Controllers\CKEditorImageUploadController;
class PostImageController extends CKEditorImageUploadController {
public function __construct() {
$this->middleware(['auth:api']);
}
}
视图
此项目有可快速定制的视图,以便快速定制您的解决方案。您很可能需要覆盖它们。为此,将视图发布到您的项目并格式化为所需格式。
php artisan vendor:publish --provider=StrangeFate\Blogger\BloggerServiceProvider --tag=views
视图
@include('blogger::index') {{-- Index layout for base overview --}}
@include('blogger::card') {{-- Basic card layout for index view --}}
@include('blogger::create') {{-- Create form with image upload --}}
@include('blogger::ck_create') {{-- Create form with text editor and image picker --}}
@include('blogger::edit') {{-- Create form with image upload --}}
@include('blogger::ck_edit') {{-- Edit form with text editor and image picker --}}
@include('blogger::show') {{-- Article view --}}
@include('blogger::templates.text-editors') {{-- Note to be used. Example text editors. --}}
评论
Blogger使用 strangefate\commenthandler 来处理帖子评论和点赞,并且将自动与本项目一起拉入。请查阅评论处理器的文档以获取更多配置详细信息。