How to integrate Gutenberg editor in Laravel?

By Lucid Softech IT Solutions | Laravel,  09 May 2019

Gutenberg is the latest user friendly editor that everyone trying to integrate. It gives option to create custom blocks and various types of elements which make your content area more decent and professional.

Gutenberg gives option to add custom blocks for below mentioned sections:

– Text

– Paragraph

– List

– Heading

– Subhead

– Table

– Button

– Classic Block

– Text Columns

– Image

– Cover Image

– Image Gallery

– Audio

– Video

– Embeds

– Shortcodes

– Quotes

– Pullquote

– Verse

– Code

– Preformatted

– Custom HTML

– Custom Layout

– Columns

– Text Columns

– Separator

– Read more

So you can see how amazing the Gutenberg editor is. Now the first question which will come into your mind is “Can we use Gutenberg in Laravel?”

And the answer is YES. Now it’s possible and you can use all these features of Gutenberg in you Laravel application. There is a package available called “Laraberg”. This package will allow you integrate Gutenberg feature in Laravel.

In this blog we have provided instructions to integrate Gutenberg in Laravel.

Similar to any other Laravel package you just to follow 3 steps i.e. Package installation, Vendor configuration and database migration.

Step 1: Using composer you can install the package.

composer require van-ons/laraberg

Step 2: Now configure Vendor, CSS and JS.

php artisan vendor:publish --provider='VanOns\Laraberg\LarabergServiceProvider'

Step 3: Now run the database migration.

php artisan migrate

All the CSS and JS files should be present on the page where you are going to use the editor.

That’s it.

You can check more details about dependencies, Routes, models etc here.