Editor vs. Compositor Sencillo editor de texto WYSIWYG frente al plugin de arrastrar y soltar

Los «compositores visuales» son una de las tendencias en WordPress. Cualquiera que quiera crear páginas y artículos en el sistema de gestión de contenidos WordPress depende del editor WP integrado. El WP-Editor es, en definitiva, un editor WYSIWYG, es decir, un editor «lo que ves es lo que obtienes». Esto significa que, al igual que el conocido programa ofimático Word de Microsoft, siempre verá los cambios en directo. Poner una palabra en negrita es negrita. Subraya una palabra y queda subrayada. Así es exactamente como funciona el editor de WordPress, lo que haces es lo que ves. Para proyectos en línea más pequeños, sitios web y blogs, esta función es perfectamente suficiente. Sin embargo, a medida que WordPress se ha hecho más popular, se han implementado sitios cada vez más grandes utilizando el sistema. Sin embargo, muchos de los diseñadores web y gestores de medios no querían conformarse con simples campos de texto y querían embellecer el diseño individual de las páginas. Mediante iconos individuales, fondos individuales, deslizadores, imágenes grandes y mucho más.

¿Editor clásico de WordPress o Composer?

Para un profesional, esto no es ningún problema, escribe unas pocas líneas de código con HTML y CSS y ya está. Sin embargo, el principio de un sistema de gestión de contenidos es gestionar grandes cantidades de datos e, idealmente, hacerlos fácilmente accesibles, editables y eliminables para los usuarios. Por lo tanto, es aconsejable tener una interfaz agradable y fácil de usar, en la que sea fácil trabajar incluso sin muchos conocimientos técnicos.

Principio, diseño con shortcodes

Para dar estilo a las páginas de una manera relativamente sencilla, surgió la idea de utilizar códigos cortos. Estos códigos cortos combinan un código más complicado en etiquetas simples que luego pueden ser utilizadas por el usuario. Un ejemplo sencillo sería envolver un titular elegante en un shortcode:

[ titular ]Aquí está el titular[ /titular ].

… el elemento adquiere un color especial, una posición especial, tal vez un tipo de letra diferente, la fuerza de la fuente y mucho más. Antes de empezar a teclear complicadas propiedades HTML y CSS, sería inteligente utilizar simplemente el término titular. Y así es exactamente como funciona el principio de los códigos cortos: se empaquetan códigos más complicados y largos en pequeños fragmentos simples. El problema de este principio es que se necesita mucha imaginación visual, porque el usuario ve código, no un titular bien formateado. Y ahora imaginemos que aumentamos un poco la complejidad e incluimos tablas, con exactamente el mismo espaciado, que también se colorean en el fondo, individualmente, una vez azul, otra amarilla y otra naranja. Aquí es donde los shortcodes alcanzan sus límites, al menos para los no técnicos.

Nuevo: Componer en el editor de WordPress

Para que el contenido pueda ser colocado muy fácilmente y además sea directamente visible, en su posición aproximada, en su forma aproximada, existen desde hace tiempo varias alternativas al editor estándar de WP: Composer. Puedes descargarlos normalmente, instalarlos en tu sistema WordPress y listo. Puede encontrar todas las descargas importantes aquí y también al final del artículo.

En el primer paso, se instala el compositor de su elección como un plugin normal en su tablero de WordPress. En un paso más, se activa el plugin como de costumbre. ¿Qué ha cambiado ahora? Páginas y puestos. Primero vamos a echar otro vistazo a su tablero de WordPress, aquí encontrará todos los puntos importantes para usted de nuevo de un vistazo, desde las entradas del blog a los medios de comunicación a los comentarios y extensiones. Para nuestra tarea de hoy son relevantes las páginas y los puestos. En principio, las páginas y las entradas sólo se diferencian en que se categorizan y se cronometran las entradas como en un blog clásico. Las páginas son todas estáticas, como los términos y condiciones, las páginas de contacto o «Sobre nosotros», pero también la página de inicio, etc.

El elemento más importante del panel de control de WP para su sitio web:

wordpress-dashboard-grundelemente-erklaerung

Activar WP Composer

En el siguiente ejemplo, utilizamos el editor de diseño en el tema de WordPress Enfold (se puede encontrar aquí). Independientemente de si usas el Editor de Diseño o el Compositor Visual de WP Bakery, ahora encontrarás un botón azul en cada página o post individual que te lleva al Compositor o cambia el modo del Editor de WP al Compositor.

wordpress-dashboard-theme-editorauswahl-03

Muchas ventajas, mucha flexibilidad

Veamos primero las innumerables ventajas que le aporta el Compositor. En primer lugar, tenemos la compilación responsiva de contenidos para ordenadores y dispositivos móviles. El Compositor permite que las columnas y filas se vean como elementos individuales y se adapten según el tamaño de la pantalla, es decir, escritorio, tableta o smartphone. Además, tiene una interfaz visual, no necesita HTML, CSS o shortcodes para crear elementos fuertes como fondos de video. Todos los elementos dentro de las páginas o entradas se pueden mover fácil e intuitivamente a través de arrastrar y soltar. La estructura de los elementos individuales está definida y es siempre la misma, lo que da a su sitio web un aspecto uniforme y la orientación del usuario y, por lo tanto, menos molestias durante la visita.

Otras ventajas:

  • Los elementos se pueden posicionar libremente, incluso sin tener conocimientos de HTML, CSS
  • Los medios de comunicación, las imágenes, etc. son fáciles de integrar
  • Podemos crear diseños como plantillas

wordpress-dashboard-theme-editor-drag-n-drop-01

Columnas, celdas y estructura

Veamos ahora la imagen 4. Ahí encontrarás la conclusión de la pequeña introducción al trabajo con editores visuales en WordPress. Este es también el último paso en mis talleres, porque trabajar con un compositor es muy intuitivo y se aprende mejor por ensayo y error. Tampoco se necesita mucho tiempo, porque los elementos suelen limitarse a veinte. Con la formación independiente, el uso del compositor es más fácil y rápido de entender. Los resultados serán rápidamente muy buenos, ya que la aplicación es realmente sencilla con un poco de orientación e imaginación:

wordpress-dashboard-editor-composer-elemente-aufbau-01

Mi consejo: que sea sencillo

Observe la estructura de la imagen 4, a menudo no es necesario que haya encabezados especiales, basta con un campo de texto. Establece una sección, o trabaja con una columna, coloca un elemento de texto aquí y ve lo que sucede. Con la vista previa (arriba a la derecha en la página de edición), puedes ver el resultado en una nueva pestaña del navegador. Ahora ve un poco más allá y coloca una línea nuestro primer campo de texto. Haga un encabezado del campo de texto y coloque un nuevo campo de texto al final. Hecho. Puede simplemente copiar estos campos en un compositor y crear directamente tres, cuatro o cinco párrafos. De este modo, podrá crear rápidamente un diseño y también formar rápidamente a los nuevos empleados y mostrarles cómo funciona la gestión eficaz de los contenidos.

Si tiene alguna pregunta sobre la gestión de contenidos, el marketing de contenidos, WordPress o los talleres para la formación de sus empleados, llámenos. Tenemos conceptos de talleres eficaces y sólidos que hemos probado muchas veces en estrecha colaboración con nuestros clientes. También puede beneficiarse de nuestra experiencia y conocimientos como empresarios y consultores en línea.

En este punto, sin embargo, me gustaría advertirte que utilices Composer sólo para un puñado de páginas de forma muy focalizada para no prolongar innecesariamente la velocidad de carga.