Criação de Plugin para o CakePHP 3
Irei relatar como criei o plugin twbs-cake-css:
https://github.com/ribafs/twbs-cake-css
Eu criei um plugin que controla a autenticação em aplicativos do Cake, que é o
https://github.com/ribafs/cake-control-br
E neste plugin, para melhorar o aspecto, adicionei o plugin twbs-cake-plugin:
https://github.com/elboletaire/twbs-cake-plugin
Acontece que o twbs-cake-plugin usa less ao invés de css puro e é meio lento. Então resolvi editar o mesmo e criar um que ficasse como eu queria, somente com CSS, mais simples e mais rápido. Resolvi usar o Bootstrap, apenas com CSS.
Baixei o Bootstrap:
http://getbootstrap.com/docs/4.0/getting-started/download/
Eu ainda usei a versão 3, que vinha com as fontes glyphicons.
Baixei o twbs-cake-plugin
Mudei o plugin acima para deixar como eu queria:
Comecei eliminando a pasta config com o arquivo bootstrap.php. Ele chama dois outros plugins que não usarei.
Todo o conteúdo da pasta /src eu usarei como está sem nenhuma modificação, pois ela contém o template para que o bake gere o conteúdo com o CSS, apenas mudarei o layout default.ctp.
Veja como ficou o layout default.ctp:
<?php
/**
* CakePHP(tm) : Rapid Development Framework (http://cakephp.org)
* Copyright (c) Cake Software Foundation, Inc. (http://cakefoundation.org)
*
* Licensed under The MIT License
* For full copyright and license information, please see the LICENSE.txt
* Redistributions of files must retain the above copyright notice.
*
* @copyright Copyright (c) Cake Software Foundation, Inc. (http://cakefoundation.org)
* @link http://cakephp.org CakePHP(tm) Project
* @since 0.10.0
* @license http://www.opensource.org/licenses/mit-license.php MIT License
*/
$cakeDescription = 'CakePHP: the rapid development php framework';
?>
<!DOCTYPE html>
<html>
<head>
<?= $this->Html->charset() ?>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>
<?= $cakeDescription ?>:
<?= $this->fetch('title') ?>
</title>
<?= $this->Html->meta('icon') ?>
<?= $this->Html->css('base.css') ?>
<?= $this->Html->css('bootstrap.min.css') ?>
<?= $this->Html->script('bootstrap.min') ?>
<?= $this->fetch('meta') ?>
<?= $this->fetch('css') ?>
<?= $this->fetch('script') ?>
</head>
<body>
<style>
/* Remover as duas linhas abaixo, caso o texto do site fique com letras muito grandes */
html { font-size: 14px; }
body { font-size: 14px; }
</style>
<nav class="top-bar expanded" data-topbar role="navigation">
<ul class="title-area large-3 medium-4 columns">
<li class="name">
<h1><a href="/portal/"><?= $this->fetch('title') ?></a></h1>
</li>
</ul>
<div class="top-bar-section">
<ul class="right">
<li><a target="_blank" href="http://book.cakephp.org/3.0/">Documentation</a></li>
<li><a target="_blank" href="http://api.cakephp.org/3.0/">API</a></li>
</ul>
</div>
</nav>
<?= $this->Flash->render() ?>
<div class="container clearfix"> <!-- Assim <div class="clearfix"> ocupará toda a tela-->
<?= $this->fetch('content') ?>
</div>
<footer>
</footer>
</body>
</html>
Agora vejamos como ficou o conteúdo da pasta /webroot:
/css
bootstrap.min.css
/fonts
glyphicons-halflings-regular.ttf
/js
bootstrap.min.js
Um arquivo muito importante é o composer.json, que contém informações para a instalação pelo composer:
{
"name": "ribafs/twbs-cake-css",
"authors": [
{
"name": "Ribamar FS",
"email": "Este endereço de email está sendo protegido de spambots. Você precisa do JavaScript ativado para vê-lo.",
"homepage": "http://racotecnic.com",
"role": "Developer"
}
],
"description": "Twitter Bootstrap Plugin for CakePHP 3",
"type": "cakephp-plugin",
"keywords": ["cakephp", "bootstrap", "plugin", "template"],
"license": "MIT",
"support": {
"issues": "https://github.com/ribafs/twbs-cake-css/issues",
"source": "https://github.com/ribafs/twbs-cake-css.git"
},
"homepage": "https://github.com/ribafs/twbs-cake-css",
"require": {
"cakephp/cakephp": "^3.3"
},
"autoload": {
"psr-4": {
"Bootstrap\\": "src"
}
}
}
Outro arquivo importante, que no GitHub funciona como o index.html em sites, é o README.md. Ele geralmente contém o help ensinando a instalar e outras informações.
README.md
Simple plugin to implement Bootstrap in CakePHP 3
===================================================
This plugin is a fork of the Twitter Bootstrap Plugin
https://github.com/elboletaire/twbs-cake-plugin
This plugin only use CSS, dont use Less.
It also contains bake templates that will help you starting *twitter-bootstraped*
CakePHP webapps.
General Features
----------------
- Bake templates.
- Generic Bootstrap layout.
Installation
------------
### Adding the plugin
You can easily install this plugin using composer as follows:
```bash
composer require ribafs/twbs-cake-css
```
### Enabling the plugin
After adding the plugin remember to load it in your `config/bootstrap.php` file:
```php
bin/cake plugin load Bootstrap
```
This will load the CSS for you.
### Add Template to src/Controller/AppController.php
```php
public function beforeRender(Event $event)
{
$this->viewBuilder()->theme('Bootstrap');
...
```
### Baking views
You can bake your views using the twitter bootstrap templates bundled with this
plugin. To do so, simply specify the `bootstrap` template when baking your files:
```bash
bin/cake bake all amigos --theme Bootstrap
```
License
-------
The MIT License (MIT)
Faltou apenas a licença, que mantive a mesma: MIT.
Caso tenha interesse pela publicação no Packgist veja o artigo:
http://ribafs.org/portal/cakephp-3/tutoriais/projeto-no-github
Comments fornecido por CComment