devinow/phpagebuilder

一个拖放式页面构建器,用于管理任何PHP项目中的页面。

2.0.0 2023-08-04 14:20 UTC

This package is auto-updated.

Last update: 2024-09-04 16:29:50 UTC


README

PHPagebuilder

PHPagebuilder

PHPagebuilder是一个拖放式页面构建器,用于管理任何PHP项目中的页面。

PHPagebuilder可以用作超轻量级CMS,快速创建新网站,或者可以集成到现有项目或您喜欢的框架(如此版本适用于Laravel)。服务器端代码不依赖于任何其他库,运行速度快。它包含一个可选的网站管理器,具有Bootstrap UI,并集成了最受欢迎的开源拖放式页面构建器:GrapesJS。此包注重定制,允许您配置、禁用或替换其任何模块。

目录

它能帮我什么?

无论您是新手还是有经验的网络开发者,如果您发现自己处于以下任何一种情况,PHPagebuilder都可以使您的生活更轻松:

  • 您只想创建一个基本的网站,您可以从任何设备轻松管理。
  • 您在安装、配置、更新或使用功能丰富的CMS系统(如Wordpress、Drupal)时感到困惑。
  • 您不喜欢您尝试过的CMS中有限的页面编辑器。
  • 您想在几小时内为客户构建一个定制的网站。
  • 您的客户在功能丰富的管理面板(如Drupal)中感到迷茫。
  • 您讨厌依赖混乱的插件来实现您可以用纯PHP立即编写的功能,但仍然想有一些管理功能,以便其他人可以管理您创建的网站。
  • 您希望有高级功能(如搜索功能、显示远程数据源的数据视图等),并且可以轻松由您的客户管理。

功能

页面构建器

PHPagebuilder具备基于GrapesJS的页面构建器。PageBuilder

网站管理器

包含一个基本的网站管理器,具有Bootstrap UI。此网站管理器提供基本功能,用于添加或删除页面,以及编辑页面设置,如页面标题或URL。点击编辑按钮将打开页面构建器。Website Manager

您不想使用网站管理器?无需担心,它包括给那些想直接使用PHPagebuilder的人。请点击这里了解如何禁用或替换网站管理器。

安装

要安装PHPagebuilder,您可以选择快速开始路径,快速创建新网站,或将它集成到您自己的框架或喜欢的项目结构中。

要求

  • PHP版本 >= 7
  • 一个酷项目

快速开始 🚀

如果您想快速使用拖放页面管理功能启动一个新的项目,您可以下载样板工程项目结构,并按照那里的步骤进行操作。

集成到现有项目或框架中

使用Composer添加代码

如果您使用Composer管理PHP依赖项,您只需运行以下命令

composer require devinow/phpagebuilder

接下来,可以使用以下PHP代码初始化PHPagebuilder

require_once __DIR__ . '/vendor/autoload.php';

$config = require __DIR__ . '/config.php';

$builder = new PHPageBuilder\PHPageBuilder($config);
$builder->handleRequest();

config.php应包含config/config.example.php的副本,并填入您的设置。

不使用Composer添加代码

您没有使用Composer?不要担心,此项目是用纯PHP编写的,没有任何依赖项,因此可以直接包含在任何PHP项目中!

只需将最新版本下载到项目中的一个单独文件夹中(我们命名为:phpagebuilder)。

接下来,您只需在应该启动页面构建器的PHP文件中包含以下代码

$installationFolder = __DIR__ . '/phpagebuilder';
require_once $installationFolder . '/src/Core/helpers.php';
spl_autoload_register('phpb_autoload');

$config = require __DIR__ . '/config.php';

$builder = new PHPageBuilder\PHPageBuilder($config);
$builder->handleRequest();

config.php应包含config/config.example.php的副本,并填入您的设置。

配置数据库

如果您使用PHPagebuilder原版,它需要一个数据库来存储您的页面。只需创建一个数据库,并运行config/create-tables.sql中的查询。接下来,将数据库凭据添加到您的配置文件中。

创建主题

config.php中包含一个配置键theme,在其中指定了themes_folderactive_theme。要创建新的主题,请将新文件夹添加到配置的主题文件夹中。此文件夹的名称将是主题的标识符,可用于在theme > active_theme配置中选择主题。

