README

安装

您可以使用composer将此插件安装到您的CakePHP应用程序中。

安装composer包的推荐方法是

composer require jdmaymeow/cake-bootstrap

插件加载

要加载插件，请运行

bin\cake plugin load CakeBootstrap

或编辑bootstrap.php文件并添加以下行

Plugin::load('CakeBootstrap');

主题

如果您想使用子主题，请使用以下代码更新您的appController。

 public function beforeRender(\Cake\Event\Event $event)
    {
        $this->viewBuilder()->theme('Modern');
    }

默认主题

打开您的codeadvent.json并在CodeAdvent部分添加设置

{

"adminTheme" : "bootswatch/flatly/bootstrap.min"
}

然后更新AppController的beforeRender函数

//Default theme for CakeBootstrap
$theme = Configure::read('CodeAdvent.adminTheme');
$this->set('CA_DEFAULT_ADMIN_THEME', $theme);

子主题

配置 - Bootstrap

这些主题使用Bootstrap框架，请在您的composer.json文件中包含'martin/bootstrap'包。此包将不断更新。因此，您将始终拥有最新的Bootstrap版本

FontAwesome - 可选

如果您想在使用主题时使用FontAwesome图标，您不需要从网络上下载它。应用程序包含预加载的FontAwesome包

如果您想，可以在composer.json中添加依赖 - martin\fontawesome

要加载它，您必须在布局中包含FA CSS。

<?= $this->Html->css(Fontawesome.fontawesome.min) ?>

创建主题

主题结构与插件相同。因此创建一个

bin\cake bake plugin <Your-Theme-Name>

此主题将自动加载。但如果您使用composer安装它，您必须自己加载它

bin\cake plugin load <Your-Theme-Name> -r

布局

布局将位于Template\Layout文件夹中，并具有.ctp扩展名。因此创建layout_front.ctp

您需要包含bootstrap css，因此请将以下行添加到您的head部分。

<?= $this->Html->css(Bootstrap.bootstrap.min) ?>

然后您可以根据需要包含更多的css。

视图模板

例如，如果您需要为ContentManager Nodes Index创建模板，请在以下位置创建新的index.ctp

plugins\<Your-Theme-Name>\src\Template\Plugin\ContentManager\Nodes\index.ctp

每个插件都将在其类似路径下具有模板。

plugins\<Your-Theme-Name>\src\Template\Plugin\<Plugin-Name>\<Controller>\<action>.ctp

管理员模板顶部菜单

如果您想使用管理员模板的顶部菜单，请更新以下文件

AppController

添加以下行或取消注释，如果您使用jdmaymeow/app

// ADMIN TOP MENU
$adminMenu = Configure::read('CakeBootstrap.adminTopMenu');
$this->set('MCLOUD_ADMIN_TOP_MENU', $adminMenu);

并在 codeadvent.json 文件中添加配置。

"CodeAdvent": {
  "adminTopMenu" : "admin_top_menu"
}

在元素目录下创建菜单元素 admin_top_menu.ctp。

<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
    Admin
    <ul class="dropdown-menu">
        <li><a href="#">Test</a> </li>
    </ul>
</a>