El futuro de los complementos de WordPress con Gutenberg

Gutenberg! El futuro editor de WordPress que nos ayudará a escribir publicaciones, crear modelos hermosos y finalmente deshacerse de las páginas infames. Bueno, al menos nos prometieron, porque, aunque se ve muy bien, todavía es bastante verde. Si no sabe nada sobre el proyecto (¿habla en serio?), Hay muchas reseñas que discuten sus ventajas y desventajas. La revisión de Gutenberg de Wplift es una introducción de proyecto bastante buena: Gutenberg ofrece una versión completamente diferente del editor predeterminado de WordPress. En lugar de un largo cuadro de introducción que funciona en principio como un documento de Word, el editor ahora se divide en bloques individuales. Un bloque puede contener varios párrafos de texto, otra imagen y otro botón. Entonces y así sucesivamente.
(…) Creo que Gutenberg es una mejora para los usuarios ocasionales que les gusta escribir su contenido en el editor de WordPress. Pero, como una persona que escribe y carga varias publicaciones al día de Google Docs, no veo ningún beneficio para Gutenberg dependiendo de cómo trabajo. Todo lo que haces es hacer que sea mucho más difícil introducir contenido de algo como Google Docs. Colin Newcomer – Wplift, por lo tanto, trae un nuevo paradigma para crear contenido (bloques), lo que podría ser una mejora para usuarios ocasionales. Pero tal cambio de paradigma podría no ser lo que necesitas. Solo el tiempo nos dirá si Gutenberg fue la decisión correcta o no creo personalmente y espero que sea, porque es una idea interesante con mucho potencial (una opinión compartida por algunas de las personas que entrevisté recientemente en nuestro blog, como Caspar o Alice).
De todos modos, Gutenberg es claramente un tema candente y no pudimos dejar pasar otra semana sin discutirlo. Como acabo de decir, es un proyecto prometedor, pero hay algunos problemas que nos preocupan. Específicamente, la integración de complementos (sí, pienso en Neli Content y Nelio A/B Testing) con el nuevo editor parecía complicada hasta hace poco … Gutenberg: el nuevo editor The WordPress Editors es un viejo conocido. Aunque ha recibido algo para lavar la cara en los últimos años (especialmente con la aparición de WordPress 3.8 y la integración del proyecto MP6), la verdad es que él sigue siendo el editor clásico, basado en Tinymce, Wysiwyg, con la barra de herramientas en la parte superior y un estilo. quienes están tratando de imitar lo que nuestros usuarios verán cuando accedan a la publicación: editor actual de WordPress -ing -Insidur. Gutenberg cambia completamente el paradigma y “moderniza” cómo escribimos publicaciones. Como acabamos de ver, la principal novedad de este editor es que la copia completa de la publicación está organizada en bloques: un párrafo, una cita, una imagen … una galería … todas independientes, con la suya propia Edición contextual y capacidad para moverlos fácilmente:

Captura de pantalla de Gutenberg, donde puedes ver más bloques y acciones contextuales. Como puede ver, Gutenberg tiene una interfaz mucho más limpia y minimalista que el editor clásico. Personalmente, me gusta este diseño, porque cuanto más simples las interfaces de usuario, mejor, un UX más hermoso ayudará a WordPress a atraer nuevos usuarios y volver a participar el menos activo. Pero, como enfatizó Colin en Wplift, cambia radicalmente la forma en que creamos contenido, por lo que todavía no sé si las redactores profesionales saludarán a Gutenberg o más bien para usar el antiguo editor. Hoy, no estoy interesado en revisar nuevamente Gutenberg y sus funcionalidades . En cambio, quiero centrarme en algo muy, muy importante para el ecosistema de WordPress: integración de complementos de WordPress con el nuevo editor. Si no lo ha notado, la página de WordPress Edition no incluye al editor, pero está lleno de cuadros con funcionalidades adicionales. Muchas de estas cajas son características incluidas en sus complementos, como cajas de redes sociales o referencias agregadas por Nelio Content:

Captura de pantalla con múltiples metacasas de WordPress. En particular, hay un fragmento de la caja de SEO de Yoast, los cuadros de referencia de contenido de Nelio y las redes sociales y el cuadro de meta categoría. Problemas de integración: cajas de editor (Meta). Las primeras versiones de Gutenberg no trataron el problema de las meta cajas (no era una prioridad) y simplemente había un problema en el almacén de GitHub, que comentan sobre la necesidad de integrarlas en algún momento. El problema de tal integración es que es mucho más complicado de lo que parece. Por un lado, tenemos que el equipo de desarrollo de Gutenberg utiliza tecnologías bastante modernas para su implementación (prácticamente, escriben todo desde cero con React, un marco de JavaScript), por lo que retratan el metabox actual (definido en PHP) en el nuevo editor CAN Can ser bastante complicado. Por otro lado, el proyecto no definió dónde y cómo colocamos esas cajas (tenga en cuenta que hay prácticamente dos áreas posibles: cajas más pequeñas en el costado y cajas más grandes debajo del editor).
¿Cómo podemos resolver todo esto? Por ahora, el equipo de Gutenberg ha preparado un área (configuración extendida) bajo el editor donde, en teoría, podemos poner nuestras cajas. De hecho, hace unos días, el equipo anunció que Gutenberg 1.5 incluye “un pasaje inicial para admitir las meta-boxes existentes”. Este es claramente un gran paso adelante, pero me hizo darme cuenta de que Gutenberg en realidad reinventa la rueda y vuelve a lo que ya tenía: un editor de metabox adicional a su alrededor. Por lo tanto, ¿era realmente necesario reescribir toda la pantalla de edición posterior? Hace unos días estaba leyendo el blog de Yoast y vi que el problema de integrar complementos con Gutenberg es algo que los preocupa. En su publicación, Joost destaca lo que le acabo de decir: Gutenberg y la edición de los bloques revolucionarán WordPress, pero su implementación no tiene que cambiar toda la interfaz de usuario a la vez. De hecho, sería suficiente cambiar el editor en sí del clásico Tinymce a Gutenberg y mantener la pantalla de edición tal como es, con su concepto “antiguo” de cajas a su alrededor: interfaz alternativa de Gutenberg propuesta por Yoast. Básicamente, esta propuesta mantiene la pantalla de edición clásica y simplemente reemplaza a TinyMCE con Gutenberg. Con esta propuesta, observamos una interfaz más familiar y totalmente compatible con la espalda (al menos en el papel, la verdad es que no sé si hay problemas internos/de implementación). Después de la idea de Yoast, es muy simple pensar en cómo un complemento podría parecerse al contenido de Nelio dentro de Gutenberg:

