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

[SilvaExtreme 0]

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 aqui e 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 | py

Para:

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 | BR

Note 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

[Rodrigo Resende 1]

Ola Cido ,

Parabéns pelo tópico!! Muito legal!!!

È o seguinte ,

Segui todos os passos e consegui coloca-lo em minha pagina!! Só que a página que ele esta é uma página de alteração de dados e eu preciso recuperar os dados que estão no BD quando tinha apenas a TEXTAREA eu apenas colocava la: <%=bd("pentry")%>

E já aparecia o texto mas com o Fck não pude colocar assim!!

Você tem alguma sugestão ou dica ???

Valeu!!

E aguardo uma resposta se possível!!

[Carlos Vasconcelos 0]

CIDO

 

parabéns pelo Tutorial.

 

 

Você conseguiu configurar para que ao fazer o upload da imagem

apareça o fullpath?

por exemplo, no lugar de

 

<img width="267" height="235" alt="" src="/userfiles/image/teste.jpg" />

 

fique

 

<img width="267" height="235" alt="" src="http://www.meusite.com.br/userfiles/image/teste.jpg" />

 

Isso é util quando se vai enviar um email ou entao se coloca o editor em várias página do site (evita problemas de caminhos).

 

No site deles eles falam isso ai embaixo mas é para PHP, e ai nao acho essas variaveis no config.asp . Ja achei falando pra ASPX mas no ASP nada ainda.

 

-------------------------------------------------------------------------------------------------------------------

Returning Full URLs

 

You can configure the File Browser to return full URLs to FCKeditor, like "http://www.example.com/userfiles/", instead of absolute URLs, like "/userfiles/". To do that, you must configure the connector, combining the UserFilesPath and UserFilesAbsolutePath settings:

UserFilesPath: include here the full URL for the user files directory. For example, set it to "http://www.example.com/userfiles/".

UserFilesAbsolutePath: include here the server path to reach the above URL directory. For example, in a Windows environment, you could have something like "C:/inetpub/mysite/userfiles/", while on Linux, something like "/usr/me/public_html/mysite/userfiles/".

Just adjust the above settings to your installation values and the File Browser will start returning full URLs to the editor.

[Carlos Vasconcelos 0]

Você conseguiu configurar para que ao fazer o upload da imagem

apareça o fullpath?

por exemplo, no lugar de

 

<img width="267" height="235" alt="" src="/userfiles/image/teste.jpg" />

 

fique

 

<img width="267" height="235" alt="" src="http://www.meusite.com.br/userfiles/image/teste.jpg" />

Encontrei,

descendo no CONFIG.ASP existem estas variaveis:

 

ConfigFileTypesPath.Add "Image", ConfigUserFilesPath & "image/"

ConfigFileTypesAbsolutePath.Add "Image", ""

ConfigQuickUploadPath.Add "Image", ConfigUserFilesPath

ConfigQuickUploadAbsolutePath.Add "Image", ""

 

mudar para:

 

ConfigFileTypesPath.Add "Image", "http://www.seusite.com.br/userfiles/image/"

ConfigFileTypesAbsolutePath.Add "Image", "D:\inetpub\wwwrootseusite\userfiles\image\"

ConfigQuickUploadPath.Add "Image","http://www.seusite.com.br/userfiles/image/"

ConfigQuickUploadAbsolutePath.Add "Image", "D:\inetpub\wwwrootseusite\userfiles\image\"

[Alexandre.Itba 0]

Eu aqui, 04:30 da madrugada, quebrando a cabeça com o FCKEditor e de repente acho este tópico.

Duas mãos na roda! hehuheah

 

Belo tuto!

Ajudou bastante http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

[Magnoweb 0]

Bom, depois de fazer e refazer tudo, busca tudo q é tipo de informação na internet o meu ainda não estava funcionando, até...que observando novamente esse post, vi um minusculo detalhe, uma barra /.

 

<%
		Dim oFCKeditor
		Set oFCKeditor = New FCKeditor
		oFCKeditor.BasePath = "FCKeditor/"
		oFCKeditor.Value = ds_editorial
		oFCKeditor.Create "str_msg"
		%>

Reparem que no tutorial so Silva a linha oFCKeditor.BasePath = "FCKeditor/" está com a barra "/FCKeditor/", mas no meu código não.

 

Então na linha

ConfigUserFilesPath = "/userFiles/"

também retirei a 1ª barra / ficando assim

ConfigUserFilesPath = "userFiles/"

e não é que esse trem funcionou..rs

 

Bom fica ai minha contribuição.

 

B) Magnoweb

[Rodrigo Resende 1]

Bom, depois de fazer e refazer tudo, busca tudo q é tipo de informação na internet o meu ainda não estava funcionando, até...que observando novamente esse post, vi um minusculo detalhe, uma barra /.

 

<%
		 Dim oFCKeditor
		 Set oFCKeditor = New FCKeditor
		 oFCKeditor.BasePath = "FCKeditor/"
		 oFCKeditor.Value = ds_editorial
		 oFCKeditor.Create "str_msg"
		 %>

Reparem que no tutorial so Silva a linha oFCKeditor.BasePath = "FCKeditor/" está com a barra "/FCKeditor/", mas no meu código não.

 

Então na linha

ConfigUserFilesPath = "/userFiles/"

também retirei a 1ª barra / ficando assim

ConfigUserFilesPath = "userFiles/"

e não é que esse trem funcionou..rs

 

