Hero

Trucos para el módulo WYSIWYG en Drupal 7

Octubre 14, 2014

enzo
Drupal
Desarrollo de Modulos

Para muchos el módulo de WYSIWYG es casi que uno de los importante en Drupal y no por nada por fin lo incluyeron en la versión de Drupal 8.

Como ya casi todos sabes sirve de un punto común de integración para muchos editores como CKeditor, TinyMCE y etc, requiriendo solo la instalación de la librería. Hasta aquí todo bien pero esta implementación que trata de generalizar hace que se pierdan ciertas cosas que sin con posible con implementación especificas como el módulo de CKeditor y el de TinyMCE por mencionar solo algunos.

Por eso hoy quiero mostrarles algunos trucos para interactuar con el modulo de WYSIWYG

  1. Desactivar Editor en campos específicos.

Un solicitud muy común es desactivar en ciertos campos el editor WYSIWYG, esto porque por definición cualquier field de content type que sea un textarea es secuestrado por el módulo WYSIWYG y mostrado como un editor.

Si queremos llevar acabo esta tarea debemos usar una opción no muy bien documentada del módulo de WYSIWYG, para esto debemos interceptar el proceso de render los formularios ya sea usando un hook_form_alter() o un hook_form_FORM_ID_alter(), imaginemos que deseamos desactivar el WYSIWYG en los campos body y summary como se muestra a continuación.

$form['body'][LANGUAGE_NONE][0]['#wysiwyg'] = FALSE;

$form['field_summary'][LANGUAGE_NONE][0]['#wysiwyg'] = FALSE;

Como resultado nuestros campos solo aparecerán como campos textarea comunes y corrientes.

  1. Actualizar el contenido de un WYSIWYG editor.

Como ya mencione anteriormente los editores WYSIWYG secuestran los campos de textarea, por tal motivo si queremos dinámicamente asignar valores a este campo en tiempo de edición no es suficiente con alterar el input del textarea porque este no esta integrando directamente con el campo, solo al guardar se actualiza.

Pero si deseamos que los valores de nuestro campo cambien mediante la interacción del usuario es una tarea complicada.

Por suerte para mi al menos descubrí que a nivel de JS existe un array que reference cada Editor WYSIWYG este arreglo se encuenta en Drupal.wysiwyg.instances y el nombre del campo es la llave de la instancia un ejemplo seria

Drupal.wysiwyg.instances['edit-field-mpx-video-description-und-0-value']

Luego de que tenemos identificada la instancia podemos usar el método insert para sustituir el contenido del editor, por ejemplo imaginemos que tenemos un botón que al presionarlo se hace un llamado Ajax y este trae algún valor y deseamos utilizar este valor como nuestro contenido del editor, para esta tarea nuestro código luciría similar al siguiente.

$.ajax({
  url: "example.com/random_description.json",
  context: document.body
}).done(function(data) {
  Drupal.wysiwyg.instances['edit-field-video-description-und-0-value'].insert(data.description);
});

Espero que haya sido de su agrado.

Recibe consejos y oportunidades de trabajo 100% remotas y en dólares de weKnow Inc.