Integrando Ckeditor com Ckfinder no Cakephp

Recentemente, eu comecei a estudar o framework cakephp e uma das primeiras coisas que procurei saber foi como integrar o Ckeditor e Ckfinder – no caso de PHP. Depois de algumas xícaras de café e de ler muitos artigos a respeito, eu consegui. Vale citar que mesclei vários tutoriais e artigos e no fim juntei tudo para conseguir que funcionasse.

A primeira coisa a se fazer é os respectivos downloads:

http://cakephp.org/
http://ckeditor.com/
http://ckfinder.com/

Vamos lá mão na massa

vamos extrair o cake na pasta desejada no meu caso será /var/www/cake

abra o diretório e acesse a seguinte pasta

/var/www/cake/app/webroot/js

agora vamos extrair o ckeditor ckfinder e colocar nessa pasta fincando assim

/cake
     /app
         /webroot
                 /js
                    /ckeditor
                    /ckfinder

Agora vem a mágica

acesse a pasta do ckeditor e abra o arquivo config.js verá o seguinte código

CKEDITOR.editorConfig = function( config )
{
	// Define changes to default configuration here. For example:
	// config.language = 'fr';
	// config.uiColor = '#AADC6E';

};

troque por

CKEDITOR.editorConfig = function( config ){
    config.filebrowserBrowseUrl = '../js/ckfinder/ckfinder.html',
    config.filebrowserImageBrowseUrl = '../js/ckfinder/ckfinder.html?type=Images',
    config.filebrowserFlashBrowseUrl = '../js/ckfinder/ckfinder.html?type=Flash',
    config.filebrowserUploadUrl = '../js/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Files',
    config.filebrowserImageUploadUrl = '../js/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Images',
    config.filebrowserFlashUploadUrl = '../js/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Flash'
};

agora na sua view adicione a chamada para os js ,também pode ser inserido no default.ctp assim sempre que precisar já só chamar o javascript para criar o ckeditor

<?php
echo $this->Html->script('ckeditor/ckeditor.js');
echo $this->Html->script('ckfinder/ckfinder.js');
?>

na view que deseja usar o ckeditor é só fazer o seguinte

<script type="text/javascript">
    var ckEditor = CKEDITOR.replace( 'texto' );
</script>
<?php echo $this->Form->textarea('texto', array('id'=>'texto','class'=>'ckeditor'));?>

pronto já temos o ckeditor funcionando porém o ckfinder não está funcionando ,agora vamos deixar tudo funcionando belezinha

vamos alterar a url do ckeditor assim não dará erro pedindo controller.
abram o arquivo config.php na pasta do ckfinder e procure por $baseUrl adicionem o caminho onde as imagens serão salvas no meu caso por exemplo

$baseUrl = '/cake/app/webroot/img/';///coloquei na própria pasta img publica do webroot

alterem tbm o retorno da função “CheckAuthentication” para true

Pronto temos o ckeditor com ckfinder funcionando
***Vale lembrar pra não esquecerem das permissões

Isso de estudar o cakephp foi algo inesperado mas muito prazeroso então pretendo continuar a conhecer esse íncrivel framework e vou postando as descobertas