Instalación de wysiwyg en drupal 7

13
Instalación de WYSIWYG en Drupal 7 Cristian Mamani [email protected] Diciembre - 2012

description

Esta presentación muestra como instalar WYSIWYG en Drupal 7.

Transcript of Instalación de wysiwyg en drupal 7

Page 1: Instalación de wysiwyg en drupal 7

Instalación de WYSIWYG en Drupal 7

Cristian [email protected]

Diciembre - 2012

Page 2: Instalación de wysiwyg en drupal 7

Acerca de Cristian Mamani

Trabajo

Drupal developer en

Comunidad

Miembro activo de la comunidad Drupal Bolivia

Contacto

@xjkwak en Facebook y Twitter

Web http://eldrupalero.com

Page 3: Instalación de wysiwyg en drupal 7

WYSIWYG

WYSIWYG es el acrónimo de What You See Is What You Get (lo que ves es lo que obtienes)

Este módulo permite agregar Editores WYSIWYG que facilitan la introducción de contenido con texto enriquecido en un área de texto.

Los editores de texto enriquecido permiten agregar imágenes, texto, estilos sin necesidad de tener que escribir HTML

Page 4: Instalación de wysiwyg en drupal 7

Instalación de WYSIWYG

Lo descargas de http://drupal.org/project/wysiwyg

Y como cualquier otro módulo contribuido lo descomprimes y lo colocas en la carpeta sites/all/modules de tu sitio Drupal.

No tiene dependencias de otros módulos.

Page 5: Instalación de wysiwyg en drupal 7

Perfiles de WYSIWYG (I)

Un perfil WYSIWYG está asociado a un Formato de Entrada.

Un perfil WYSIWYG define:− El Editor que se mostrará con un particular Formato de

Entrada.

− Los botones y temas que estarán habilitados para el Editor.

− Forma de presentación del Editor Para poder configurar un Perfil de WYSIWYG es

necesario tener instalado antes la librería de un Editor.

Page 6: Instalación de wysiwyg en drupal 7

Perfiles de WYSIWYG (II)

admin/config/content/wysiwyg

Lista de todaslas librerías deEditor que pordefecto soportaWYSIWYG. Semuestra unmensaje que indica que no setiene instalado.

Page 7: Instalación de wysiwyg en drupal 7

Editores WYSIWYG WYSIWYG se integra por defecto con alguno de

estos:− jWYSIWYG (http://code.google.com/p/jwysiwyg/)

− CKEditor (http://ckeditor.com/)

− WYMEditor (http://www.wymeditor.org/)

− YUIEditor (http://developer.yahoo.com/yui/editor/)

− Whizzywig (http://www.unverse.net/)

− Nic (http://nicedit.com/)

− openWYSIWYG (http://www.openwebware.com/)

− TinyMCE (http://tinymce.moxiecode.com/)

− FCKEditor (http://www.fckeditor.net/)

− MarItUp (http://markitup.jaysalvat.com/)

Page 8: Instalación de wysiwyg en drupal 7

Instalando un Editor

Para instalar un editor de los que son soportados por WYSIWYG, debemos descargarlo, descomprimirlo y ubicarlo en sites/all/libraries/[editor]

La página de perfiles de WYSIWYG provee información de instalación para cada Editor. Ej:

Page 9: Instalación de wysiwyg en drupal 7

Instalando TinyMCE Editor (I)

Editor de texto enriquecido TinyMCE

Page 10: Instalación de wysiwyg en drupal 7

Instalando TinyMCE Editor (II)

Descargarlo, descomprimirlo y ubicarlo en sites/all/libraries/tinymce de tal manera que el archivo principal sea encontrado en sites/all/libraries/tinymce/jscripts/tiny_mce/tiny_mce.js

Volver a la página de perfiles para relacionar un formato de entrada con el Editor TinyMCE.

Lo siguiente es activar los botones y plugins.

Page 11: Instalación de wysiwyg en drupal 7

Configurar el TinyMCE Editor

Algo principal será activar los botones que van a mostrarse en el Editor, los mismos que deben estar en relación con el Formato de Entrada.

Ej: Si queremos poder añadir imágenes en el editor, además de activar el botón 'Imagen' el Formato de Entrada deberá soportar la etiqueta <img>

Page 12: Instalación de wysiwyg en drupal 7

Viendo el TinyMCE en acción

Finalmente para poder ver el Editor TinyMCE, debemos verlo en un campo que tenga el Formato de Entrada al cual se le asoció el Editor.

Page 13: Instalación de wysiwyg en drupal 7

Gracias