0 servicios - 0,00€
  • Saltar a la navegación principal
  • Saltar al contenido principal
  • Saltar al pie de página
Mantenimiento WordPress y Creación de Páginas Web

Donde Tu Web te Lleve - Eva F. Quintana

Mantenimiento WordPress y Creación de Páginas Web

  • Sobre mí
  • Orden en el caos
  • Contenido Gratuito
    • Blog
    • Diccionario de WordPress
    • Configurar Cookies en WordPress
    • 5 Tips WooCommerce
  • Trabaja Conmigo
Inicio / Blog / WordPress desde 0 / Editor de Bloques WordPress. Qué es y cómo funciona

Editor de Bloques WordPress. Qué es y cómo funciona

Editor de Bloques WordPress. Qué es y cómo funciona

Desde hace unos años, muchos nuevos usuarios de WordPress se sienten un poco perdidos cuando acceden a crear su primera publicación.

Lejos de parecerse a otros sistemas como Word o Blogger, el Editor de WordPress presenta una mecánica distinta que, inicialmente, puede resultar difícil de comprender.

Dado que esta dificultad suele desaparecer rápidamente, en cuanto se entiende el concepto y la ubicación de las opciones y configuraciones más habituales, en este artículo vamos a repasar esos conceptos básicos sobre el Editor de Bloques WordPress.

Índice

  • ¿Qué es el Editor de Bloques WordPress?
  • ¿Qué son los Bloques WordPress?
  • Tipos de Bloques
  • ¿Cómo añadir Bloques en WordPress? (3 Formas)
    • Botones +
    • Desde el Menú de Opciones de otro Bloque
  • Editar Bloque WordPress
    • Barra de Herramientas
    • Menú Ajustes
  • Mover Bloques WordPress
  • Eliminar Bloques WordPress
  • Gestor de Bloques
  • Bloques Reutilizables WordPress
  • Patrones

¿Qué es el Editor de Bloques WordPress?

Es la herramienta que WordPress proporciona por defecto para crear nuevas publicaciones. Si abres el Back-End de tu web y accedes a Entradas > Añadir Nueva, lo que te aparece es ese Editor de Bloques (salvo que tú o quien desarrolló tu web lo hayáis desactivado).

Tiene la ventaja de permitir mayor flexibilidad que el Editor Clásico y, aparentemente, para los usuarios sin demasiados conocimientos acaba resultando una opción mucho más manejable y con la que obtienen resultados más vistosos.

Dado que ya hablamos en el Diccionario WordPress de él, de por qué apareció y de qué pinta «Gutenberg» en todo esto, no lo voy a repetir aquí.

¿Qué son los Bloques WordPress?

Como te puedes imaginar, los bloques son cada uno de los elementos que se utilizan en el Editor de Bloques WordPress para crear contenidos.

Cada elemento de una página o entrada es un bloque:

  • Un párrafo, un bloque.
  • Un titular, un bloque.
  • Una lista, un bloque.
  • Etc.

Cualquier elemento que insertes en tus posts, ya sea de contenido, maquetación o estructura, es un Bloque WordPress.

Actualmente, también se utilizan bloques para incluir contenidos en las barras laterales, pies de páginas y otras áreas que hasta ahora se venían configurando mediante Widgets.

Tipos de Bloques

No voy a enumerar aquí los alrededor de 80 bloques que ya tiene WordPress, especialmente porque esta lista sigue incrementándose casi con cada nueva actualización. Únicamente mencionaré los más utilizados en una web cotidiana:

  • Párrafo: Por defecto, cada nuevo bloque que se inserta es un párrafo salvo que se indique lo contrario. Por ejemplo, el anterior a este.
  • Encabezado: Que permite insertar los distintos niveles de subtítulos dentro de una publicación.
  • Lista: Para añadir listas de elementos, ya sean numeradas o de viñetas (como esta).
  • Imagen: Con la que insertar imágenes dentro de tus contenidos.
  • YouTube: Con el que incorporar vídeos de dicha red social.

Existen muchos más: Citas, código, botones, tablas, columnas, separador (del que ya te hablé aquí), shortcodes… Aunque estos se usarán o no, según el proyecto. Puedes ver un listado con los tipos de bloques existentes en el Glosario WordPress.

A todos estos hay que añadir los que incorporan algunos plugins al instalarse, por ejemplo, WooCommerce o Yoast, entre otros muchos.

¿Cómo añadir Bloques en WordPress? (3 Formas)

