Estás leyendo la publicación: Cómo agregar tablas dinámicas en WordPress sin ningún HTML
La última vez que intenté agregar una tabla a mi blog de WordPress, terminé desechando todo y usando una lista de viñetas en su lugar.
¿Suena familiar?
Tantos temas impresionantes de WordPress vienen con la capacidad de crear tablas de gran apariencia. Y claro, pueden verse bien al principio, pero no puedes hacer mucho con ellos.
¿Quiere datos filtrables? No.
¿Quiere que la mesa responda a dispositivos móviles? No.
¿Quieres importar datos desde un CSV? De ninguna manera.
Aquí están las buenas noticias:
Con el complemento correcto, puede crear tablas dinámicas altamente funcionales. El tipo de cosa que le permite mostrar datos que se pueden filtrar.
Junto con gráficos y todo tipo.
¿Suena bien? Echemos un vistazo a cómo se puede hacer con wpDataTables.
Nota: Si bien este tutorial se centra en las tablas interactivas, es posible que encuentre útil nuestro tutorial sobre la creación de tablas con capacidad de respuesta móvil con wpDataTables. Haz clic aquí para echarle un vistazo. Este nuevo tutorial tiene en cuenta la interfaz de usuario actualizada y las funciones adicionales lanzadas recientemente en wpDataTables.
Este complemento te permite crear hermosas tablas sin ningún conocimiento de HTML.
wpDataTables es un complemento premium de WordPress que hace que el proceso de creación y publicación de tablas en su sitio web sea muy sencillo. Es liviano, intuitivo y hace el trabajo en cuestión de minutos, dejándolo con menos código para navegar y más tiempo para bloguear.
Uno de los puntos clave de este complemento es que usted no necesita ningún conocimiento previo de HTML para ponerlo en marcha. Todo se hace dentro de una página de configuración fácil de usar. Para publicar es simplemente un caso de copiar y pegar un código abreviado y listo.
Para los bloggers y las empresas, esta es una gran noticia porque les permite mostrar muchos datos de una manera sucinta y fácil de digerir.
Incluso podrías usarlo para:
- Un catálogo de productos
- Cuadros comparativos de productos
- Lista de precios
- Recopilación de datos de los usuarios.
- resultados deportivos
- Seguimiento de su progreso para cualquier cosa que involucre números (por ejemplo, un informe de ingresos de blog)
Las posibilidades son infinitas.
Crear una tabla de principio a fin: una guía paso a paso
Usar el complemento wpDataTables para crear tablas hermosas, claras y completamente funcionales en su sitio web de WordPress es simple.
Aquí le mostramos cómo comenzar:
Paso 1: tenga listo su archivo
A continuación, he creado un ejemplo de documento de Excel para una serie de gastos aleatorios. Esto incluye varias columnas como la fecha, el método de pago y el costo.
Asegúrese de que sus datos se muestren de manera similar; de lo contrario, el complemento tendrá dificultades para definir las columnas en su tabla.
Paso 2: crea una nueva tabla
Navegue a wpDataTables en el lado izquierdo de su Panel de WordPress.
Al hacer clic en este enlace, accederá a la pantalla de arriba. Aquí es donde creará y agregará su nueva tabla:
Después de hacer clic en el botón “Agregar nuevo”, verá esta pantalla. Aquí comenzará a configurar los parámetros de su tabla, para que funcione y se vea de la manera que desea:
Paso 3: define las características de tu mesa
En las primeras tres secciones de la página de configuración de la mesa, puede hacer lo siguiente:
- crea un titulo
- Seleccione si desea mostrar el título de su tabla en la página
- Seleccione un tipo de fuente de entrada para su mesa
Estos son los ajustes de mesa más básicos.
Haga clic en “Cargar archivo” y busque su documento. Las tablas que puede crear pueden ser tan complicadas como las necesite.
Como puede ver, le di a mi tabla un título relevante, seleccioné el tipo de archivo de Excel en el cuadro desplegable y cargué mi archivo en WordPress.
Más abajo en la página, encontrará más configuraciones para personalizar su tabla:
Estos son:
- Sensible – Permite que su mesa se muestre de manera diferente en computadoras de escritorio, tabletas y móviles
- desplazable – Capaz de desplazar su tabla horizontalmente
- Ocultar tabla hasta que la página esté completamente cargada – Útil para cargar páginas lentamente
- Filtrado avanzado – Para mostrar un filtro debajo de cada columna
- Filtrar en formulario – Para un filtro dentro del propio formulario
- Herramientas de mesa – Para opciones como copiar, guardar en Excel y guardar en CSV incrustado dentro de su formulario
- Habilitar clasificación – Esto le permite ordenar sus tablas
- Limitar el diseño de la mesa – Limite el ancho de la tabla al 100% del contenedor principal
- Longitud de visualización – Defina cuántas entradas se muestran en una página
Al hacer clic en “Vista previa”, puede ver su tabla y cambiar cualquier configuración que considere necesaria para que tenga el aspecto que necesita.
Una vez que haya seleccionado las opciones que mejor se adapten al tipo de tabla que desea mostrar, es hora de hacer clic en el botón “Guardar”.
Si desea personalizar aún más sus columnas, una vez que haya hecho clic en “guardar”, podrá desplazarse hacia abajo en la página para ver más opciones. La configuración predeterminada se genera automáticamente, sin embargo, con esto puede cambiar cada color de columna, columna y tipo de filtro (como fecha, hora y texto).
A continuación, agregué algunos colores y edité los tipos de columna a texto, número y cadena.
Paso 4: guarda y copia el shortcode
Una vez que haya guardado su tabla, haga clic en “Cerrar” y lo redirigirá a la página de inicio del complemento. Ahora debería ver la tabla que ha creado, el título y el tipo de su tabla, el código abreviado para ingresar en su publicación o página y la opción para duplicarla.
Quiero mostrar esta tabla en una página, por lo tanto, necesito copiar el código abreviado y luego navegar a la página que deseo editar.
Paso 5: agregue un código abreviado a la publicación o página
Para agregar su tabla a una página, es realmente tan simple como pegar su código abreviado en el editor de la página. Seleccione en qué parte de la página le gustaría mostrar su tabla, pegue su código y continúe creando su contenido:
Paso 6 – Publicar
Una vez que haya presionado el botón de publicar en su página, su tabla debería verse así. Como puede ver, es claro, consistente, perfectamente alineado y contiene todos mis datos de una manera fácil de navegar:
Las opciones en la parte superior de la tabla permitirán a los usuarios exportar el contenido de la tabla en una variedad de formatos. También puede filtrar los resultados fácilmente en la parte frontal de su sitio.
¿Qué otras tablas puedes crear?
Sin embargo, no solo está limitado a tablas simples basadas en CSV. Las tablas de datos de WP pueden mostrar una amplia gama de datos en múltiples formatos.
Aquí hay un ejemplo de una tabla totalmente funcional, receptiva y editable con múltiples columnas y opciones.
Esta tabla está basada en MySQL con filtros para ordenar el contenido según las necesidades del usuario:
Esta tabla basada en matriz de PHP está serializada e incluye imágenes; esto agrega una dinámica y una funcionalidad completamente diferentes que muchas tiendas de comercio electrónico encontrarían particularmente útiles:
Tampoco está limitado a solo archivos CSV. WP Data Tables también permite el uso de archivos basados en Excel, lo que le permite hacer uso de las muchas características específicas que vienen con él:
Otras características de wpDataTable que vale la pena mencionar
- asistente wpDataChart – Le permite transformar sus datos en un gráfico o tabla en unos pocos y sencillos pasos. Actualmente es compatible con 3 motores de renderizado: Google Charts, Highcharts y Chart.js. Encuentre más documentación aquí.
- Formato condicional – Le permite resaltar celdas, filas y columnas según su contenido. Es útil sobre todo si la tabla es completamente numérica. Encuentre más documentación aquí.
- Columnas de fórmula – Le permite agregar una columna que se puede usar para calcular una cifra basada en los números establecidos en otras celdas. Encuentre más documentación aquí.
- Columnas de fecha y hora – Se utiliza para celdas que contienen fechas y horas. Aparecerán automáticamente en el formato que establezca en la página de configuración. Encuentre más documentación aquí.
- Fila Suma/Totales – Utilizado para columnas numéricas, permite calcular la suma de todos los valores. Encuentre más documentación aquí.
- Generador de informes – Es un complemento para wpDataTables. Report Builder crea instantáneamente documentos y hojas de cálculo llenando sus plantillas con datos reales de su sitio de WordPress. Encuentra más documentación aquí.
- Tablas maestro-detalle – Es un complemento para wpDataTables que le permite a usted y a los visitantes de su sitio ver los detalles de cada fila con un simple clic. Encuentre más documentación aquí.
Pensamientos finales
Las tablas son una excelente manera de mostrar datos. Y cuando agrega funciones dinámicas como el filtrado, hace que las cosas sean mucho mejores para los visitantes de su sitio web.
Le mostré cómo crear una tabla dinámica en WordPress cargando datos desde Microsoft Excel (o usando cualquier otra herramienta de hoja de cálculo). Pero, hay mucho más que es posible.
Incluso puede convertir cualquiera de sus tablas en tablas o gráficos, y más.
Ahora es el momento de comenzar con su propia mesa: ¡disfrútelo!
Lectura relacionada: 5 complementos de mesa potentes y móviles para WordPress.
