, ,

Tabla WYSIWYG de WordPress: Crear tablas editables visualmente sin codificación

La mayoría de los usuarios de WordPress no son desarrolladores. Blogueros, vendedores y propietarios de pequeñas empresas: todos queremos crear tablas limpias y profesionales sin tener que bucear en el código. Ahí es donde las tablas WYSIWYG marcan la diferencia.

WYSIWYG significa "What You See Is What You Get" (lo que ves es lo que obtienes). Significa que usted construye y edita tablas de una manera que refleja el aspecto final, tal como lo haría cuando trabaja en un documento de Word. Si el bloque Tabla por defecto le deja con ganas de más, esta guía es para usted.

Hoy, te mostraré cómo crear una tabla visualmente impresionante usando el plugin WYSIWYG table builder. La tabla está por debajo.


🔍 ¿Qué es una tabla WYSIWYG en WordPress?

Una tabla WYSIWYG le permite editar el contenido visualmente, directamente dentro del editor de WordPress. Sin HTML. Sin shortcodes. Sólo resultados en tiempo real y controles intuitivos.

Lo tendrás:

  • Edición en tiempo real sin recargas
  • Formato flexible con medios enriquecidos
  • Una estructura de arrastrar y soltar
  • Fácil integración de imágenes, iconos y botones

Es la forma más sencilla de crear tablas ricas en contenido sin gastos técnicos.


❌ Por qué el bloque de tabla predeterminado de WordPress se queda corto

El bloque Tabla incorporado sirve para diseños básicos, pero ahí acaban sus posibilidades:

  • No es posible arrastrar y soltar filas o columnas
  • Personalización limitada de bordes, espaciado o colores
  • No es posible fusionar ni dividir celdas
  • No hay soporte para medios dentro de las células
  • Poca capacidad de respuesta móvil

Si su tabla necesita algo más que texto plano, se topará rápidamente con un muro.


✅ ¿Por qué elegir un plugin de tabla WYSIWYG?

Para liberar todo el potencial del diseño de tablas, un plugin visual de tablas como Tableberg es una elección inteligente. Te da:

  • Editor visual: Realice los cambios que considere oportunos, sin conjeturas
  • Arrastrar y soltar: Reorganizar celdas lleva segundos
  • Bloques multimedia: Añade imágenes, botones, iconos y valoraciones con estrellas
  • Estilos personalizados: Controla el relleno, los bordes, la alineación y los colores de las celdas.
  • Para móviles: Elige cómo responde tu mesa en pantallas más pequeñas

Este tipo de plugin hace que diseñar tablas enriquecidas sea tan sencillo como editar una entrada de blog.

Cree bonitas mesas
Con el editor de bloques


🚀 Cómo crear una tabla WYSIWYG con Tableberg

Para crear una tabla WYSIWYG con Tableberg, primero debemos instalar el plugin.

1. Instalar el plugin Tableberg

Ir a Plugins (1) > Añadir nuevo (2), busque "Tableberg" (3) y haga clic en Instalar (4) seguido de Activar.

2. Añadir una nueva tabla

Abra una entrada o página en la que desee añadir la tabla. Haz clic en el botón icono más (+) sobre el editor (1). Tipo Tableberg en el cuadro de búsqueda (2). Añadir el bloque al editor (3).

Establezca el número de columnas y filas de la tabla. Seleccionaremos 3 × 5 por ahora, pero creará o eliminará columnas y filas si es necesario. Haga clic en el botón Crear tabla al final.

En breve verá la tabla insertada en el editor, como a continuación.

Paso 3: Añadir contenido visualmente

A. Insertar contenido de texto

Coloque el cursor en las celdas de la tabla y escriba lo que desee.

B. Añadir imágenes

Ahora, inserte el bloque de imágenes para insertar las imágenes de sus productos haciendo clic en el botón "+". Puede cargar imágenes o seleccionarlas de la biblioteca multimedia.

