meevo/gutenberg

拖放式的带区块的丰富编辑器,用于 OctoberCMS 后端表单。

安装: 36

依赖项: 0

建议者: 0

安全性: 0

星标: 0

关注者: 2

分支: 0

公开问题: 0

语言:JavaScript

类型:october-plugin

dev-master 2020-10-24 01:39 UTC

This package is auto-updated.

Last update: 2024-09-24 10:02:37 UTC


README

目前仅限内部使用

安装

通过 OctoberCMS 插件更新器安装插件。

转到设置 –> 更新和插件,在插件搜索中找到 Gutenberg。点击图标并安装。

或通过 Composer

composer require meevo/gutenberg

用法

此插件仅通过在您的模型中实现 Gutenberg 行为来工作。它将与 Gutenberg\Content 模型创建 morphOne 关系。

转到您的模型并添加 $implement 数组中的行为

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

之后,您需要将行为添加到模型控制器中的 $implement 数组。

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

完成。现在您的模型通过 content 字段具有与 Gutenberg\Content 模型的 morphOne 关系,该字段仅在创建的模型页面上 渲染

渲染

以下是一些渲染示例。

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

为了正确显示 Gutenberg 样式,您必须在您的页面上添加 laraberg 公共样式。

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

处理源 js 代码

如果您想添加一些功能,您可以在 /plugins/meevo/gutenberg/formwidgets/gutenberg/assets/resources 中处理 Laraberg 的源文件,要设置所有环境,请遵循以下步骤

  1. 克隆 Gutenberg 仓库:git clone https://github.com/WordPress/gutenberg.git gutenberg
  2. 克隆后执行以下命令
    cd gutenberg           // go to Gutenberg folder
    npm i                  // install all dependencies
    npm run build          // Build Gutenberg
    sudo npm link          // Link it to your global node_modules
    cd ..                  // Go back to Laraberg root
    npm i                  // install all dependencies
    npm link gutenberg     // Link Gutenberg package to Laraberg
  3. 现在您已设置完毕。

meevo.ca 开发