En este art\u00edculo, hablaremos de c\u00f3mo funcionan las tablas de WordPress y c\u00f3mo se comparan con los widgets de Elementor. A continuaci\u00f3n, te mostraremos c\u00f3mo crear tablas de Elementor manualmente, y te presentaremos algunos plugins que a\u00f1aden nuevos widgets de tabla al editor. \u00a1Vamos a ello!<\/p>\n
\u00bfCu\u00e1ndo utilizar las tablas de WordPress?<\/h2>\n
Cuando empieces a buscarlas, te dar\u00e1s cuenta de que las tablas est\u00e1n por todas partes en la web. Eso es porque son algunos de los elementos m\u00e1s vers\u00e1tiles que puedes utilizar en un sitio web.<\/p>\n
Por ejemplo, las tablas de precios. Es dif\u00edcil encontrar un sitio web de servicios o suscripciones que no utilice tablas para ayudarte a comparar opciones:<\/p>\n Las tablas te permiten presentar grandes cantidades de informaci\u00f3n de forma que sea f\u00e1cil de digerir para los lectores. Y lo que es mejor, las tablas facilitan a los usuarios la comparaci\u00f3n de varios conjuntos de datos entre s\u00ed:<\/p>\n Adem\u00e1s de ayudarte a compartir informaci\u00f3n, las tablas tambi\u00e9n pueden ayudar a romper la monoton\u00eda de los p\u00e1rrafos largos en una entrada de blog o una p\u00e1gina. Normalmente, te recomendamos que evites los muros de texto largos, ya que pueden ser dif\u00edciles de navegar.<\/p>\n El Editor de Bloques<\/a> te da la opci\u00f3n de a\u00f1adir tablas a tu sitio web con facilidad. El bloque Tabla <\/strong>te permite establecer el n\u00famero de filas y columnas que necesitas:<\/p>\n Aunque a\u00f1adir tablas en WordPress es f\u00e1cil, est\u00e1s algo limitado en cuanto a las opciones de personalizaci\u00f3n. Puedes cambiar los colores de fondo, personalizar el estilo de los botones y modificar el tama\u00f1o de las fuentes, pero eso es todo. Si quieres crear tablas m\u00e1s elegantes y complejas, tendr\u00e1s que utilizar un constructor de p\u00e1ginas como Elementor (o incluso Divi)<\/a>.<\/p>\n\n Si quieres ir m\u00e1s all\u00e1 de las tablas b\u00e1sicas de WordPress, Elementor te da acceso a un widget de tabla<\/strong> de precios <\/strong>altamente personalizable. Esto te permite editar los t\u00edtulos de las tablas, establecer etiquetas de encabezamiento, a\u00f1adir listas de caracter\u00edsticas, ajustar las llamadas a la acci\u00f3n (CTA) y mucho m\u00e1s:<\/p>\n Recuerda que con Elementor puedes crear cualquier tipo de dise\u00f1o que quieras para cualquier p\u00e1gina o post. Esto significa que puedes configurar dise\u00f1os de varias columnas para tener varios widgets de tabla de precios<\/strong> uno al lado del otro:<\/p>\n Elementor tambi\u00e9n incluye un widget de tabla de precios<\/strong>. Esto hace que la navegaci\u00f3n por contenidos largos<\/a> sea mucho m\u00e1s f\u00e1cil para tus lectores.<\/p>\n Crear una tabla de precios con Elementor es sencillo. Para empezar, abre el editor de Elementor. Desde aqu\u00ed, puedes elegir empezar con una p\u00e1gina en blanco o importar una plantilla de la biblioteca de Elementor:<\/p>\n Cuando est\u00e9s listo para a\u00f1adir el elemento, deber\u00e1s seleccionar el n\u00famero de columnas que quieres que tenga la tabla. Haz clic en el signo m\u00e1s de Elementor en la parte inferior del editor y selecciona la estructura de columnas que quieres utilizar para la secci\u00f3n de precios:<\/p>\n Ten en cuenta que si utilizas varias columnas, tendr\u00e1s que a\u00f1adir un widget de tabla<\/strong> de precios <\/strong>distinto en cada una de ellas. Aunque cada tabla ser\u00e1 un elemento \u00fanico, los usuarios las ver\u00e1n una al lado de la otra (o debajo de la otra en el m\u00f3vil) como parte de una secci\u00f3n:<\/p>\n Te recomendamos que a\u00f1adas un m\u00f3dulo de tabla<\/strong> de precios <\/strong>y le des estilo primero. Despu\u00e9s, puedes duplicar o copiar ese elemento en las columnas restantes y a\u00f1adir un texto \u00fanico a cada una.<\/p>\n Para personalizar la tabla, selecciona el elemento y ve a la pesta\u00f1a Estilo <\/strong>en la configuraci\u00f3n del widget. Elementor te proporciona muchas opciones de estilo. Estas incluyen la selecci\u00f3n de colores, ajustes de tipograf\u00eda y configuraciones \u00fanicas para cada secci\u00f3n de la tabla:<\/p>\n Cuando est\u00e9s satisfecho con el estilo de la tabla de precios, haz clic con el bot\u00f3n derecho del rat\u00f3n sobre el elemento y selecciona la opci\u00f3n Duplicar<\/strong>. Aparecer\u00e1 una copia de la tabla debajo del elemento original, y podr\u00e1s arrastrarla a una de las columnas vac\u00edas:<\/p>\n Querr\u00e1s repetir este proceso para todas las columnas que tengas. Ten en cuenta que cada tabla puede tener un estilo \u00fanico si prefieres no reutilizar la configuraci\u00f3n. En ese caso, aseg\u00farate de que los estilos son lo suficientemente similares para que los visitantes entiendan que est\u00e1n viendo una comparaci\u00f3n.<\/p>\n Mientras personalizas tu tabla, recuerda que Elementor te permite a\u00f1adir CSS personalizado a cualquier m\u00f3dulo. Para ello, ve a la configuraci\u00f3n avanzada <\/strong>del widget y selecciona la pesta\u00f1a CSS personalizado<\/strong>:<\/p>\n A\u00f1adir CSS personalizado a trav\u00e9s de Elementor es mucho m\u00e1s f\u00e1cil que editar el c\u00f3digo de WordPress<\/a> manualmente. Asimismo, la edici\u00f3n de CSS en WordPress<\/a> requiere que accedas a los archivos del tema y optimices el c\u00f3digo<\/a> para obtener el m\u00e1ximo rendimiento. Con Elementor, s\u00f3lo tienes que a\u00f1adir el c\u00f3digo CSS en el campo correspondiente de cada m\u00f3dulo.<\/p>\n Si a\u00f1adir CSS manualmente suena intimidante, no te preocupes. Aprender CSS<\/a> no requiere que seas un desarrollador web<\/a>. Sin embargo, es una habilidad valiosa que te ayudar\u00e1 a personalizar tus sitios web de WordPress (y quiz\u00e1s incluso a encontrar una carrera en el desarrollo web<\/a>).<\/p>\n Una vez que todas tus tablas est\u00e9n configuradas, es el momento de editar su texto y a\u00f1adir todas las caracter\u00edsticas que necesites para cada entrada. Puedes hacerlo seleccionando una tabla y yendo a la pesta\u00f1a Contenido <\/strong>en la configuraci\u00f3n del widget:<\/p>\n Editar el contenido de tus tablas de precios es f\u00e1cil. Puedes hacer clic en cualquier elemento dentro del widget para empezar a editarlo. Una vez que est\u00e9s satisfecho con los resultados, tus tablas de precios estar\u00e1n listas para funcionar.<\/p>\n Aunque Elementor contiene muchas herramientas para ayudarte a crear tablas, siempre puedes a\u00f1adir m\u00e1s widgets a la lista. En esta secci\u00f3n, veremos 12 plugins de Elementor que puedes utilizar para a\u00f1adir nuevos tipos de tablas a tus entradas y p\u00e1ginas. Aunque muchos de estos complementos est\u00e1n creados para Elementor, puedes instalarlos como complementos normales<\/a>.<\/p>\n Como siempre, s\u00f3lo recomendamos los mejores plugins de WordPress<\/a> que ofrecen un gran rendimiento y que se actualizan regularmente. Utilizar plugins bien optimizados te ayudar\u00e1 a escalar tu sitio web<\/a> sin tener problemas de rendimiento.<\/p>\n ElementsKit<\/a> a\u00f1ade m\u00e1s de 85 widgets a Elementor. Tiene opciones para tablas b\u00e1sicas, tablas de precios, soporte para incrustar elementos de TablePress y mucho m\u00e1s.<\/p>\n La versi\u00f3n profesional de ElementsKit tambi\u00e9n incluye un widget de tablas avanzadas. Esto te permite a\u00f1adir funciones de b\u00fasqueda y filtro a las tablas. Adem\u00e1s, puedes incluir la paginaci\u00f3n para que los usuarios puedan navegar por las entradas sin tener tablas masivas en tu sitio web.<\/p>\n Caracter\u00edsticas principales:<\/strong><\/p>\n Precio:<\/strong> Las licencias de ElementsKit cuestan a partir de 39 d\u00f3lares al a\u00f1o<\/a>.<\/p>\n Si eres un fan\u00e1tico de los editores de arrastrar y soltar (que deber\u00edas serlo si usas Elementor) disfrutar\u00e1s usando WP Table Builder<\/a>. Este plugin te permite construir tablas utilizando elementos preconfigurados como botones, secciones de rese\u00f1as, valoraciones de productos y mucho m\u00e1s.<\/p>\n Adem\u00e1s de los elementos avanzados, tienes acceso a m\u00f3dulos b\u00e1sicos, como texto e im\u00e1genes. El plugin tambi\u00e9n incluye plantillas de tablas, que har\u00e1n tu trabajo a\u00fan m\u00e1s sencillo.<\/p>\n Puedes a\u00f1adir tablas de WP Table Builder a tu sitio web utilizando el Editor de Bloques. El plugin tambi\u00e9n se integra con Elementor, lo que facilita la colocaci\u00f3n de tablas en cualquier lugar de tu sitio web.<\/p>\n Caracter\u00edsticas principales:<\/strong><\/p>\n Precio:<\/strong> Las licencias de WP Table Builder empiezan a costar 39 d\u00f3lares al a\u00f1o<\/a>.<\/p>\n TablePress<\/a> es un plugin gratuito que es lo m\u00e1s parecido a a\u00f1adir funcionalidad de hoja de c\u00e1lculo a WordPress. El plugin puede importar datos en varios formatos, incluyendo archivos Excel, CSV y JSON. Incluso puede exportar los datos de la tabla para otros programas.<\/p>\n Con TablePress, puedes crear tablas que incluyan la funcionalidad de b\u00fasqueda. Los usuarios pueden elegir cu\u00e1ntas entradas mostrar y pasar de una p\u00e1gina a otra si est\u00e1s mostrando conjuntos de datos masivos.<\/p>\n Incrustar las tablas de TablePress con Elementor es sencillo. El plugin crea shortcodes<\/a> \u00fanicos para cada tabla. El widget Elementor Shortcode <\/strong>te ayudar\u00e1 a a\u00f1adir esos c\u00f3digos en cualquier lugar de tu sitio web.<\/p>\n Caracter\u00edsticas principales:<\/strong><\/p>\n Precio:<\/strong> TablePress es un plugin gratuito pero puedes encontrar extensiones premium<\/a> para \u00e9l.<\/p>\n Essential Addons for Elementor<\/a> a\u00f1ade m\u00e1s de 80 nuevos widgets al constructor de p\u00e1ginas. Tienes opciones para tablas de precios, tablas de datos, tablas de contenido y mucho m\u00e1s.<\/p>\n Essential Addons for Elementor viene en dos versiones. El plugin gratuito a\u00f1ade una versi\u00f3n mejorada del widget de tabla de precios que incluye Elementor. Si quieres acceder a las tablas de datos (que incluyen filtrado, b\u00fasqueda y m\u00faltiples estilos), tendr\u00e1s que pagar una licencia premium.<\/p>\n Caracter\u00edsticas principales:<\/strong><\/p>\n Precio:<\/strong> Hay una versi\u00f3n gratuita de Essential Addons para Elementor y las licencias premium cuestan a partir de 39,97 d\u00f3lares al a\u00f1o<\/a>.<\/p>\n PowerPack for Elementor<\/a> a\u00f1ade m\u00e1s de 70 widgets al constructor de p\u00e1ginas. El plugin tambi\u00e9n incluye un gran n\u00famero de nuevas plantillas que puedes utilizar para dise\u00f1ar sitios web<\/a> m\u00e1s r\u00e1pidamente.<\/p>\n En cuanto a las tablas, PowerPack te permite configurar tablas de datos ordenables y con capacidad de b\u00fasqueda. Puedes importar datos en las tablas utilizando archivos CSV. El plugin tambi\u00e9n incluye m\u00faltiples opciones de plantillas de tablas.<\/p>\n Adem\u00e1s de las tablas de datos, PowerPack ofrece widgets de tablas de informaci\u00f3n y de precios. Las tablas de informaci\u00f3n son perfectas si quieres proporcionar a los visitantes un desglose de los servicios que ofreces.<\/p>\n Caracter\u00edsticas principales:<\/strong><\/p>\n Precio:<\/strong> Las licencias de PowerPack empiezan a costar 44 d\u00f3lares al a\u00f1o<\/a>.<\/p>\n Exclusive Addons for Elementor tiene versiones gratuitas y premium. El plugin gratuito a\u00f1ade 39 nuevos widgets a Elementor, mientras que la licencia premium te proporcionar\u00e1 m\u00e1s de 69 nuevos elementos.<\/p>\n En cuanto a las tablas, la versi\u00f3n gratuita a\u00f1ade un nuevo m\u00f3dulo de tabla de precios. Con la versi\u00f3n premium, tendr\u00e1s acceso a tablas de comparaci\u00f3n y de datos. Las tablas de comparaci\u00f3n funcionan de forma similar a los elementos de precios, pero puedes utilizar nuevos dise\u00f1os y estilos.<\/p>\n Caracter\u00edsticas principales:<\/strong><\/p>\n Precio:<\/strong> Hay una versi\u00f3n gratuita de Exclusive Addons for Elementor<\/a>. Las licencias premium cuestan a partir de 29 d\u00f3lares al a\u00f1o<\/a>.<\/p>\n JetElements<\/a> a\u00f1ade 45 nuevos widgets a Elementor. La mayor\u00eda de ellos est\u00e1n orientados a sitios web de comercio electr\u00f3nico<\/a> y de suscripci\u00f3n<\/a>. Sin embargo, JetElements tambi\u00e9n incluye varios widgets de tabla interesantes en su lista.<\/p>\n Entre esos widgets, tienes tablas de precios y tablas responsivas. En comparaci\u00f3n con las tablas de precios b\u00e1sicas de Elementor, la versi\u00f3n de JetElements te ofrece un mont\u00f3n de nuevas opciones de personalizaci\u00f3n. Por ejemplo, puedes jugar con un mont\u00f3n de efectos visuales como el parallax y las microanimaciones para los elementos de la tabla.<\/p>\n Caracter\u00edsticas principales:<\/strong><\/p>\n Precio:<\/strong> Las licencias de JetElements con todo incluido cuestan a partir de 130 d\u00f3lares al a\u00f1o<\/a>. Tambi\u00e9n puedes crear paquetes de widgets personalizados, eligiendo s\u00f3lo las opciones que quieras utilizar.<\/p>\n Premium Addons for Elementor<\/a> tiene versiones gratuitas y premium. Sin embargo, s\u00f3lo el plugin premium a\u00f1ade nuevos widgets de tabla a Elementor.<\/p>\n Si pagas por una licencia premium, tendr\u00e1s acceso a nuevos widgets de tablas de datos y de precios. Puedes acompa\u00f1ar las tablas de datos con widgets de tablas y gr\u00e1ficos si quieres mostrar m\u00e1s informaci\u00f3n a tus visitantes.<\/p>\n Caracter\u00edsticas principales:<\/strong><\/p>\n Precio:<\/strong> Las licencias de los complementos Premium para Elementor empiezan a costar 39 d\u00f3lares al a\u00f1o<\/a>.<\/p>\n DataMentor<\/a> es un plugin que a\u00f1ade un widget de tabla \u00fanica a Elementor. Sin embargo, ese widget tiene muchas m\u00e1s funciones que la mayor\u00eda de los complementos que hemos visto hasta ahora.<\/p>\n Las tablas de DataMentor son incre\u00edblemente vers\u00e1tiles. Puedes a\u00f1adir im\u00e1genes, botones, listas e iconos dentro de cada elemento. El widget te permite crear tablas con estilos individuales para cada columna o fila. Tambi\u00e9n tienes acceso a varias plantillas de tablas si quieres empezar el proceso de dise\u00f1o.<\/p>\n Caracter\u00edsticas principales:<\/strong><\/p>\n Precio:<\/strong> DataMentor es un plugin gratuito.<\/p>\n Happy Addons for Elementor<\/a> es uno de los plugins m\u00e1s completos para el constructor de p\u00e1ginas. Esta herramienta a\u00f1ade m\u00e1s de 99 widgets a Elementor y una amplia colecci\u00f3n de nuevas plantillas a su biblioteca.<\/p>\n En cuanto a las tablas, Happy Addons incluye widgets de tabla b\u00e1sicos y avanzados. La versi\u00f3n avanzada admite la importaci\u00f3n de datos en m\u00faltiples formatos, as\u00ed como la b\u00fasqueda, el filtrado y la paginaci\u00f3n. Adem\u00e1s, tienes acceso a m\u00faltiples dise\u00f1os de tablas predise\u00f1adas. Adem\u00e1s de estas opciones, Happy Addons tambi\u00e9n incluye elementos de tabla de precios y de comparaci\u00f3n.<\/p>\n Caracter\u00edsticas principales:<\/strong><\/p>\n Precio:<\/strong> Hay una versi\u00f3n gratuita de Happy Addons. Las licencias premium cuestan a partir de 39 d\u00f3lares al a\u00f1o<\/a>.<\/p>\n Royal Elementor Addons<\/a> a\u00f1ade m\u00e1s de 40 nuevos widgets a Elementor. Todos ellos son gratuitos, pero el plugin tambi\u00e9n viene en una versi\u00f3n premium que desbloquea opciones de personalizaci\u00f3n adicionales para cada widget.<\/p>\n Con Royal Elementor Addons, obtienes una nueva tabla de precios para usar en Elementor. Este widget incluye varias opciones de estilo nuevas. Adem\u00e1s, viene con una opci\u00f3n de conmutaci\u00f3n que los visitantes pueden utilizar para cambiar entre los precios mensuales y anuales (u otras opciones).<\/p>\n Caracter\u00edsticas principales:<\/strong><\/p>\n Precio:<\/strong> Royal Elementor Addons es gratuito. Las licencias premium cuestan 29 d\u00f3lares por sitio web<\/a> (es una tarifa \u00fanica).<\/p>\n Elementor Addon Elements es un plugin gratuito que a\u00f1ade m\u00e1s de 24 nuevos widgets a Elementor. Entre ellos, tienes opciones de tablas de precios, de comparaci\u00f3n y de datos.<\/p>\n Las tablas de precios incluyen muchas opciones de personalizaci\u00f3n adicionales que el widget por defecto de Elementor no tiene. En cuanto a las tablas de datos, puedes elegir entre crear elementos con capacidad de b\u00fasqueda o de filtrado. Adem\u00e1s, las tablas admiten animaciones, lo que puede hacerlas mucho m\u00e1s atractivas visualmente.<\/p>\n Caracter\u00edsticas principales:<\/strong><\/p>\n Precio:<\/strong> Elementor Addon Elements es gratuito<\/a>.<\/p>\n\n![\"Tablas](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/kinsta-plans.png\")
![\"Comparando](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/food-table-example.png\")
![\"Editor](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/block-editor-table.png\")
\u00bfQu\u00e9 puede hacer una tabla de Elementor?<\/h2>\n
![\"Widget](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-pricing-table.png\")
![\"Widgets](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementor-price-table-template.png\")
\u00bfC\u00f3mo crear una tabla en Elementor? (manualmente)<\/h2>\n
![\"Elige](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/import-elementor-template.png\")
![\"Selecciona](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/select-elementor-columns.png\")
![\"A\u00f1ade](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/price-table-elementor.png\")
![\"Personaliza](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/customize-table-style.png\")
![\"Duplica](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/duplicate-price-table.png\")
![\"A\u00f1adir](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/custom-css-elementor.png\")
![\"Editar](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/price-tables-example.png\")
Los mejores plugins de tablas de Elementor (12 opciones)<\/h2>\n
1. ElementsKit Add-Ons for Elementor<\/h3>\n
![\"ElementsKit\"](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/elementskit-1.png\")
\n
2. WP Table Builder<\/h3>\n
![\"WP](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/wp-table-builder.png\")
\n
3. TablePress<\/h3>\n
![\"TablePress\"](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/tablepress.png\")
\n
4. Essential Addons for Elementor<\/h3>\n
![\"Essential](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/essential-addons-elementor.png\")
\n
5. PowerPack for Elementor<\/h3>\n
![\"PowerPack](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/powerpack-elementor-1.png\")
\n
6. Exclusive Addons for Elementor<\/h3>\n
![\"Exclusive](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/exclusive-addons-elementor.png\")
\n
7. JetElements<\/h3>\n
![\"JetElements\"](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/jetelements-1.png\")
\n
8. Premium Addons for Elementor<\/h3>\n
![\"Premium](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/premium-addons-elementor.png\")
\n
9. DataMentor<\/h3>\n
![\"DataMentor\"](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/datamentor.png\")
\n
10. Happy Addons for Elementor<\/h3>\n
![\"Happy](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/happy-addons-elementor.png\")
\n
11. Royal Elementor Addons<\/h3>\n
![\"Royal](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/royal-addons.png\")
\n
12. Elementor Addon Elements<\/h3>\n
![\"Elementor](\"https:\/\/kinsta.com\/wp-content\/uploads\/2022\/03\/Elementor-Addon-Elements-1.png\")
\n
Resumen<\/h2>\n