En los inicios de la creación de sitios web, tablas se construyeron principalmente para su visualización en ordenadores de sobremesa, donde abundaba el espacio en pantalla. Cuando los sitios web empezaron a incluir datos complejos, las tablas se convirtieron en una forma popular de organizar grandes cantidades de información de forma ordenada.
Con el aumento del uso de móviles, la necesidad de tablas adaptables se hizo vital. Cada vez más usuarios acceden a los sitios web desde teléfonos y tabletas, donde las tablas tradicionales causan frustración al requerir desplazamiento horizontal o zoom solo para leer el contenido.
Hoy en día, las tablas adaptativas no son sólo una cuestión de comodidad; son esenciales para el SEO y la accesibilidad, especialmente con Indexación móvil de Google. Aunque el bloque de tabla predeterminado de WordPress carece de capacidad de respuesta integrada, necesitará métodos como ajustes de CSS o plugins para resolver ese problema.
En esta guía, veremos la forma más sencilla de crear tablas optimizadas para móviles en WordPress mediante un plugin.
Paso 1: Instalar y activar el plugin Tableberg
El primer paso es sencillo. Vaya a su Panel de WordPress y navegue hasta Plugins > Añadir nuevo. Una vez allí, escriba Tableberg y busque el plugin. Una vez que lo encuentres, haz clic en Instalar ahora. Tras la instalación, sólo queda Activar it. Haga clic en Activar para habilitar el plugin en su sitio.
Paso 2: Crear una nueva tabla con Tableberg
En el editor de WordPress, haga clic en el botón icono más (+)Buscar Tablebergy, a continuación, añade el bloque Tableberg.
Elige el número de filas y columnas de tu tabla y pulsa el botón crear. Para este tutorial, elegimos una tabla que contiene 4 filas y 5 columnas.
Paso 3: Añadir datos a la tabla
En crear su mesaAccederás al editor de tablas, donde podrás añadir contenido a cada celda. Haga clic en cualquier celda, pulse el botón signo más (+), escriba el bloque necesario y continúe introduciendo texto, imágenes, listas, valoraciones con estrellas, botones o cualquier cosa que se adapte a sus necesidades.
Paso 4: Activar la configuración responsiva
Para asegurarse de que su mesa se muestra bien en todos los dispositivos, Tableberg ofrece una estructura de Ajustes de capacidad de respuesta sección. En primer lugar, seleccione el bloque principal, pasar a la ajustes en la parte derecha del editor y, a continuación, desplácese hacia abajo hasta encontrar la opción Ajustes de capacidad de respuesta.
A continuación, selecciona el dispositivo para el que deseas configurar la capacidad de respuesta. En la parte superior del panel Configuración de la capacidad de respuesta, verás opciones para Escritorio, Tabletay Móvil. Seleccione el dispositivo que desea personalizar, ya que esto determinará cómo se comporta la tabla en ese tamaño de pantalla en particular. En este caso, hemos seleccionado Móvil.
Con el dispositivo seleccionado, active el botón Activar punto de interrupción para activar el comportamiento sensible para el dispositivo elegido. Esta opción permite que la tabla aplique ajustes adaptables cuando la anchura de la pantalla sea igual o inferior al valor establecido en Anchura máxima. Por ejemplo, si estableces la Anchura máxima en 1024px, la tabla se ajustará de forma responsiva en pantallas que sean más estrechas que 1024px. Debajo de esta configuración, encontrará la opción Hacer Encabezado de la fila superior que designa la primera fila de la tabla como cabecera y aplica estilos o formatos específicos para distinguirla de las demás filas.
Por último, utilice la función Modo para elegir cómo se comporta la tabla en pantallas más pequeñas. Puede seleccionar Desplácese por para activar el desplazamiento horizontal y permitir a los usuarios desplazarse por la tabla si es demasiado ancha. Como alternativa, elija Pila para reorganizar el contenido de la tabla verticalmente. Cuando se utiliza el modo Pila, las opciones adicionales como Dirección de la pila le permiten controlar la dirección de apilamiento, y Artículos por fila le permite establecer cuántos elementos deben aparecer por fila para proporcionar una mayor personalización para pantallas más pequeñas.
Eso es todo: su tabla está lista para brillar en pantallas de cualquier tamaño. Publíquela y deje que sus datos fluyan sin problemas en ordenadores de sobremesa, tabletas y teléfonos.
Conclusión
Las tablas adaptables no son sólo una característica, son imprescindibles en el mundo actual de WordPress. Con Tableberg, has convertido las tablas tradicionales en algo que se adapta, flexiona y brilla en cualquier pantalla. Su sitio ofrece ahora una forma más limpia y accesible de presentar los datos, tanto si se visualizan en un ordenador de sobremesa como en una tableta o un teléfono. Puede decir adiós a las pantallas toscas y dar la bienvenida a una experiencia de usuario que fluye tan suavemente como su contenido. A su público le encantará la actualización, y también a los motores de búsqueda.
