Usando FCKeditor com Zend Framework

Este é meu primeiro post no meu novíssimo site, e escolhi para isso uma dica bem legal que aprendi fazendo esse blog.

Na área administrativa do meu site, precisava de um editor WYSIWYG (what you see is what you get) para fazer meus posts e editar as páginas. Tenho outro site que utiliza o open source PHP List e nele, para fazer as mensagens, foi escolhido o FCK Editor que usei e achei muito prático e completo, então o escolhi também para implementar no meu blog.

Como falado na área “Como foi feito?”, um link no rodapé, estou utilizando Zend Framework para o desenvolvimento, e então tive que descobrir uma forma prática de implentar o FCK junto ao Zend, daí que surge esse post!

Bom, estou presumindo que você conhece o funcionamento do Zend, se não, sugiro que pesquise um pouco, ainda não tenho um post sobre isso por aqui, mas dentro em breve com certeza existirá um. Utilizei o Zend versão 1.6 e o FCK versão 2.6.3.

Primeiro temos que criar dentro da pasta “library”, ou como você preferir nomear, uma pasta para guardar todas as classes que adicionaremos ao Zend. A criei com o nome de “Pteixeira”, e logo na sequência, crie uma pasta chamada “Fckeditor”, para guardar os arquivos do editor.

Faça o download da ferramenta e extraia o conteúdo na pasta criada.

Depois de tudo isso feito, criaremos a classe que fará a instância do FCK. Nomeei a classe como Fckeditorpedro.php, pois Fckeditor.php já existe, esse arquivo deve ser criado em /library/Pteixeira/Fckeditor/. Vou passar o código dessa classe e logo na sequência o explico.

Fckeditorpedro.php

// Aqui incluímos a real classe do FCKEditor que irá criar o editor
require_once 'Pteixeira/Fckeditor/Fckeditor.php';

/**
 * Classe que estende o FCKeditor
 *
 * @author Pedro Teixeira
 * @copyright Copyright 2008 Pedro Teixiera
 */
class Pteixeira_Fckeditor_Fckeditorpedro
{
    private $_fck;

    /**
     * Este médoto será chamado sempre que a classe for instanciada,
     * chamado construtor.
     * Faz as tarefas iniciais da classe.
     *
     * @param string
     * @return void
     */
    public function __construct($name)
    {
        /* Instancia o FCKeditor e guarda em uma variável */
        $this->_fck = new FCKeditor($name) ;
    }

    /**
     * Método que devolve a instância do FCK
     *
     * @return FCKeditor
     */
    public function getInstance()
    {
        return $this->_fck;
    }
}

Na linha 12 declaramos a variável que guardará a instância do FCK.

Na linha 25, dentro do construct, instanciamos a classe do FCK que foi incluída na linha 2 passando uma string como parâmetro, string que será usada para nomear o editor, e guardamos na variável $_fck.

Na linha 35 do método getInstance() retornamos a instância da classe.

Agora que temos quase tudo pronto, basta incluir essa classe no nosso bootstrapping, no meu caso, index.php.

index.php

/* Classe de manipulação do FCK */
Zend_Loader::loadClass('Pteixeira_Fckeditor_Fckeditorpedro');

Agora a classe de manipulação e a estrutura estão prontas, mas ainda falta um detalhe.

O FCK utiliza um IFrame para montar o editor e esse IFrame usa um arquivo html de dentro da pasta dele, porém, como estamos utilizando o Zend Framework, o RewriteEngine está ligado, o que irá impedir do IFrame ser mostrado pelo browser. Para resolvermos isso, basta criar um .htaccess dentro da pasta /library/Pteixeira/Fckeditor/ com o seguinte conteúdo.

.htaccess

Allow from all
RewriteEngine off

Assim desabilitamos o RewriteEngine dentro da pasta do FCK.

Bom, estamos com tudo pronto, agora basta usar!

Para isso vou criar um exemplo e na sequência explico seu funcionamento. Esse exemplo será um controlador que fará uso da nossa classe.

IndexController.php

/**
 * Controlador de Teste
 *
 * @author Pedro Teixeira
 * @copyright Copyright 2008 Pedro Teixeira
 */
class IndexController extends Zend_Controller_Action
{
    /** Ação principal */
    public function indexAction()
    {
        $fck = new Pteixeira_Fckeditor_Fckeditorpedro('nomedofck');
        $fck = $fck->getInstance();
        $fck->Value = 'Valor Padrão';
        $fck->Width = '800px';
        $fck->Height = '600px';
        $fck->BasePath = $this->_request->getBaseUrl() . '/library/Pteixeira/Fckeditor/' ;

        $this->view->fck = $fck;
    }
}

Na linha 12 instanciamos a classe que criamos e passamos seu nome como parâmetro. Esse nome será usado para recuperar seu valor seja como $_POST ou $_GET.

Na linha 14 informamos qual será o valor padrão do editor.

Na linha 15 e 16 definimos o tamanho do editor.

Na linha 17 informamos o path do editor.

E por fim, na linha 19 passamos o objeto para a view.

É isso, agora na view basta chamar o seguinte método para criar o editor.

$this->view->fck->Create();

Para recuperar o valor basta o usar o nome que foi passado quando instanciamos a classe, nesse exemplo, “nomedofck”.

Bom, é isso! Espero que tenha sido útil para muitas pessoas.