Independientemente de cuál sea su objetivo con la plataforma, utilizará el editor de publicaciones / páginas con gran capacidad. Por lo tanto, queremos mostrarle cómo usar el editor de WordPress al máximo para que su contenido brille y su sitio florezca.
¿Qué es el editor de WordPress?
Técnicamente, hay tres editores de WordPress entre los que puede elegir. Con el lanzamiento de WordPress 5.0, el editor cambió de TinyMCE por defecto al Editor de bloques que tenemos hoy. En medio de ese cambio, el complemento del editor Gutenberg se lanzó como un puente para probar nuevas características beta para el Editor de bloques antes de convertirlo en WordPress Core.
Si bien el Editor de bloques está predeterminado en WP a partir de 5.0, puede elegir usar cualquiera de los tres que desee. Puede instalar el complemento Editor clásico para mantener el TinyMCE de antaño, el complemento Gutenberg para mantener las funciones más nuevas (aunque potencialmente inestables) en su editor, o puede mantener el Editor de bloques predeterminado.
Dados los pasos adicionales involucrados en el uso de cualquier cosa que no sea el editor predeterminado (y la inestabilidad inherente y la naturaleza cambiante del complemento Gutenberg), nos centraremos únicamente en el Editor de bloques predeterminado en esta publicación. Sin embargo, debe tener en cuenta que los fundamentos son los mismos con Gutenberg, y el TinyMCE contenido en el complemento Classic Editor tiene una paridad de características básicas con cualquier editor de texto enriquecido o software de procesamiento de texto, por no mencionar ninguna funcionalidad específica de WP que analicemos. terminado, generalmente difieren solo en estética, no en función.
Con todo lo dicho, aprendamos cómo usar el editor de WordPress.
Los fundamentos del editor de WordPress
Cada vez que cree una página o una publicación (o un tipo de publicación personalizada), utilizará el Editor de bloques. Se le presenta un tutorial tutorial sobre cómo abrirlo, y puede aprender los conceptos básicos siguiendo las 4 diapositivas que ofrece. Ciérrelo y podrá ver el editor básico.
El editor de bloques básico de WordPress consta de 5 elementos. Varios complementos pueden agregar más, pero estos proporcionan la funcionalidad básica con la que trabajará día tras día.
- Bloque de título : lo que ingrese aquí se mostrará como la etiqueta principal H1 de la publicación / página.
- Área de bloque / contenido : esta es el área en la que agregará los diversos bloques que conforman el contenido de su publicación o página.
- Botón Agregar bloque : cada vez que vea un + en un círculo, puede hacer clic para agregar un nuevo bloque. Aparecerá un menú desplegable, desde el que elige el tipo que desea insertar. Todos funcionan exactamente igual, por lo que si hace clic en uno a la derecha de un bloque, debajo de un bloque o en la esquina de la pantalla, obtiene las mismas opciones.
- Pestaña Opciones de documento : en esta pestaña, encontrará de todo, desde categorías, etiquetas, enlaces permanentes, comentarios activados / desactivados, y más. Los complementos pueden agregar opciones aquí, pero siempre se aplican a la página general o se publican.
- Pestaña Opciones de bloque : esta pestaña maneja las opciones para cualquier bloque que resalte. Si hace clic en un bloque de párrafo, edita las opciones para ese bloque solo . Ningún otro bloque, ni el documento en sí cambian.
A continuación, lo guiaremos a través de los detalles de estas áreas y cómo puede usarlas para crear el mejor contenido posible.
¿Qué son los bloques?
Ya nos has visto mencionar Bloques en esta publicación, pero ¿qué son? Un bloque es un elemento único y personalizable de una página o publicación. Puede ser un solo párrafo, una lista, una imagen o una galería. Estos bloques se pueden mover y ajustar a su gusto, personalizarlos individualmente y brindarle un control granular sobre su contenido de una manera que un editor WYSIWYG simplemente no puede. (Si es un usuario de Divi, ya está familiarizado con el concepto porque nuestros módulos funcionan de la misma manera).
Como puede ver arriba, cada elemento de la página está contenido en su propio bloque. Puede ver una lista completa de bloques de WordPress en la documentación de soporte de WordPress.
Cómo crear un grupo de bloques
Un grupo de bloques es una colección de bloques que configura para funcionar como un solo bloque. Los mueve y los estiliza como si fueran una sola unidad, pero el Grupo está formado por múltiples elementos.
Crear un grupo es fácil. Simplemente haga clic en un bloque, luego mantenga presionada la tecla Mayús o CTRL y haga clic en otro. Si desea agrupar todos los bloques en la publicación, puede presionar CTRL / CMD – A para seleccionar todos. Luego, cuando vea que el icono en la esquina superior izquierda cambia a un cuadrado formado por pequeños bloques, puede hacer clic en él y seleccionar Transformar en grupo .
Si necesita desagruparlos, simplemente haga clic en el botón desplegable de tres puntos y seleccione desagrupar.
Los bloques ahora funcionarán como individuos una vez más.
¿Qué son los bloques reutilizables?
Puede convertir cualquier bloque de un bloque único en un bloque reutilizable desde el menú de configuración. Un bloque reutilizable no es una plantilla, sino un bloque global para su sitio. Crea un bloque o grupo de bloques y luego hace clic en Agregar a bloques reutilizablesb.
Cualquier cambio o edición realizada en ese bloque reutilizable se refleja en todo el sitio, cambiando cada instancia del bloque en lugar de solo la que usted editó. Tenemos una guía completa de bloques reutilizables que puede consultar para obtener más información sobre el tema.
El bloque de título
El bloque de título como se muestra arriba es la etiqueta principal H1 de su publicación o página. También generará la babosa de enlace permanente para la publicación, pero eso se puede editar una vez que haya guardado la publicación al menos una vez. Esto también será de lo que extraerán los selectores CSS, como .post-title y .entry-title . (Sin embargo, sus complementos de SEO le permiten configurar lo que se muestra en los motores de búsqueda).
Este es el bloque dentro del editor de WordPress que no puede eliminar o reposicionar. Debe usar CSS o configuraciones externas del generador de páginas para ajustar más.
Área de bloque / contenido
Básicamente, puede considerar que el área de contenido esté donde escribe. Si lo desea, puede comenzar a escribir, escribir una publicación completa sin siquiera considerar los bloques. En todas las formas principales, esto reemplaza el área simple WYSIWYG de TinyMCE y es el mayor cambio en el editor de WordPress desde … bueno … nunca.
Sin embargo, con el Editor de bloques, puede hacer mucho más que eso. Cada vez que presione “enter” o “return”, agregará un nuevo bloque de párrafo. Para agregar un tipo diferente de bloque (de cualquier tipo), haga clic en el + en un círculo, y obtendrá un menú desplegable de cada bloque disponible. Asegúrese de desplazarse porque también están configurados en diferentes categorías. También puede buscar un bloque específico si sabe qué tipo desea.
Puede agregar bloques de video de YouTube, imágenes, galerías, reproductores de audio, listas, citas y mucho más. Cada uno de ellos tiene su propia configuración y opciones de estilo. Además, cuanto más uses un bloque, el editor de WordPress lo reconocerá como uno de uso común y lo incluirá en la lista de Usados más para que no tengas que desplazarte ni buscarlo más. Los bloques reutilizables y los grupos de bloques también pueden aparecer en Más usados.
Si observa las imágenes en esta sección, el (1) señala los botones de reordenamiento que obtiene para cada bloque cuando se selecciona (simplemente haga clic en él para seleccionar). El (2) apunta al menú desplegable que le permite eliminar el bloque, así como editar su contenido como HTML, clonarlo o agregar nuevos bloques a su alrededor.
Sin embargo, estas opciones y configuraciones son diferentes de la pestaña Opciones de bloque en la esquina superior derecha de la pantalla que mencionamos anteriormente y discutimos en la siguiente sección a continuación.
Esquema del documento, recuento de palabras y otra información
En la barra de herramientas superior de la página, tienes una i en un círculo. Haga clic en él y se le presentará un resumen completo de en qué consiste su documento.
Siempre que haya utilizado bloques de Encabezado, aparecerá un Esquema de documento además del recuento de palabras, el número de párrafo y el recuento de bloques. Si no tiene bloques de rumbo, esa sección no estará allí. Puede hacer clic en cualquiera de los elementos del esquema del documento para acceder directamente a ese bloque. Esta característica es invaluable en documentos más largos.
Si hace clic en el icono de la lista anidada al lado de ese, también verá una lista ordenada de todos los bloques en la publicación, en lugar de solo encabezados para un esquema.
Nuevamente, puede hacer clic en cualquier cosa de la lista para navegar directamente y seleccionar ese bloque.
Pestaña Opciones de bloque
En la esquina superior derecha del editor de WordPress, verá una pestaña que dice Bloquear . Siempre que tenga un bloque seleccionado, obtendrá un conjunto contextual de opciones para ese tipo de bloque. Sin embargo, cualquier cambio que realice afectará solo el bloque único que ha seleccionado.
Puede cambiar el tamaño de miniatura de una imagen en esta pestaña, agregar un fondo de color a un párrafo para crear una alerta, o ajustar el tamaño de fuente en un encabezado, por ejemplo. Si tiene abierta la pestaña Bloquear, las opciones cambian al bloque específico que seleccione. Si tiene el bloque de párrafo resaltado, verá esto.
Tener un Bloque de imagen seleccionado cambiará la pestaña Bloquear a esto.
Cada bloque tendrá opciones específicas que puede ajustar dentro de ellos que solo se aplican a ese tipo de bloque (y solo se mostrarán en ese bloque específico). Sin embargo, cada bloque tiene una sección Avanzada en la pestaña que le permite aplicar clases CSS a ese bloque. Luego puede diseñarlos como mejor le parezca usando hojas de estilo y código externos.
Ficha Opciones de documento
A la izquierda de la pestaña Opciones de bloque está la pestaña Opciones de documento . Si ha usado WordPress en el pasado, le resultará familiar. Aquí, podrá ajustar las categorías de su publicación, las etiquetas, agregar una imagen destacada, ajustar la barra de enlaces permanentes, agregar un extracto para el tema / uso de SEO y habilitar o deshabilitar los comentarios.
Cada una de estas secciones es prácticamente idéntica a dónde y qué eran en el editor TinyMCE WYSIWYG. Se aplican a toda la publicación o página y no a un solo bloque o al sitio completo. Además, como puede ver en la imagen de arriba, hay un cuadro de Opciones de WP Rocket. Algunos complementos aplicarán cuadros a esta área, pero siempre pertenecerán directamente al documento en sí, no tanto al contenido ni a los bloques.
Metaboxes adicionales de publicaciones
Los metaboxes para la publicación son donde los complementos agregarán nuevas opciones y capacidades para el contenido en sí. Aparecen al final del área de contenido, debajo de los bloques.
Lo que aparece en esta sección (si corresponde) dependerá de los complementos que haya instalado (o de cualquier característica de tema que pueda utilizar el área). Los complementos de SEO aprovechan mucho esta área y cualquier otra cosa que le permita interactuar de alguna manera con el contenido de la página, en lugar de los detalles del documento.
Menú desplegable de opciones del editor de WordPress
Si hace clic en el icono desplegable de tres puntos en la esquina superior derecha de la pantalla, aparecerá un gran menú desplegable vertical. Puede ajustar una serie de configuraciones aquí, todas las cuales se aplican al editor en sí, en lugar del documento, los bloques o el contenido.
En su mayor parte, son opciones bastante sencillas, como administrar sus bloques reutilizables o proporcionar una lista de atajos de teclado o reabrir la guía de bienvenida que mencionamos al principio.
Sin embargo, algunas de las opciones más utilizadas se encuentran cerca de la cima. Específicamente, se alterna entre la barra de herramientas superior , el modo de pantalla completa y los modos de editor visual / de código .
La barra de herramientas superior significa que, en lugar de que las opciones para un bloque seleccionado aparezcan como un menú contextual cerca de la esquina superior izquierda del bloque, como mencionamos anteriormente, estará en un área fija en la parte superior de la pantalla.
El modo de pantalla completa activa o desactiva el panel de administración de WordPress. Si deshabilita el modo de pantalla completa, verá la barra lateral izquierda que incluye las opciones típicas del tablero, como publicaciones, páginas, apariencia, configuración, herramientas, etc.
Y el editor Visual / Code alterna funciona exactamente como en el editor TinyMCE. Los ejemplos en esta publicación hasta ahora han sido con el Editor visual. Es decir, ves una representación visual de la publicación a medida que la escribes. Obtendrá botones para presionar, menús contextuales y una representación de la configuración en tiempo real a medida que los cambia. Sin embargo, el editor de código es solo eso: código. Tendrá un cuadro de texto simple en el que escribirá en texto plano y HTML.
Esto generalmente se hace para solucionar problemas con el editor o para ajustar una sola área o bloque. O tal vez pegar contenido escrito en un editor externo que no se formateará correctamente en varios bloques.
El editor de bloques utiliza etiquetas HTML específicas para indicarle a WordPress qué tipo de bloques representar, así que asegúrese de mantener intacto cualquier código que se vea como <! – wp: párrafo -> . De lo contrario, las cosas pueden ponerse bastante desordenadas.
Accesos directos globales del editor de bloques de WordPress
El Editor de bloques también viene con su propio conjunto de atajos ingeniosos, también. No son todos iguales a los de TinyMCE, pero son igualmente útiles e igual de importantes para aprender. Comprometer los más útiles para la memoria le ahorrará mucho tiempo y problemas, hablando por experiencia. Puede presionar Shift + Alt + H para mostrar la siguiente lista de accesos directos en el editor de WordPress.
Atajos de documentos
- Cambiar entre el editor visual y el editor de código: Ctrl + Shift + Alt + M
- Abra el menú de navegación del bloque: Shift + Alt + O
- Mostrar u ocultar la barra lateral de configuración: Ctrl + Shift +,
- Navegue a la siguiente parte del editor: Ctrl + ` o Shift + Alt + N
- Navegue a la parte anterior del editor: Ctrl + Shift + ` o Shift + Alt + P
- Ir a la barra de herramientas más cercana: Alt + F10
- Guarde sus cambios – Ctrl + S
- Deshacer sus últimos cambios – Ctrl + Z
- Rehaga su último deshacer: Ctrl + Shift + Z
Atajos de selección
- Seleccione todo el texto al escribir. Presione nuevamente para seleccionar todos los bloques – Ctrl + A
- Borrar selección – ESC
Atajos de bloque
- Duplicar los bloques seleccionados: Ctrl + Shift + D
- Eliminar los bloques seleccionados: Shift + Alt + Z
- Insertar un nuevo bloque antes de los bloques seleccionados: Ctrl + Alt + T
- Insertar un nuevo bloque después de los bloques seleccionados: Ctrl + Alt + Y
- Eliminar múltiples bloques seleccionados – del o retroceso
- Cambie el tipo de bloque después de agregar un nuevo párrafo – /
Atajos de texto
- Poner el texto seleccionado en negrita – Ctrl + B
- Ponga el texto seleccionado en cursiva – Ctrl + I
- Convierta el texto seleccionado en un enlace: Ctrl + K
- Eliminar un enlace: Ctrl + Shift + K
- Subrayar el texto seleccionado: Ctrl + U
Terminando
El editor de WordPress ha recorrido un largo camino en la última década, y el actual Editor de bloques es lo suficientemente poderoso como para llevarnos a través de la próxima. Con el poder de controlar granularmente cada elemento de la página, puede crear contenido más rápido, más fácil y mucho más eficientemente de lo que era posible antes. Sin embargo, si el Editor de bloques actual no es para usted, existe el complemento Editor clásico, y si está a la vanguardia, el complemento Gutenberg se mantiene unas pocas versiones por delante del editor predeterminado en el núcleo de WordPress. Entonces, no importa de qué manera prefiera crear, WordPress lo tiene cubierto.
¿Tienes algún consejo o truco que quieras compartir sobre el editor de WordPress? ¡Háganos saber en los comentarios!
Artículo traducido del inglés.
