Don't you speak portuguese? Translate this site with Google Translator

Pensamento do Dia

O amor não deve ser apenas uma chama: deve ser também uma luz. (Henry David Thoreau)

Criação de Plugin para o CakePHP 3

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

Novo Testamento

Bem tinha eu imaginado que contra o nome de Jesus Nazareno devia eu praticar muitos atos;
(At, 26:9)

Rotas no Mapa do Google

© 2015 Ribamar FS. All Rights Reserved. Designed By JoomShaper