Diferencia entre revisiones de «CKEditor, el mejor WYSIWYG.»
De KumbiaPHP Framework Wiki
| (No se muestran 11 ediciones intermedias del mismo usuario) | |||
| Línea 1: | Línea 1: | ||
| − | <source | + | === <font color="red">CODIGO ESCRITO EN BETA 2, PARA LA BETA 1 CAMBIAR Tag::js POR javascript_include_tag</font> === |
| + | 0) Descarga el ckeditor y el ckfinder en /public/javascript/ckeditor y /public/javascript/ckfinder | ||
| + | |||
| + | 1) Guarda el codigo de abajo en /app/views/_shared/partials/ckeditor.phtml | ||
| + | |||
| + | 2) Ejecuta el partial al final de tu view: View::partial( 'ckeditor' ); | ||
| + | |||
| + | <source lang=html4strict> | ||
<!-- ESTO NORMALMENTE DEBERIA ESTAR EN TU ARCHIVO CSS. ES SOLO PARA EL EJEMPLO DE ABAJO --> | <!-- ESTO NORMALMENTE DEBERIA ESTAR EN TU ARCHIVO CSS. ES SOLO PARA EL EJEMPLO DE ABAJO --> | ||
<style> | <style> | ||
| − | blue-especial { | + | blue-especial { color:#266FDC; } |
| − | orange-especial { | + | orange-especial { color:#F2AC24; } |
</style> | </style> | ||
</source> | </source> | ||
| − | <source | + | <source lang=php> |
<?php | <?php | ||
# CKEDITOR, EDITOR WYSIWYG. DESCARGA: http://ckeditor.com/download | # CKEDITOR, EDITOR WYSIWYG. DESCARGA: http://ckeditor.com/download | ||
| Línea 16: | Línea 23: | ||
</source> | </source> | ||
| − | <source | + | <source lang=javascript> |
<script> | <script> | ||
// RUTA DEL CKFINDER. FEATURES: http://docs.cksource.com/ckfinder_2.x_api/ | // RUTA DEL CKFINDER. FEATURES: http://docs.cksource.com/ckfinder_2.x_api/ | ||
| Línea 33: | Línea 40: | ||
</source> | </source> | ||
| − | <source | + | <source lang=html4strict> |
<!-- | <!-- | ||
| − | RECUERDA CAMBIAR | + | RECUERDA CAMBIAR LOS SIGUIENTES 4 PUNTOS EN /javascript/ckfinder/config.php |
| − | POR DEFECTO ESTA EN FALSE Y NO VERAS LOS ARCHIVOS DEL SERVIDOR | + | 1) POR DEFECTO ESTA EN FALSE Y NO VERAS LOS ARCHIVOS DEL SERVIDOR |
function CheckAuthentication() | function CheckAuthentication() | ||
{ | { | ||
| Línea 43: | Línea 50: | ||
} | } | ||
| − | AQUI EL PUBLIC DE TU APP | + | 2) AQUI EL PUBLIC DE TU APP |
$baseUrl = '/'; | $baseUrl = '/'; | ||
| − | CAMBIA images POR img | + | 3) CAMBIA images POR img |
'url' => $baseUrl . 'img', | 'url' => $baseUrl . 'img', | ||
'directory' => $baseDir . 'img', | 'directory' => $baseDir . 'img', | ||
| − | CAMBIA flash POR swf | + | 4) CAMBIA flash POR swf |
'url' => $baseUrl . 'swf', | 'url' => $baseUrl . 'swf', | ||
'directory' => $baseDir . 'swf', | 'directory' => $baseDir . 'swf', | ||
--> | --> | ||
</source> | </source> | ||
Revisión actual del 17:13 13 ene 2011
CODIGO ESCRITO EN BETA 2, PARA LA BETA 1 CAMBIAR Tag::js POR javascript_include_tag[editar]
0) Descarga el ckeditor y el ckfinder en /public/javascript/ckeditor y /public/javascript/ckfinder
1) Guarda el codigo de abajo en /app/views/_shared/partials/ckeditor.phtml
2) Ejecuta el partial al final de tu view: View::partial( 'ckeditor' );
<!-- ESTO NORMALMENTE DEBERIA ESTAR EN TU ARCHIVO CSS. ES SOLO PARA EL EJEMPLO DE ABAJO -->
<style>
blue-especial { color:#266FDC; }
orange-especial { color:#F2AC24; }
</style><?php
# CKEDITOR, EDITOR WYSIWYG. DESCARGA: http://ckeditor.com/download
echo Tag::js( 'ckeditor/ckeditor' );
# CKFINDER, EXPLORADOR DE ARCHIVOS. DESCARGA: http://ckfinder.com/download
echo Tag::js( 'ckfinder/ckfinder' );
?><script>
// RUTA DEL CKFINDER. FEATURES: http://docs.cksource.com/ckfinder_2.x_api/
CKFinder.setupCKEditor( CKEDITOR, '/javascript/ckfinder/' ) ;
// PARA AÑADIR ESTILOS PERSONALIZADOS
CKEDITOR.stylesSet.add( 'default',
[
// CADA LINEA DE ESTAS ES UNA CLASE TUYA PERSONALIZADA DE TU STYLE O ARCHIVO CSS
{ name : 'blue-especial', element : 'span', attributes : { 'class' : 'blue' } },
// RECUERDA. LA ULTIMA LINEA SIN COMA XD
{ name : 'orange-especial', element : 'span', attributes : { 'class' : 'orange' } }
]);
// PARA CONFIGURAR LA ALTURA DEL TEXTAREA. MAS FEATURES: http://docs.cksource.com/ckeditor_api/
CKEDITOR.config.height = 400;
</script><!--
RECUERDA CAMBIAR LOS SIGUIENTES 4 PUNTOS EN /javascript/ckfinder/config.php
1) POR DEFECTO ESTA EN FALSE Y NO VERAS LOS ARCHIVOS DEL SERVIDOR
function CheckAuthentication()
{
return true;
}
2) AQUI EL PUBLIC DE TU APP
$baseUrl = '/';
3) CAMBIA images POR img
'url' => $baseUrl . 'img',
'directory' => $baseDir . 'img',
4) CAMBIA flash POR swf
'url' => $baseUrl . 'swf',
'directory' => $baseDir . 'swf',
-->