Añadir un bloque WordPress y convertirlo a otro

La primera manera de añadir un bloque en WordPress es tan sencilla como pulsar la tecla enter del teclado de tu ordenador. Al hacerlo, automáticamente se crea un nuevo bloque de párrafo.

Esto permite escribir contenidos de manera fluida, sin tener que parar en cada salto de línea a insertar un nuevo bloque o hacer configuraciones.

Cuando añades un bloque de esta manera, puedes utilizarlo como párrafo, o convertirlo a otro tipo.

Para ello, haz clic sobre el primer icono de la barra de herramientas y elige el nuevo bloque. Ten en cuenta que ese icono cambia para cada tipo, igual que el resto de opciones de ese menú.

Otra forma de añadir bloques con el teclado es escribiendo una barra invertida «/» seguida del nombre del tipo de bloque que quieres utilizar.

Botones +

La segunda manera permite añadir directamente a tu contenido el tipo de bloque que quieres utilizar, sin necesidad de convertirlo una vez insertado.

Esta técnica también es muy sencilla. Basta con pulsar sobre los botones cuadrados con un símbolo «+» y luego elegir el tipo de bloque que quieres usar.

Hay 3 botones:

Uno azul en la esquina superior izquierda, que abre una barra lateral con todos los bloques existentes:

Añadir bloques WordPress desde la barra de herramientas

A la derecha de cualquier bloque insertado mediante la tecla enter, antes de escribir nada en él:

Elegir tipo de bloque WordPress tras insertar uno nuevo

Al colocar el ratón en medio de dos bloques ya existentes:

Otra forma de crear bloques en una entrada WordPress

Desde el Menú de Opciones de otro Bloque

Añadir Bloques WordPress desde el menú opciones

Cuando estás en un bloque concreto y quieres insertar otro justo encima o debajo, puedes hacerlo desde el menú opciones del mismo (los 3 puntitos).

En él encuentras las opciones «Insertar Antes» e «Insertar Después».

Al elegir cualquiera de ellas se crea un bloque párrafo en la posición que hayas elegido. A continuación sólo tienes que cambiar el tipo como ya vimos.

Editar Bloque WordPress

Cuando añades un nuevo bloque a tu contenido, lo más posible es que necesites hacer algunos cambios para que se adapte a tus necesidades.

Cada Bloque WordPress tiene sus propias opciones y no vamos a verlas todas, puesto que sería eterno.

Te indico dónde puedes encontrarlas y a partir de ahí, explora y experimenta. Esa es la mejor forma de aprender 🙂

Barra de Herramientas

Según como hayas configurado tu pantalla, la barra de herramientas estará justo encima del bloque que tienes activo o arriba del todo de la pantalla.

Barra de herramientas de un bloque "Encabezado"
Barra de Herramientas de un Bloque «Encabezado».

Según el tipo de bloque tendrás distintas opciones, aunque algunas de ellas son comunes a todos (o casi):

  • Tipo de Bloque: Es el primer icono de la barra de herramientas. Cada tipo de bloque tiene su propio icono para que puedas identificarlo rápidamente. Haciendo clic encima te saldrán opciones para cambiar dicho tipo, tal como vimos antes.
  • Subir/Bajar: Son dos iconos en forma de flecha (hacia arriba y abajo, respectivamente) situados justo a continuación del anterior. Permiten modificar la posición del bloque.
  • Más (sólo en los Bloques de Texto): El penúltimo icono de la barra de herramientas es una flecha hacia abajo que abre una serie de opciones tales como cambiar el color del texto seleccionado, utilizar la opción de tachado, crear subíndices, etc.
  • Opciones: El último icono de esta barra son 3 puntos verticales que abren un submenú. Desde él puedes insertar nuevos bloques, eliminar el existente, convertir el bloque en reutilizable…

El resto de iconos de la barra de herramientas variará de unos bloques a otros.

Por ejemplo, en los bloques de texto muestra las opciones de formato (negrilla y cursiva), la alineación y la posibilidad de insertar enlaces, mientras que en el bloque imagen también incluye opciones para elegir y cambiar el fichero enlazado o editar la propia imagen.

Barra de Ajustes de un Bloque "Imagen"
Parte de la barra de Ajustes de un Bloque «Imagen» – Clic para ampliar.

Menú Ajustes

El menú ajustes está en la barra lateral derecha de la pantalla de edición. En caso de que no la veas, haz clic sobre el icono con forma de rueda dentada que aparece arriba a la derecha de tu pantalla.

