Skip to content

FlusherDock1/Gutenberg

Repository files navigation

Gutenberg for OctoberCMS

Gutenberg is a rich-text visual editor from WordPress, with the features of bulidng content with blocks. With Gutenberg, you can create truly unique content for your website by simply dragging and dropping blocks.

You can test it online here Gutenberg playground.

This plugin allows you to embed Gutenberg in the backend form of your own model by creating Polymorph relation .

PLUGIN CURRENTLY IN BETA ALSO AS LARABERG.

Integration of Laraberg by VanOns\Laraberg for OctoberCMS. All credits goes to VanOns.

All current block are from standart Gutenberg.js package. None of them are custom or from Laraberg. You can find all this blocks at Gutenberg playground and test them there.

Working:

  • Common blocks
    • Paragraph - (All text formating also works).
    • Image (only by link, file upload not working)
    • Heading
    • Audio (only by link, file upload not working)
    • List
    • Quote
    • Video (only by link, file upload not working)
  • Formatting
    • Code
    • Preformatted
    • Pull quote
    • Classic
    • Custom HTML
    • Table
    • Verse
  • Layout elements
    • Columns
    • Button
    • Separator
    • Spacer
  • Embeds
    • All embeds (only by links)
  • Code preview and all standart features such as: custom styles, block settings – are also working.

Not working:

  • Inline elements
    • Inline image (Because of not implemented native Mediauploader)
  • Common blocks
    • Gallery (Because of not implemented native Mediauploader)
    • Cover (Because of not implemented native Mediauploader)
    • File (Because of not implemented native Mediauploader)
  • Layout elements
    • Media & text (Because of not implemented native Mediauploader)
    • Page break (Standart WordPress feature. Will be removed in next updates)
    • More (Standart WordPress feature. Will be removed in next updates)
  • Widgets
    • All of them not working (They are standart WordPress widgets. They will be removed in next updates)

In work:

  • Mediauploader with native OctoberCMS Medialibrary

I will be happy if you help me with medialibrary implementation. Please sumbit your PR in plugin Github Repository.


Installation

Install plugin by OctoberCMS plugin updater.

Go to Settings –> Updates&Plugins find Gutenberg in plugin search. Click on icon and install it.

Usage

This plugin works only by implementing Gutenberg behavior in your model. It will create morphOne relation with Gutenberg\Content model.

Go to your model and add behavior in $implement array:

public $implement = ['ReaZzon.Gutenberg.Behaviors.Gutenbergable'];

After you need to add behavior to $implement array in your model controller.

public $implement = ['ReaZzon.Gutenberg.Behaviors.GutenbergController'];

Done. Your model now has morphOne with Gutenberg\Content Model by content field.

Rendering

Rendering examples below.

{{ post.content.render }}
$post->content->render();

In order to correctly display Gutenberg styles. You must add laraberg public styles to your page:

<link href="/plugins/reazzon/gutenberg/assets/laraberg.min.css" rel="stylesheet">

Devloped by reazzon.ru.