Aprenda a configurar o FCKEditor 2.6.4 em suas aplicações ASP.

Tempos atrás, escrevi outro artigo aqui no fórum do imasters, este tem rendido muitas visitas, bastante e-mails e mensagem por MSN da galera solicitando ajuda nas mais diversas dúvidas.

Solução para a maioria dos erros no FCKeditor com ASP

Bom, gostaria de agradecer a todos aqueles que entraram e viram o tópico anterior, aqueles que entraram em contato comigo, sei que devo desculpas a alguns pois nem sempre foi possível atender a todos, o tempo as vezes, entre uma aplicação e outra é muito curto.

Mas, vim aqui para falar sobre o fck editor, edição ou versão 2.6.4. Em quase todas as minhas aplicações, passei a utilizá-lo, o cliente sempre precisa “colocar um negrito aqui ou ali” upar uma foto dentro do artigo ou descrição do produto, um banner flash, criar uma tabela, um link... Ou sei lá o que, só sei que o cliente é o cara que manda e a gente é quem faz a aplicação dele ficar mais prática possível. É aê que entra o FCK Editor.

A primeira coisa a fazer, é o download da versão citada:

Clic aqui para baixar o FCKeditor_2.6.4.zip.

Caso queira ver como funciona o editor, clique aquie veja o demo.

Uma vez baixado o editor, uso o descompactador de sua preferência e descompacte o arquivo. Será criada um diretório com o nome de /fckeditor/, todo este artigo só funcionará se os arquivos estiverem dentro de um diretório com este nome, pois se você preferir utilizar um diretório com outro nome, terá que mudar o nome no código também. (não se preocupe, falarei sobre isso mais adiante)

A primeira coisa a fazer é deletar o diretório com o nome samples. (/fckeditor/samples/), dentro deste diretório estão alguns exemplos de como utilizar o editor, mas estes exmplos podem ser utilizados por lammers para invadir o seu sistema.

Ainda dentro do diretório /fckeditor/, apague todos os arquivos de outra linguagem de programação, (PHP, CFM, LASSO, PL, PY) mantenha apenas os XML, HTML , JS e ASP.

Na página onde você quer que apareça o editor, exatamente no local, coloque o seguinte código:

<!-- #INCLUDE file="fckeditor.asp" -->
<%
Dim oFCKeditor
Set oFCKeditor = New FCKeditor
oFCKeditor.BasePath = "/fckeditor/" diretório onde estão os arquivos
oFCKeditor.Value = ""
oFCKeditor.Create "textarea"
%>
É interessante que esta página também esteja dentro do diretório /fckeditor/.

Na questão dos caracteres especiais, palavras acentuadas e outros use a metatag:

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">, na página onde aparece o editor e na página onde está o código que faz a inserção dos dados no banco.

Na hora de alterar os dados surge o problema que faz com que muitos desistam do editor, como recuperar os dados dentro do editor?

<!-- #INCLUDE file="fckeditor.asp" -->
<%
Dim oFCKeditor, textarea
Textarea = Rs(“seucampo”)
Set oFCKeditor = New FCKeditor
oFCKeditor.BasePath = "/fckeditor/" diretório onde estão os arquivos
oFCKeditor.Value = Textarea
oFCKeditor.Create "textarea"
%>
O FCK Editor 2.6.4 vem por default habilitado para PHP, para mudar pra ASP, entre no arquivo fckconfig.js, dentro do diretório /fckeditor/ e altere as linhas:

var _FileBrowserLanguage	= 'php';	// asp | aspx | cfm | lasso | perl | php | py
var _QuickUploadLanguage	= 'php';	// asp | aspx | cfm | lasso | perl | php | pyPara:

var _FileBrowserLanguage	= 'asp';	// asp | aspx | cfm | lasso | perl | php | py
var _QuickUploadLanguage	= 'asp';	// asp | aspx | cfm | lasso | perl | php | py

Atualmente utilizo muito o visual (skin) do office 2003 em minhas aplicações, esta mudança você pode fazer alterando no arquivo fckconfig.js, dentro do diretório /fckeditor/ a linha onde está:

FCKConfig.SkinPath = FCKConfig.BasePath + 'skins/default/';
Para:

FCKConfig.SkinPath = FCKConfig.BasePath + 'skins/office2003/';
Outra mudança que fiz no visual do meu editor, é nos ícones da barra acima. Existem muitos ícones com funções que determinado cliente nunca vai usar, então simplifiquei e tirei uma grande parte. Ainda no arquivo fckconfig.js, dentro do diretório /fckeditor encontre a linha:

FCKConfig.ToolbarSets["Default"] = [
E faça a seguinte mudança a partir dela:

FCKConfig.ToolbarSets["Default"] = [
['Source','Cut','Copy','Paste','-','Undo','Redo','-','SelectAll','RemoveFormat','JustifyLeft','JustifyCenter','JustifyRight','JustifyFull'],
['ImageButton','-','Bold','Italic','Underline','StrikeThrough','-','Subscript','Superscript','Link','Unlink','Image','Flash'],
['FontName','FontSize','-','TextColor','BGColor']// No comma for the last row.
];
FCKConfig.ToolbarSets["Basic"] = [
['Bold','Italic','-','OrderedList','UnorderedList','-','Link','Unlink','-','About']
];
FCKConfig.EnterMode = 'p'; // p | div | br
FCKConfig.ShiftEnterMode = 'br'; // p | div | BRNote que algumas linhas serão substituidas até a linha:

FCKConfig.ShiftEnterMode = 'br'; // p | div | BR
Agora vamos partir para a parte do upload de fotos, banner flash, arquivos para links e etc.

Navegue até o diretório:

/fckeditor/editor/ filemanager/ connectors/

Apague tudo que tiver lá dentro, deixe só o diretório /asp/ dentro dele, edite o arquivo config.asp

Na linha

ConfigIsEnabled = False 'mude de False para true, isso habilita o upload
na linha

ConfigUserFilesPath = "/userfiles/"
coloque no lugar de userfiles o nome do seu diretório onde será feito o upload a barra no inicio quer dizer que este diretório está na raiz do site. Caso o diretório que você listou aqui não exista o fckeditor vai cria-lo.

Para alterar o tamanho do textarea do seu editor, entre no arquivo fckeditor.asp, dentro do diretório /fckeditor/ e faça a seguinte mudança:

Onde está:

Private Sub Class_Initialize()
sBasePath = "/fckeditor/"
sWidth = "100%" 'Aqui é a largura, aconselho a manter 1005
sHeight = "200" 'aqui é altura, eu uso 350, mas o ideal é você testar a altura melhor para sua aplicação
sToolbarSet = "Default"
sValue = ""
Bom, acho que isso não é tudo, mas ajuda pra caramba, qualquer dúvida estarei aqui, mas por gentileza, não use o MSN pra pedir ajuda, faça isso aqui no fórum.

Nota: A mudança que fiz nos ícones foi para utilizar em um sistema de noticias, algumas informações estão contidas na própria documentação o FCKEditor.*

Cido Silva

Desenvolvimento de sites, softwares e aplicações para web

www.cidosilva.com.br