Cuando tienes un bloque activo (has hecho clic encima), este menú está dividido en 2 pestañas: Entrada y Bloque.

Desde la pestaña bloque puedes modificar otra serie de opciones relativas a tu bloque. Igual que antes, estas varían de unos bloques a otros.

Tamaño de texto, anclas para enlaces, color de fondo, tamaño… son algunas de las opciones que puedes configurar desde este menú de ajustes.

Mover Bloques WordPress

A veces, una vez que has empezado a crear tu contenido, decides que quieres cambiar el orden de algún elemento. Para ello, los bloques te proporcionan distintas maneras de cambiarlos de posición:

Flechas Subir/Bajar: Situadas en la segunda posición de la barra de herramientas, tal como vimos hace un rato.

Cada una de ellas permite colocar el bloque activo uno más arriba o uno más abajo de su ubicación actual. Para moverlo varios bloques, basta con presionar repetidas veces.

Sin duda es la manera más sencilla de mover Bloques WordPress.

Arrastrar/Soltar: Si tienes la barra de herramientas encima del bloque activo (no tienes activada la opción Barra de herramientas superior), entre el tipo de bloque y las flechas aparece un tercer icono con forma de 6 puntos. Al mantener el ratón pulsado encima, te permite desplazar el bloque a cualquier otra ubicación de la página.

Mover bloques WordPress arrastrando y soltando

Mover a… Uno de los ítems que aparece en el menú Opciones del bloque activo (los 3 puntos verticales) y que permite trasladarlo utilizando el teclado.

Una vez seleccionada esta opción, sobre el bloque se crea una marca que detalla su ubicación. Si utilizas las flechas arriba/abajo de tu teclado, verás que esta marca se desplaza por el contenido. Cuando la hayas ubicado en su nueva posición, sólo tienes que pulsar la tecla enter.

Puede que con este vídeo lo veas más claro:

Contenido Restringido

Este es un contenido exclusivo para suscriptores.

¿Ya tienes cuenta? Inicia sesión

¿Todavía no la tienes? SUSCRÍBETE GRATIS y accede a guías y contenidos EXCLUSIVOS para suscriptores».

Eliminar Bloques WordPress

Esta seguramente es la gestión más fácil y rápida, aunque también hay 2 vías.

Activa el bloque que quieres borrar haciendo clic encima y…

A. Utiliza la tecla suprimir de tu teclado.
B. Ve al menú opciones del bloque y elige la última: Eliminar bloque.

Gestor de Bloques

En esencia, las que hemos visto hasta ahora son las principales tareas que puedes llevar a cabo con los Bloques WordPress de tus publicaciones (configuraciones específicas aparte).

Pero, ¿qué pasa si tienes muchos más bloques de los que utilizas y te entorpecen el trabajo?

En ese caso, puedes configurar cuáles quieres ver y cuáles mantener ocultos.

Bloques Reutilizables WordPress

No quiero terminar este artículo sin antes mencionar una de las mayores ventajas que tiene el Editor de Bloques WordPress. Y esa son los bloques reutilizables.

Como su propio nombre indica, se trata de bloques que puedes crear una vez, guardar y volver a utilizar en otras entradas posteriores.

Son un verdadero plus sobre el Editor Clásico. Si quieres saber más sobre los bloques reutilizables de WordPress, visita este otro artículo.

Patrones

Los patrones son diseños de bloques predefinidos que agilizan crear estructuras. Para usarlos sólo tienes que abrir el selector con todos los bloques (añadir con Botones + y pulsar en «Ver todos») y acceder a la pestaña Patrones.

Una vez dentro un desplegable te permite elegir entre distintos tipos de estrucutras.

En este artículo no profundizaré sobre estos patrones, pero si te interesa saber más sobre ellos, dímelo en los comentarios y plantearé un artículo sobre el tema.

No hay mucho más que decir sobre el uso de Bloques WordPress. Ten en cuenta que se trata de una funcionalidad que sigue en pleno desarrollo y que por tanto cambia con relativa frecuencia. Si encuentras algo de este artículo que ya no funciona igual, no dudes en decirlo en los comentarios, para que lo vean otros usuarios.

Si eres cliente de un Plan de Mantenimiento con soporte y tienes alguna duda, escríbeme y te la resuelvo.

Mantenimiento WordPress Avanzado. Plan Tranquilidad Plus

Mantenimiento WordPress

Con Backups y actualizaciones, soporte para dudas, tareas dentro de la web y mucho más…

