jd-dotlogics / laravel-grapesjs
A package to easily integrate GrapesJS into your laravel proejct.
Installs: 18 721
Dependents: 0
Suggesters: 0
Security: 0
Stars: 0
Watchers: 0
Forks: 55
Language:JavaScript
Requires
- php: ^7.4|^8.0
- illuminate/support: >=5.6.0
- 3.x-dev
- 3.4.1
- 3.4.0
- 3.3.0
- 3.2.6
- 3.2.5
- 3.2.4
- 3.2.3
- 3.2.2
- 3.2.1
- 3.2.0
- 3.1.0
- 3.0.0
- 2.x-dev
- 2.3.1
- 2.3.0
- 2.2.0
- 2.1.0
- 2.0.12
- 2.0.11
- 2.0.10
- 2.0.9
- 2.0.8
- 2.0.7
- 2.0.6
- 2.0.5
- 2.0.4
- 2.0.3
- 2.0.2
- 2.0.1
- 2.0.0
- 1.x-dev
- 1.0.11
- 1.0.10
- 1.0.9
- 1.0.8
- 1.0.7
- 1.0.6
- 1.0.5
- 1.0.4
- 1.0.3
- 1.0.2
- 1.0.1
- 1.0.0
- 0.1.0.x-dev
- 0.1.0
- dev-master
This package is auto-updated.
Last update: 2025-04-06 08:47:56 UTC
README
This package provide an esay way to integrate GrapesJS into your laravel proejct.
Installation
composer require jd-dotlogics/laravel-grapesjs
Publish files & migrate
php artisan vendor:publish --tag="laravel-grapesjs"
php artisan migrate
Getting started
-
Add 'gjs_data' column to the model's database table (e.g Page), for which you are going to use the editor.
-
Implement Editable Interface and use the EditableTrait trait for the Model class
use Illuminate\Database\Eloquent\Model; use Dotlogics\Grapesjs\App\Traits\EditableTrait; use Dotlogics\Grapesjs\App\Contracts\Editable; class Page extends Model implements Editable { use EditableTrait; ... }
- Next Create a Route for editor
Route::get('pages/{page}/editor', 'PageController@editor');
- In your controller, use the EditorTrait and add the editor method
<?php namespace App\Http\Controllers; use App\Models\Page; use Illuminate\Http\Request; use Dotlogics\Grapesjs\App\Traits\EditorTrait; class PageController extends Controller { use EditorTrait; ... public function editor(Request $request, Page $page) { return $this->show_gjs_editor($request, $page); } ... }
- Open this route /pages/:page_id/editor (where the :page_id is the id of your model)
Placeholders
Placeholders are like short-code in wordpress. The synax of placeholder is
[[This-Is-Placeholder]]
Create a file named "this-is-placeholder.blade.php" in "/resources/views/vendor/laravel-grapesjs/placeholders" directory.
The the placeholder will be replaced by the content of the relative blade file "this-is-placeholder.blade.php"
Templates
You can create global templates (or blocks) in the "/resources/views/vendor/laravel-grapesjs/templates" directory. And the templates/blocks will be availabe in the block section of edittor. You can also create model specific templates/blocks by defining getTemplatesPath/getGjsBlocksPath in model
public function getTemplatesPath(){ return 'pages_templates'; }
This will look for templates under "laravel-grapesj::pages_templates" directory.
You can also return null from these methods to hide templates/blocks for any model.
Display output
The "Editable" model (e.g. Page) will have two public properties, css and html. In your blade file you can use these properties to display the content.
<style type="text/css"> {!! $page->css !!} </style> {!! $page->html !!}
Thank you for using.