Cómo crear una tabla comparativa de productos en WordPress

You see product comparison tables everywhere when you’re shopping online. Whether it’s an eCommerce site or a blog, comparison tables help you understand what different products offer. They also help you make more informed purchasing decisions. 

If you’re running an blog de afiliadosEn la página de afiliación, comprenderás especialmente la importancia de las tablas de comparación de productos. Con estas tablas, puede comparar los diferentes productos en su página y obtener más comisiones de afiliación. 

Creating a table to attractively compare products is quite simple and doesn’t take a whole lot of time. But it's important that the comparison table you create is engaging to the reader. Your comparison table should inspire the user to take action – whether it’s to purchase a product or just click on the purchase link. 

In this article, we'll show you how to create an awesome product comparison table in WordPress. Let’s get started! 

Cómo crear una tabla comparativa de productos utilizando WP Table Builder

We’ll be creating the following example table in this tutorial:

Aunque relativamente básica para nuestros propósitos, esta tabla tiene todos los elementos que suelen tener las tablas comparativas. Explicaremos cada sección en detalle para ayudarle a crear la tabla exacta que se muestra arriba. 

El primer paso de este tutorial comienza con la instalación de un plugin. 

Paso #1: Instalar WP Table Builder Plugin 

We’ll be using the Generador de tablas WP Plugin. It’s a free drag-and-drop table builder. This builder is perfect for creating comparison tables and has a lot of options for customization, including the following elements:

• Texto
• Imagen
• Botón
• Clasificación por estrellas
• Lista

Para instalar el plugin, vaya a su WordPress dashboard > Plugins. Haga clic en Añadir nuevoy busque Generador de tablas WP. Haga clic en instale y activar para instalar el plugin en su sitio web:

También puede descargar el plugin de la página Repositorio de WordPress y súbalo a su sitio web. 

Paso #2: Crear una nueva tabla

Para crear una nueva tabla en el plugin WP Table Builder, vaya primero a Creador de tablas > Añadir nueva. 

You’ll see the table drag-and-drop builder as shown below: 

Puedes dar un nombre a tu tabla y establecer el número de filas y columnas. Una vez hecho esto, haga clic en el botón generar button. This will generate your table as shown below: 

Paso #3: Añade contenido a tu tabla

Now it's time to add content to your table. WP Table Builder lets you drag and drop elements to the cells of your table. You can select the elements from the left sidebar and drag them to your table. Here’s how our table looks after adding content: 

Hemos utilizado sólo el texto, imageny botón para crear la tabla. Como se puede ver, se ve limpio y hermoso. 

Ahora vamos a mostrarte cómo puedes hacer tu mesa aún más atractiva utilizando este plugin. 

Paso #4: Haz que tu mesa sea bonita y receptiva

Hay muchas maneras de hacer que su tabla se vea hermosa en WP Table Builder. Este plugin también tiene toneladas de opciones de personalización para ayudarle a hacer su tabla más atractiva. Vamos a empezar. 

Configurar el borde de la mesa

WP Table Builder lets you add a border to your table. You can find this option in the table settings on the left. You can set the border size, change its color, and also apply an inner border to your table:

Relleno de celdas

La opción de relleno de celda cambia el relleno de cada celda de su tabla:

Fondo de cabecera 

También puede personalizar el color de fondo de la cabecera de su mesa para añadir un poco más de estilo:

For this table, I’ve set the header background to white so that the logos blend well. 

Fondo de fila par/impar

Los colores alternativos para las filas son muy populares en las tablas de comparación de productos, y puedes aplicar esto fácilmente con el plugin WP Table Builder:

Ahora que su mesa tiene un bonito aspecto en una vista de escritorio, también querrá asegurarse de que se ve muy bien en los dispositivos móviles. 

The awesome thing is, you don’t have to worry about doing a lot of leg work. All you need to do is to click on the Hacer la tabla responsiva cambiar. Esto hará que su mesa resulte atractiva y atractiva en los dispositivos móviles:

Por último, active el Fila superior como cabecera para establecer la fila superior como cabecera de la tabla. 

Por fin, su mesa está lista. 

Paso #5: Insertar la Tabla mediante Shortcode

Ahora que tu tabla está lista, necesitas insertarla en tu contenido. Puedes hacerlo fácilmente insertando el shortcode del plugin. 

Para encontrar el shortcode de la tabla, haga clic en el botón Insertar en la parte superior del constructor de tablas. Se abrirá una ventana emergente con el shortcode:

Ahora, puedes copiar y pegar este shortcode en cualquier parte de tu contenido. 

Otra forma de encontrar el shortcode de la tabla es ir a Table Builder > All Tables. Here, you’ll find all the tables you have created:

Como puedes ver, puedes copiar el shortcode de la tabla directamente desde esta página. 

Conclusión

Antes, si te preguntabas cómo crear una tabla comparativa de productos en WordPress, esperemos que ahora veas lo fácil que es el proceso. Con el plugin WP Table Builder, todo el proceso de creación de una tabla atractiva se simplifica y se puede hacer en cuestión de minutos. 

There are many customization options that let you design the look and feel of the table you’re creating.

Si tienes alguna pregunta sobre este tutorial, no dudes en hacerla en la sección de comentarios más abajo. Estaremos encantados de ayudarte.

Si te ha gustado este post, no dejes de seguirnos en Twitter, Instagram, Facebook, Pinteresty LinkedIn¡! Y no olvides suscribirte en el caja abajo.

Divulgación de enlaces de afiliados