Bom fica ai minha contribuição.

 

B) Magnoweb

Cara isso pq a barra anterior é apenas para indicar que a pasta esta na pasta raiz do site..

[thiagobellusse 0]

Olá, seguindo todos os passos deste tutorial, meu fckeditor funcionou perfeitamente no pc, ou seja, localmente, porém quando eu subo ele para o servidor, infelizmente não aparece nada.

http://bellusse.com/fckeditor/teste.asp

Não estou conseguindo fazer ele funcionar, ou melhor, não aparece nada na tela, apenas uma tela em branco, alguem teria alguma solução?

Obrigado

[SilvaExtreme 0]

Resolveste seu problema???

 

 

 

Olá, seguindo todos os passos deste tutorial, meu fckeditor funcionou perfeitamente no pc, ou seja, localmente, porém quando eu subo ele para o servidor, infelizmente não aparece nada.

http://bellusse.com/fckeditor/teste.asp

Não estou conseguindo fazer ele funcionar, ou melhor, não aparece nada na tela, apenas uma tela em branco, alguem teria alguma solução?

Obrigado

[thiagobellusse 0]

Resolveste seu problema???

 

 

 

Olá, seguindo todos os passos deste tutorial, meu fckeditor funcionou perfeitamente no pc, ou seja, localmente, porém quando eu subo ele para o servidor, infelizmente não aparece nada.

http://bellusse.com/fckeditor/teste.asp

Não estou conseguindo fazer ele funcionar, ou melhor, não aparece nada na tela, apenas uma tela em branco, alguem teria alguma solução?

Obrigado

 

 

Consegui sim SilvaExtreme, meu erro estava sendo nas barras das pastas, o link da resolução esta aqui

Obrigado

[Rapha Designer 0]

Bom, é o seguinte galera, estava buscando aqui um software para atualizar o site, ou melhor, o "cliente" atualizar o site, mas a maioria é pago, e descobri o FCKEditor.

 

Não foi difícil entender como ele funciona, mas ou eu estou errado pensando isso, ou realmente a aplicação não serve para o que eu preciso. Vou explicar melhor:

 

Tem um site, que é atualizado de 2 a 3 vezes por dia, é um site de Atualização Legal, conteúdo jurídico, as advogadas aqui na empresa é que irão utilizar o editor FCKEditor, ou não, rsss.

 

O problema é, para atualizar um site todo dia, toda hora, beleza, o FCKEditor faz isso, você entra, muda tudo, salva/publica e pronto, tá feito. Porém não é assim que o nosso site funciona, ele tem uma estrutura, que eu entendo que não funciona nesse editor. É mais ou menos assim:

Home do site com os chamados para as matérias, que vai mudar sempre, ai a pessoa clica e é direcionada para outra página com a matéria ne íntegra(completa), pois na home terei que separar os estados, ou municípios por data. O problema não é a home, pois essa vai mudar o conteúdo sempre, o problema aqui é que para publicar a matéria na íntegra, tem que criar uma nova página todo santo dia, mais ou menos assim sp-29-09-2009.html, no dia seguinte sp-30-09-2009.html , sp-01-10-2009.html e assim por diante, para ter isso editado pelo FCKEditor, como seria? pois lá eu vou editar sempre a mesma página. Ou há possibilidade de usar o mesmo modelo, e salvar sempre com outro nome? Gernado assim um novo html.

 

Outro detalhe, é que tem um índice de todos os dias, organizado por estado, município e data. No total serão 3 páginas, a home, o índice e a matéria, todas atualizadas diariamente, e a da matéria, sempre será uma nova html.

[Keyth 0]

Olá segui o tutorial, até consegui rodar o editor na pagina que eu queria, porem quando clico no botao de imagem ele só mostra o formulario de "informacoes da figura", as outras abas como "enviar ao servidor" ou "hiperlink" nao funcionam e mostra apenas o botao de cancelar, sabes o que pode ser?

 

ja alterei o conector config.asp, criei a pasta userfiles na raiz...

 

Obrigada

 

Keyth Roy

 

 

consegui resolver atualizando para a versao 2.6.6 ... obrigada!!!

[João Vitor A. Molero 0]

Silva, estou com um problema em meu editor.

Quando eu clico nos botoes para inserir uma imagem ou criar uma ancora ou inserir um arquivo de flash, ao inves de abrir a janela para as insercoes ele abre um subdominio do meu site, poderia dar uma ajuda ae ?

segue o link: http://www.concursosolucao.com.br/editor/editor.asp

 

T+

[Creedence 1]

Boa tarde !

Estou tentando implementar esse editor (essa mesma versao). Alterei conforme informado as variaveis abaixo para asp

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

No config.asp alterei:

ConfigIsEnabled = True '

ConfigUserFilesPath = "/caminhodosarquivos/"

 

No entanto quando vou inserir uma imagem no texto (botao inserir/editar figura) e me mostra a janela para Localizar no Servidor eu clico e mostra msg:

"This connector is disable. Please check the "editor/filemanager/connectors/php/config.php" file .

 

Mas o arquivo qfckconfig.js já foi alterado conforme informado acima direcionando as variaveis para asp.

 

Teria algum outro ajuste a fazer em alguma configuração ?

Dei um passada nesses arquivos e não encontrei.

 

Agradeço a ajuda

 

Creedence

[xanburzum 169]

o caminho esta correto em editor/filemanager/connectors/php/config.php