C. Añadir clasificación por estrellas

Añade estrellas si quieres. Las estrellas son una buena forma de demostrar la calidad de sus productos.

D. Añada sus botones

Los botones son una forma eficaz de promocionar cualquier producto o servicio. Así que colóquelos estratégicamente

Enlazar un botón también es fácil: haga clic en el botón, seleccione la opción de enlace, introduzca el enlace de destino y ajuste los atributos del enlace.

Puedes ajustar y personalizar tus botones desde el panel lateral derecho.

E. Insertar iconos

Los iconos funcionan a las mil maravillas para indicar qué funciones están disponibles y cuáles no. Insertar el bloque de iconos es igual que cualquier otro bloque.

F. Insertar lista con estilo

Styled List es otro bloque esencial que le ayuda a añadir un conjunto de características con iconos simultáneamente.

Ahora, añade tus características. Cada vez que pulses la tecla "Intro" de tu teclado, podrás añadir nuevas funciones.

Puede acceder a las opciones de personalización del bloque Lista estilizada en la parte derecha del editor.

Aquí está la tabla que he creado usando Tableberg sin personalización.

He añadido algunos colores, el relleno, el margen, y la cinta en la parte superior. A continuación se presentan las imágenes para la personalización que he hecho.

Estos son los códigos de color que he utilizado en la tabla. (Color de cabecera: #f3f3f3, Color de fondo de fila par: #3fad3d63, Color de fondo de fila impar: #d1dec8)

Tras la personalización, a continuación se presenta la versión final.

Nombre del producto

Canon EOS

$1400

La mejor opción

Lumix GH6

$1200

Weather Sealing

Touchscreen LCD

Características adicionales

  • Fast Autofocus
  • Alto control ISO
  • Opción AWB
  • Fast Autofocus
  • Alto control ISO
  • Opción AWB

Conectividad WIFI

Cuando esté satisfecho, publique o actualice la página. Su tabla con estilo visual ya está lista.


🔄 Otros plugins de tablas WYSIWYG que merece la pena tener en cuenta

En Tableberg ofrece una experiencia fluida y basada en bloques, hay otras opciones sólidas en función de tus necesidades:

  • Generador de tablas WP - Arrastrar y soltar, soporte de contenido flexible, compatible con Every Page Builder.
  • Mesas Ninja - Integración de muchas funciones y lógica condicional
  • TablePress (con extensiones) - Bueno para grandes conjuntos de datos

Cada uno tiene puntos fuertes, pero Tableberg está construido para trabajar de forma nativa con Gutenberg y prioriza la edición visual.


💼 Casos prácticos de uso

Las tablas WYSIWYG son perfectas para:

  • Comparación de precios y desglose de funciones
  • Tablas de afiliados con botones y clasificaciones
  • Cuadrículas de los miembros del equipo o calendarios de eventos
  • Catálogos de productos con células ricas en medios
  • Desglose paso a paso
  • Resúmenes de contenidos para entradas de blog largas

Si su contenido implica estructura o comparación, estas tablas lo hacen más atractivo e informativo.


Reflexiones finales

Crear una tabla atractiva no debería ser un reto técnico. Un plugin WYSIWYG como Tableberg le da libertad para diseñar tablas que se adapten a su estilo de contenido, sin tocar una sola línea de código.

Si desea mostrar características, comparaciones o listas dinámicas, Tableberg se lo pone fácil.

¿Listo para probar Tableberg?
Empiece hoy mismo con Tableberg ➔.

Más información



El equipo de Tableberg

Construya hermosas tablas de WordPress - ¡Visualmente!

Despídete de las tablas aburridas. Con Tableberg, puede crear tablas interactivas con capacidad de respuesta mediante el Editor de bloques, sin necesidad de código.

Interfaz Tableberg
🚀 Sé el primero en probar nuestro Bloque de mesa para WooCommerce
Este es el texto por defecto para la barra de notificaciones