El contenido integrado de Nelio en Gutenberg utilizando la propuesta de Yoast. Sin lugar a dudas, una solución simple, elegante y funcional. La única desventaja que algunas personas podrían ver es que realmente no “innovamos”, todavía estamos con la misma solución antigua y, por lo tanto, con los mismos viejos problemas. Pero honestamente creo que esto no es un inconveniente, sino una virtud. El uso de este tipo de solución nos permite presentar a Guntenberg dando pequeños pasos, reemplazando los componentes uno por uno: primero el editor, luego las cajas, etc. Si está interesado en ver algunas soluciones “innovadoras”, hay algunas en Github que de alguna manera de alguna manera Elimina el concepto de “metabox” e integra estos “ajustes adicionales” en el propio editor:
Integración de campos personalizados en la pantalla del editor. Para separarlos del contenido real, la propuesta agrega un divisor entre los dos. Pero no estoy particularmente atraído por ellos … ¡hay demasiada información (delantera y back -end) en el mismo componente! El poder de WordPress como CMS si WordPress es donde está hoy, se debe a su enorme versatilidad. WordPress ha sido más que una plataforma de blogs durante muchos años, por lo que no podemos rehacer el editor solo en función de las entradas de blog (así es como dice Gutenberg en este momento). Por ejemplo, Kevin Whoffman comparte la próxima captura de pantalla de una interfaz de usuario bastante habitual para publicaciones personalizadas:


Edición de un tipo de publicación personalizado utilizando el editor actual de WordPress. ¿Cómo sería esto en Gutenberg? Como Kevin nos dice, estamos tratando con un contenido personalizado que depende exclusiva y exclusivamente de campos personalizados. Este tipo de contenido ni siquiera tiene el clásico editor de WordPress, entonces, ¿cuál es el propósito de usar Gutenberg? ¿Cómo podríamos adaptar esto a la propuesta actual de Gutenberg? La grabación del apoyo a Gutenberg en CPTS no se ha confirmado y, sinceramente, parece evitar el problema de Metabox que resolverlo. Kevin Whoffman usando la solución de Yoast, este escenario no sería un problema, todavía tendríamos metaboxs comunes, y el editor (Gutenberg) aún sería opcional. Comparitadamente, puede llegar con tantas cajas en la pantalla de edición que el propósito de “Ser simple” simplemente desaparece. Una posible solución a esta explosión de metaboxes registrados es el uso de vistas para su agrupación. El editor actual de Gutenberg le permite cambiar entre un editor visual y un editor de texto, a través de un pequeño menú en la esquina superior derecha (en la propuesta de Yoast está en la esquina superior izquierda):

Gutenberg tiene diferentes vistas disponibles. Si tuviéramos más? Bueno, podríamos agregar nuevas “vistas” a ese menú, de modo que la interfaz presentada al usuario (es decir, para que el conjunto de cuadros/herramientas que ve) depende de la visualización que usa en algún momento. El conjunto de vistas disponibles puede depender completamente de los complementos o puede ser predeterminado en 4 o 5 categorías principales. Por ejemplo, comenzaría con algo como esto: edición visual. Aquí tendríamos al editor visual con las cajas típicas: categorías, etiquetas, publicación, etc.
Edición bruta. En este tipo de edición, tendríamos valores predeterminados el Editor de texto/HTML, junto con, nuevamente, los cuadros en el editor visual (sí, el mismo cuadro podría aparecer en varias vistas). En los tipos de publicaciones personalizadas, como las de Kevin, no habría opción para seleccionar la visualización de edición visual, y la edición bruta no incluiría el editor de texto: solo ofrecerían el cuadro creado con campos personalizados avanzados para editar los meta campos ..

Analítica. Aquí podríamos tener cajas como las incluidas en el contenido NELI, con información de las redes sociales, Google Analytics, Yoast Quality Analysis, etc.

Social. En esta visualización, aparecerían cajas que tratan con las interacciones de los lectores: mensajes sociales del contenido Neli, cuadros de comentarios de WordPress, etc.
Meta. Aquí encontrará otras cajas que no se ajusten a ningún otro lugar.