Cómo crear tablas dinámicas, de forma fácil y rápida

El artículo de hoy “ Como crear una tabla dinámica “ viene en relación al artículo de la semana pasada “ Mejorando la velocidad de carga del blog de TodoHostingWeb “ donde explicaba los pasos que había dado  para aumentar la velocidad de carga del blog.

Algunos de los cambios que he realizado fue añadir una tabla para ofrecer más y mejor información para mejorar la experiencia del usuario a la hora de elegir un proveedor de hosting.

Así que hoy toca explicar como hacer una tabla de contenido y no morir en el íntento, para ello utilizaremos un plugin que nos hará la vida más fácil, ya verás.

 

Pasos para crear una tabla dinámica

Primer paso descargarnos el Plugin TablePress

descargar el plugin TablePress

Una vez instalado y activado vamos a nuestro escritorio y hacemos clic en el icono del plugin que nos aparece y seleccionamos (agregar una tabla nueva).

como crear una tabla dinámica

 

El segundo paso es empezar a crear nuestra tabla de contenidos

Le daremos nombre a nuestra tabla y le añadimos una descripción (opcional) después tenemos que añadir el número de filas y el número de columnas deseado, por ejemplo en la tabla de mi página principal añadí 8 columnas y 9 filas, hacemos (clic en agregar tabla) y tachan…. La magia empieza a obrar 🙂

Ahora sólo tenemos que tunear la tabla según nuestras necesidades y nuestros gustos, para ello habrá que usar un poco de código html, no te preocupes no es nada complicado, te explico lo que hice con mi tabla y ya verás.

Tercer paso tunear nuestra tabla

Empezaremos a añadir contenido a nuestra tabla, fotos, enlaces, remarcaremos en negrita etc.

Por ejemplo si te fijas en la primera fila de la tabla solamente he añadido un título “Posición, Cambio, Empresa de hositng, etc

tabla dinamica

En la segunda fila empiezo añadiendo un número, en este caso un 1, con el siguiente código ”  <p><strong><span style=”color: #ff6600;”>1</span></strong></p>  ” , no te preocupes bastará hacer uso de los botones que nos ofrece la propia tabla en ” Manipulación de la tabla” para insertar código, insertar una imagen o insertar un enlace, borrar u ocultar una fila o columna, etc para ello haremos clic en la acción que queramos llevar a cabo y después haremos clic en la celda donde vamos a trabajar.

manipulacion-de-la-tabla

Sólo un pequeño consejo, si vas a utilizar fotografías y quieres que todas las celdas queden al mismo tamaño (queda más estético) tendrás que haber dejado previamente todas tus fotografías al mismo tamaño, sino el tamaño de las celdas se desmadra un poco 🙂

Ahora vamos a las “opciones de tabla” , donde indicaremos si queremos alternar los colores de cada fila, si queremos que cambien de color cuando pasamos con el ratón por encima, etc tendrás que probar hasta dar con la combinación que más te gusta, te dejo una imagen con las opciones que yo he marcado para mi tabla, para que veas que opciones he marcado para llegar hasta mi tabla.

tabla-dinamica-funciones

 

Las siguientes funciones de la tabla no las tengo activadas porque no me interesaban, pero hay que tenerlas en cuenta si quieres hacer una tabla dinámica, pues es con estas opciones con las que tienes que jugar para añadir o quitar funciones.

Por ejemplo, permitir que tus visitantes puedan ordenar la tabla según algún criterio (más barato, más rápido, etc) o si quieres habilitar a tus visitantes para que puedan filtrar o buscar en la tabla donde sólo aparecerán las filas con la palabra buscada, etc.

tabla dinamica funciones básicas

 

 

Tendrás que ir probando hasta crear la tabla que mejor se adapta a tus necesidades, pero ya verás que su uso es muy sencillo, en un par de minutos te habrás hecho con el control.

Una vez que tengamos creada una tabla de contenido podemos usarla como base para crear otras, es decir, podremos copiar la tabla y aprovechar parte del trabajo realizado y modificarla creando o añadiendo nuevas filas o columnas para crear una nueva tabla dinámica.

Ahora que ya sabes como crear un tabla dinámica ya no tienes excusas, así que manos a la obra y paciencia porque si es verdad que es sencillo pero nadie te va a quitar un par de hora de trabajo para hacer una buena tabla, es que el tunear la tabla lleva su ratillo 🙂

Ahora sólo me queda pedirte que compartas, no te lo quede pa`ti sólo 😉

 

 

 

2 thoughts on “Cómo crear tablas dinámicas, de forma fácil y rápida

  1. Una tabla bien realizada, aparte del componente estético que pueda tener, te permite organizar la información de manera práctica.

    Si como dices que el plugin permite bastantes cosas, sería cuestión de sacarle el mayor partido posible.

    • Así es para mí Table Press es un plugin muy bueno para crear tablas, es muy intuitivo y fácil de usar, y si encima tienes conocimientos de CSS podrás adaptarlo a voluntad.

      1 saludo

Deja un comentario

Los datos que nos facilites mediante este formulario serán tratados por Gilbert Alayón como responsable de esta web. La finalidad de la recogida de estos datos es responder a tu consulta. Estos datos estarán almacenados en los servidores de Raiola Networks, situados en la Unión Europea (Política de privacidad de Raiola Networks).

Puedes ejercer tus derechos de acceso, rectificación, limitación y supresión enviando un correo electrónico a gilbertlanzarote (arroba) todohostingweb.com. Puedes consultar la información completa y detallada sobre privacidad en mi Política de privacidad .

He leído y acepto la política de privacidad *