Más información
También te interesará...
La invasión de los móviles y el diseño responsive
Mobile First, Responsive y por qué no es oro todo lo que reluce.
El tamaño sí importa. (El de las fotos...)
Reducir y comprimir imágenes para tu web. Por qué debes hacerlo siempre.
Imágenes libres de derechos (o cómo librarte de una buena)
Fotos Libres de Derechos
Compartir en LinkedIn Compartir en Twitter Compartir en Facebook Compartir en WhatsApp Compartir en Telegram Compartir en Email

WordPress desde 0 Diseño y Contenido, Editor de Bloques (Gutenberg)

5 Tips de WooComerce para VENDER MAS

Los pequeños detalles marcan la diferencia.

Con estos tips para WooCommerce harás de tu tienda online la favorita de tus clientes.

Ayúdame a vender más con estos tips

Cláusula de Privacidad: La finalidad de estos datos es mandarte la guía de Tips WooCommerce. Además, también te enviaré la newsletter, así como información relevante sobre WordPress, marketing online y otros temas afines a estos. Puedes leer más sobre la protección de tus datos en la Política de Privacidad.

guia-tips-woocommerce-s

Interacciones con los lectores

Deja una respuesta Cancelar la respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Footer

  • Contacto
  • Orden en el caos
0 servicios - 0,00€

© 2023 · Donde Tu Web te Lleve - Eva F. Quintana

  • Política de Privacidad
  • Política de Cookies
  • Configurar Cookies
  • Condiciones Generales de Contratación
  • Aviso Legal y Condiciones de Uso
  • Iniciar Sesión
  • Acceder
  • Registro
¿Has olvidado la contraseña?
¿Has perdido tu contraseña? Por favor, introduce tu nombre de usuario o dirección de correo electrónico. Recibirás por correo electrónico un enlace para crear una nueva contraseña.

Supongo que te lo imaginas, pero tengo que contártelo.

Esta web utiliza cookies propias y de terceros con distintas finalidades técnicas y analíticas. En las Política de Cookies dispones de información detallada sobre ellas.

Puedes activarlas todas o configurarlas manualmente.

Configurar Cookies
Resumen de privacidad
Mantenimiento WordPress y Creación de Páginas Web

Esta web utiliza cookies para mejorar tu experiencia mientras navegas por ella. Las he clasificado como Estrictamente Necesarias y Cookies de terceros no técnicas.

Las Cookies Estrictamente necesarias cumplen funciones técnicas y son esenciales para el correcto funcionamiento del sitio. Las Cookies de terceros no técnicas me ayudan a analizar y comprender cómo se usa la web, pero sin ellas el portal sigue funcionando. Estas últimas sólo se instalan en tu navegador si lo autorizas.

Cookies estrictamente necesarias

Estas cookies son fundamentales para que la web funcione correctamente, por eso no pueden desactivarse.

Son las relativas a inicio de sesión, funcionamiento del carrito, seguridad, almacenamiento de tu propia configuración de cookies, etc.

Si quieres desactivarlas debes hacerlo desde las preferencias de tu navegador. Antes de hacerlo debes saber que te arriesgas a que ciertas funcionalidades de la web fallen.

Cookies de terceros no técnicas

Las cookies de terceros no técnicas que utilizo son de carácter analítico. Sólo recogen información estadística que me permite saber el número de visitas que recibe la web, desde qué países y ciudades llegan (utilizan tu IP para ello), qué contenidos son los más leídos, etc.

Si las activas no notarás ninguna diferencia en tu navegación, pero junto con el resto de visitas sabré qué temas interesan más para tenerlo en cuenta a la hora de crear nuevos contenidos.

Por eso es importante que las dejes activadas, aunque puedes desactivarlas si quieres y la web seguirá funcionando.

¡Por favor, activa primero las cookies estrictamente necesarias para que podamos guardar tus preferencias!

Cookies adicionales

Son básicamente cookies y píxeles publicitarios que utilizo cuando tengo alguna campaña de anuncios activa. Estas cookies y píxeles se basan en tus visitas a esta web para saber si deben mostrarte un determinado anuncio o no.

Por ejemplo, si haces clic en el anuncio de una determinada oferta y acabas comprando, dejarás de ver dicho anuncio. Si estas cookies estás desactivadas, seguirás viéndolo.

¡Por favor, activa primero las cookies estrictamente necesarias para que podamos guardar tus preferencias!

Powered by  GDPR Cookie Compliance