Tabla dinámica
Las tablas de precios, los gráficos de características y los directorios de equipo (los datos son la columna vertebral de las buenas decisiones). Pero una tabla HTML predeterminada grita “hoja de cálculo”, no “solución”. El elemento de tabla dinámica de complementos maestros convierte la información estructurada en una experiencia diseñada. Cree cualquier tabla desde cero directamente en el editor Elementor. Defina sus encabezados, llene el cuerpo con texto, imágenes, íconos o incluso contenido dinámico de sus publicaciones. Luego, aplique un estilo profesional en cada nivel: el encabezado, cada fila, celdas individuales. Crea claridad, resalta lo que importa y haz de tus datos algo que la gente realmente quiera leer.
Creador visual de mesas de arrastrar y soltar
Olvídese de los códigos cortos complejos. Construya toda la estructura de su tabla en una interfaz visual intuitiva. Comience definiendo las columnas del encabezado de su tabla (como “Característica”, “Precio”, “Plan”). Luego, agregue y administre filas en el cuerpo de la tabla como si fuera una hoja de cálculo. ¿Necesita otra fila? Haga clic en Agregar elemento. ¿Quiere fusionar celdas? Utilice controles de intervalo de columnas y de intervalo de filas para diseños complejos. Ves que tu tabla se forma en tiempo real a medida que la construyes, lo que hace que el proceso sea rápido, preciso y completamente visual.
- Configuración intuitiva del encabezado: agregue y etiquete columnas de encabezado directamente en el editor para definir la estructura de su tabla.
- Gestión de filas en vivo: agregue, elimine y reordene filas del cuerpo sobre la marcha con el botón Agregar elemento.
- Poder de fusión de celdas: cree grupos de encabezados o resalte celdas clave usando las opciones Column Span y Row Span.
Control separado de diseño de cabecera y carrocería
Una gran tabla guía la vista. Haga que su fila de encabezado se destaque como la guía clara para los datos a continuación. Diseñe el encabezado de la tabla de forma completamente independiente. Dale un color de fondo atrevido, un color de texto distintivo y una tipografía fuerte. Ajuste el relleno interno de la celda para que sea espacioso y fácil de leer. Esto crea una jerarquía visual inmediata, lo que ayuda a los usuarios a escanear y comprender sus datos en segundos. Las filas del cuerpo obtienen su propio conjunto de controles de estilo separados para un contraste perfecto.
- Estilo de encabezado independiente: aplique un color de fondo, un color de texto y una tipografía únicos solo a la fila del encabezado.
- Control de relleno de celda: establezca un relleno de celda interior personalizado para celdas de encabezado para mejorar la legibilidad y el diseño.
- Estilo específico del cuerpo: peina las filas del cuerpo de la tabla con su propio fondo, color de texto y alineación.
Contenido de la celda: texto, iconos, imagen y datos dinámicos
Cada celda puede contar una historia más rica. Más allá del texto simple, inserte imágenes o elija iconos de la biblioteca para crear marcas de verificación de funciones visuales (✓) o indicadores de estado. Lo más poderoso es conectar su tabla al contenido del sitio en vivo mediante etiquetas dinámicas. Introduzca automáticamente datos como títulos de publicaciones, campos personalizados, valores ACF o información del usuario. Cree una tabla comparativa de productos, un directorio de personal o un calendario de eventos que se actualice automáticamente - verdaderamente dinámico.
- Contenido multiformato: elija texto, imagen o icono para cualquier célula del cuerpo.
- Personalización de iconos: estilo de iconos con su propio tamaño, color y relleno dentro de la celda.
- Integración de etiquetas dinámicas: complete celdas automáticamente utilizando fuentes de datos dinámicas (por ejemplo, meta de publicación, nombre del autor, campos personalizados).
- Alineación flexible: controle la alineación horizontal y vertical del contenido dentro de cada celda para obtener un diseño pulido.
Estilismo de mesa global y efectos profesionales
Ate toda la mesa con configuraciones de diseño globales. Habilite las filas de la mesa a rayas para obtener una apariencia clásica y fácil de escanear y elija el color de fila alterno. Controle el tipo de borde, el ancho y el color generales para toda la cuadrícula de la mesa. Establezca el relleno universal de celdas internas para un espaciado constante. Agregue un tipo de fondo (color, degradado) a todo el contenedor de la mesa. Estos toques globales garantizan que su mesa parezca un elemento cohesivo y especialmente diseñado, no una colección de celdas individuales.
- Rayas de cebra: active la mesa a rayas y elija un color para alternar filas para mejorar drásticamente la legibilidad.
- Estilo del borde: defina el tipo de borde, el grosor y el color de las líneas de cuadrícula de toda la tabla.
- Diseño de contenedor: agregue un fondo y controle el relleno y el margen de la tabla general.
- Espaciado constante: aplique un relleno global de células internas para garantizar un espacio uniforme y cómodo en todas las células.
Preguntas frecuentes para la tabla dinámica
¿puedo conectar esta tabla a mis tipos de publicaciones personalizadas o campos personalizados avanzados (ACF)?
¡Sí, puedes! A través de la función Etiquetas dinámicas disponible en el selector de contenido de la celda del cuerpo. Al editar una celda, haga clic en el ícono de la base de datos para abrir el panel de etiquetas dinámicas. Luego puede seleccionar entre fuentes como “Título de la publicación”, “Campos personalizados”, “Campo ACF” y más para completar la tabla con datos en vivo de sus publicaciones, productos o cualquier tipo de publicación personalizada.
¿La mesa responde en dispositivos móviles?
Absolutamente. La tabla está diseñada para ser responsiva. En pantallas muy pequeñas, es posible que desee habilitar un contenedor de desplazamiento horizontal en Elementor o simplificar la cantidad de columnas. El estilo (relleno, tamaños de fuente) se adaptará y podrá ajustar la configuración específicamente para la vista móvil utilizando el modo de edición responsiva de Elementor.
¿puedo crear una tabla de precios con una columna "resaltada" usando este elemento?
Definitivamente. Crearías una columna para cada nivel de precios. Para resaltar una columna (como el plan “Popular”), puede usar la función Columna Span en una celda de encabezado para una insignia y luego aplicar un color de fondo diferente a todas las celdas en esa columna específica agregando una clase CSS personalizada. o usar opciones de estilo de celda individuales si están disponibles en configuraciones avanzadas.
¿Qué pasa si agrego un texto muy largo en una celda?
Usted controla el comportamiento. Puede establecer un ancho personalizado para que la columna controle la expansión. El texto se envolverá dentro de la celda según su tipografía y configuración de relleno. Para contenido largo, asegúrese de tener la altura de fila adecuada (controlada mediante relleno vertical) para mantener la legibilidad.
¿Cómo se compara esto con el simple uso de un widget HTML o un complemento de tabla?
Este elemento le brinda control de diseño visual dentro de Elementor. A diferencia de un widget HTML básico, no necesita escribir ningún código para diseñar bordes, colores o alineaciones. En comparación con muchos complementos de tabla, se integra perfectamente con el flujo de trabajo y el sistema de estilo de Elementor, ofreciendo una experiencia de diseño más unificada y eficiente sin inflar su sitio con otro complemento independiente.
¿Puedo ordenar o filtrar los datos de la tabla dinámicamente?
Este elemento es principalmente para tablas de visualización estáticas o pobladas dinámicamente. No incluye funciones integradas de clasificación, filtrado o búsqueda de front-end como lo haría un complemento de tabla de datos. Para esas funciones interactivas avanzadas, necesitaría una solución dedicada. Este elemento es perfecto para presentar información fija como precios, especificaciones u horarios en un formato bellamente diseñado.
Widgets y extensiones de Elementor de tendencia
Cree sitios web sofisticados en menos tiempo.
Vidriomorfismo
Extras de contenedores
Patrones
Duplicador de publicaciones/páginas
