dcodegroup / page-builder

0.6.1 2024-09-19 14:38 UTC

README

此软件包为Laravel中类似页面构建器的CMS提供功能。这包括管理页面及其内容。

该软件包可以根据项目进行扩展:可以定义新的组件、模板和页面布局。

安装

您可以通过composer安装此软件包

composer require dcodegroup/page-builder

然后运行安装命令。

php artisan vendor:publish --tag=page-builder-config
php artisan vendor:publish --tag=page-builder-migrations

这将发布配置文件和迁移。

然后运行迁移

php artisan migrate

作为NPM依赖项添加

"@dcodegroup-au/page-builder": "./vendor/dcodegroup/page-builder",

安装 vite-plugin-static-copy

npm install vite-plugin-static-copy

安装TinyMCE

npm install --save "@tinymce/tinymce-vue@^4"

在导入vite-plugin-static-copy后,将其添加到vite.config.js中的plugins数组中

viteStaticCopy({
    targets: [
        {
            src: "node_modules/tinymce",
            dest: "plugins",
        },
    ],
})

作为解析别名添加

"~vendor": path.resolve(__dirname, "./vendor/"),

工作配置,如果您想将路由放入web.php中

<?php

return [
    'routing' => [
        'admin' => [
            'middlewares' => [
                'auth:sanctum',
                config('jetstream.auth_session'),
                'verified',
            ],

            'prefix' => '/admin',

            'name_prefix' => 'admin.',
        ],

        'front' => [
            'middlewares' => [],

            'prefix' => '/',

            'name_prefix' => 'cms.',
        ],
    ],
];

将这些添加到routes/web.php的底部,这将发布路由

Route::pageBuilder();
Route::cmsFront();

配置

大部分配置已经设置为合理的默认值。但是,您可以查看配置文件config/page-builder.php并根据需要进行调整。

配置值主要用于添加中间件、前缀和组,这些值用于admin和站点的功能。

路由

以下路由由该软件包暴露

管理端

/admin/pages - List all available pages
/admin/pages/{page} - Edit page
/admin/pages/{page}/preview - Ajax endpoint for generating previews for a page

/admin/templates - List all available layout templates

前端

/{slug} - Renders a page with the given slug. Returns 404 if not found.

扩展

组件

可以使用Laravel的DI容器添加或更改组件。以下示例应添加到您的某个ServiceProvider(例如AppServiceProvider)中。

可以使用以下方法注册新组件

$this->app->tag([
    \App\MyCMSModules\Heading::class
], 'page-builder-modules');

可以使用以下方法覆盖现有组件

$this->app->bind(\Dcodegroup\PageBuilder\Modules\Heading::class, \App\MyCMSModules\Heading::class);

组件模板

可以在组件的PHP类中定义组件的可用模板,通过覆盖Module类的availableTemplates()方法。之后,UI将显示一个选择输入框,您可以选择在渲染页面时使用哪个模板。模板必须作为具有(例如,对于标题模块)名称的视图可用:page-builder::modules.heading.my-template。例如,在特定项目中,这位于:{$projectRoot}/resources/views/vendor/page-builder/modules/heading/my-template.blade.php

布局模板

布局模板从/admin/templates页面进行管理。首先,您必须为每个添加的模板创建一个新的记录。模板的key字段将在搜索Blade视图时使用。模板必须作为具有名称的视图可用:page-builder::templates.{$key}。例如,在特定项目中,这可以位于:{$projectRoot}/resources/views/vendor/page-builder/templates/my-template.blade.php。在这种情况下,模板键将为my-template