主题应具有以下文件夹结构

  • /blocks
    blocks文件夹包含可用于页面构建器的每个块的子文件夹。单个块的文件夹包含一个view.php或一个view.html。如果使用view.html,则块内容(HTML元素)可以在页面构建器中完全编辑。如果使用view.php,则块可以使用服务器端逻辑(PHP)进行渲染,因此无法从页面构建器内部更改HTML内容。
  • /layouts
    layouts文件夹包含每个页面布局的子文件夹。页面布局包含一个view.php文件,它定义了带有所有样式表和脚本的基本HTML结构,这些样式表和脚本对于拖放到此类页面上的块是必需的。每个布局需要在页面上添加HTML块的位置上包含字符串:<?= $body ?>
  • /public
    public文件夹包含所有应公开访问的资产(CSS、JavaScript、图像等)。可以使用[theme-url]短代码指向当前活动主题的public文件夹中的文件。例如,可以通过以下方式加载public/css/style.css文件:<link rel="stylesheet" href="[theme-url]/css/style.css">

块嵌套在块中

在块或布局文件中包含块

可以使用短代码将块包含在另一个块或布局文件中。例如,将短代码[block slug="header"]添加到layouts/master/view.php中,将包含块blocks/header/view.php在所有使用master布局的页面上。

页面构建器中的嵌套块

要允许在页面构建器中将块拖放到块中,应添加一个块容器。要添加块容器,只需在块视图文件中添加[blocks-container]即可。以下HTML语法允许在bootstrap容器元素中添加块

<div class="container">
    [blocks-container]
</div>

另一种方法是向HTML元素添加phpb-blocks-container属性,如下例所示

<div class="row">
    <div class="col-md-6" phpb-blocks-container>
    </div>
    <div class="col-md-6" phpb-blocks-container>
    </div>
</div>

扩展PHPageBuilder

PHPageBuilder允许您非常容易地为您的主题创建新的块和布局。这对于构建特定的网站和模板来说很棒,但是如果您在CMS环境中使用PHPageBuilder,您可能希望提供插件/模块创建自己的块的能力,而无需修改主题中现有的组件。

PHPageBuilder 允许您从插件、Composer 包或任何其他环境中注册区块、布局和资产(CSS、JS)。

添加新区块

/**
 * @param string $slug - A Unique identifier for the block. Prefix author to avoid conflict.
 * @param string $directoryPath - Path to the directory of the Block.
 */
\PHPageBuilder\Extensions::registerBlock($slug, $directoryPath);

// Registering an example block:

\PHPageBuilder\Extensions::registerBlock('foo-navbar', MY_PLUGIN_DIRECTORY . '/blocks/foo-navbar');

添加新布局

/**
 * @param string $slug - A Unique identifier for the layout. Prefix author to avoid conflict.
 * @param string $directoryPath - Path to the directory of the Layout.
 */
\PHPageBuilder\Extensions::registerLayout($slug, $directoryPath);

// Registering an example layout:

\PHPageBuilder\Extensions::registerLayout('foo-master', MY_PLUGIN_DIRECTORY . '/layouts/foo-master');

添加资产(CSS & JS)

/**
 * @param string $src                           - URL of the Asset file.
 * @param string $type                          - 'style' or 'script' 
 * @param string $location                      - 'header' or 'footer'
 * @param array['$key' => '$value'] $attributes - Array of attributes to add to the tag.
 */
\PHPageBuilder\Extensions::registerAsset($src, $type, $location, $attributes = []);

// Registering assets:

\PHPageBuilder\Extensions::registerAsset('/assets/bootstrap.css', 'style', 'header');
\PHPageBuilder\Extensions::registerAsset('/assets/alpine.min.js', 'script', 'header', [
    'defer' => true
]);

区块和布局的创建方式与创建主题中描述的方法相同,但它们不受任何主题目录的限制。

自定义 PHPageBuilder

PHPagebuilder 设计时考虑了自定义。它附带了一个全面的示例配置文件,您可以通过它轻松地将页面构建器适应您的需求。

PHPagebuilder 由四个模块(认证、网站管理器、页面构建器、路由)组成,您可以选择禁用或替换为您的实现。若要使用您的实现替换模块,实现相应的合约,并在配置文件中将默认类替换为您的类。

自定义网站管理器

禁用模块

您项目中已经有管理员登录功能吗?那么您可以通过在您的配置中将 use_website_manager 设置为 false 来禁用网站管理器模块。接下来,您在项目中使用或实现页面创建/编辑/删除功能,然后直接启动页面构建器。您可以通过使用 PHPageBuilder\Modules\GrapesJS\PageBuilder 类从您的项目中渲染页面构建器。

替换模块

如果您想使用 PHPagebuilder 的 CMS 路由功能,但希望使用不同的网站管理器,您可以替换为您的实现。确保在您的配置中将 use_website_manager 设置为 true,实现 WebsiteManagerContract 并将您的类添加到配置文件中。