Cómo añadir una imagen a una tabla en WordPress

Visual content is undoubtedly crucial for engaging users. Whether you are a blogger, affiliate, eCommerce owner or else, you may need to add graphical content for various reasons.

Images are one such important graphical content. Many users yet don’t know how to add images to WordPress tables. But by adding images to the table, you can easily create various types of tables like comparación, product specification, tablas de preciosetc.

En este artículo, le mostraremos dos métodos sencillos de cómo añadir una imagen a una tabla en WordPress. ¡Vamos a empezar!

Cree bonitas mesas
Con el editor de bloques

Método 1: Utilizar el bloque de tabla por defecto

Por defecto Gutenberg block editor comes with the Inline Image option which you will find on the Toolbar. Using the Opción de imagen en línea, you can easily add images to your WordPress tables.

Here’s the process.

Step 1: Add the Table Block to the Editor

Abre un post o página donde quieras añadir la tabla. Añada la tabla Bloque de mesa al editor.

Añadir el bloque de tabla al editor

Defina el número de filas y columnas.

Definir el número de filas y columnas

La tabla se creará en unos segundos.

Se crea la tabla por defecto

Step 2: Use the Inline Image Option to the Table

Sitúe el cursor en la celda en la que desea añadir una imagen. Aparecerá la barra de herramientas.

Haga clic en el botón Más opciones en la barra de herramientas. Busque y pulse Imagen en línea en la lista.

Step 3: Select and Add an Image

Podrás añadir una imagen, ya sea desde la biblioteca multimedia o cargándola desde tu disco local. Elige la imagen que quieras. Pulsa el botón Botón de selección al final.

Seleccionar y añadir una imagen

La imagen se añadirá en un segundo. Ahora, puede aumentar su tamaño cambiando su anchura.

Ancho de la imagen en línea

Del mismo modo, añada una nueva imagen a la otra columna utilizando la misma opción Imagen en línea.

Añadir imagen en línea a una tabla

Método 2: Utilizar el bloque Tableberg

Tableberg es un plugin constructor de tablas rico en funciones y fácil de usar para principiantes. Con este plugin, también puede construir tablas y añadir imágenes a sus celdas. Hemos explicado el proceso a continuación.

Nota: Make sure that you’ve installed and activated the Tableberg plugin.

Paso 01: Añadir el bloque Tableberg al editor

Busque y añada el Bloque Tableberg al editor. El bloque funciona de la misma manera que el bloque Tabla por defecto, como se muestra arriba.

Busca y añade el bloque TableBerg a tu editor de Gutenberg

Defina el número de fila y de columna.

El esquema de la mesa está listo.

El esquema de la mesa está listo

Step 2: Add the Image Block to the Table

Tableberg includes the Bloque de imágenes. It works similarly to the Gutenberg Image block. Add the Image block to the cell.

Añadir el bloque de imagen a la tabla

Seleccione la opción para subir la imagen deseada desde la fuente respectiva. Para este tutorial, subiremos la imagen desde la Biblioteca multimedia.

Seleccione la opción de carga de imágenes

Step 3: Select and Upload an Image

Espero que sepas lo que tienes que hacer aquí. Elija una imagen y haga clic en el botón Botón de selección.

Seleccionar y cargar una imagen

La imagen se añadirá a la tabla al instante. Puede cambiar el tamaño de la imagen arrastrando la línea del borde, como se muestra en la imagen siguiente.

La imagen se añadirá a la tabla

Step 4: Customize and Stylize the Image

Ven al Ficha Configuración en la barra lateral derecha. Puede añadir un texto alternativo, relación de aspecto, anchura, altura y resolución, que no son posibles con la opción Imagen en línea.

Ir a la Ficha Estilos. Puede añadir un borde y el radio del borde utilizando las opciones de esta pestaña.

Estilizar la imagen sobre la mesa

Así, puede añadir imágenes a la tabla en WordPress.

Notas finales

Aunque TableBerg es un plugin nuevo, va a cambiar las reglas del juego. Muy pronto llevará la experiencia de creación de tablas basada en Gutenberg al siguiente nivel.

Con el plugin TableBerg, puede añadir no sólo imágenes, sino también otros tipos de contenido como cintas, clasificaciones, listas con viñetas, botones CTA, HTML personalizado, etc.

Usándolas puedes crear tablas multifuncionales con el plugin. Echa un vistazo a algunos posts:



El equipo de Tableberg