• Ir a navegación principal
  • Ir al contenido principal
  • Ir a la barra lateral primaria
  • Ir al pie de página

Dani Sánchez - Gestionatuweb

Desarrollador web freelance - Dani Sánchez Gestionatuweb

  • ¿Eres agencia?
  • WordPress
    • Mantenimiento
    • Desarrollo
    • Soporte técnico
  • Cursos
  • Porfolio
  • Blog
  • Contacto
  • Solicita Presupuesto
Estás aquí: Inicio / Publicaciones / Crea tablas dinámicas en Wordpress con TablePress

Publicaciones, Tutoriales, Wordpress / 17 de noviembre de 2016

Crea tablas dinámicas en WordPress con TablePress

[et_pb_section fb_built=»1″ admin_label=»section» _builder_version=»3.22.3″][et_pb_row admin_label=»row» _builder_version=»3.22.3″ background_size=»initial» background_position=»top_left» background_repeat=»repeat»][et_pb_column type=»4_4″ _builder_version=»3.0.47″][et_pb_text admin_label=»Texto» _builder_version=»3.0.74″ background_size=»initial» background_position=»top_left» background_repeat=»repeat»]

Una de las opciones que a veces echamos en falta en el editor de textos de WordPress  es la posibilidad de insertar tablas en una entrada o página, para por ejemplo, estructurar un listado de datos.

TablePress permite diseñar tablas y hacerlas dinámicas e interactivas para nuestros usuarios, ofreciendo opciones tales como búsquedas dentro de la tabla, organizarlas por algún determinado filtro, paginarlas, etc.

Plugin TablePress

Al instalarlo, lo tendremos como un elemento más dentro del menú principal de WordPress.

Menú TablePress

Si queremos crear una tabla, nos vamos al menú Agregar Nueva, le damos un nombre y una descripción opcional, y especificamos de cuántas columnas y filas va a constar, aunque luego podemos agregar más o eliminarlas.

Agregar nueva tabla

En el apartado Contenido de tabla rellenamos los datos (por defecto la primera fila será el encabezado de la tabla).

Debajo tenemos opciones para manipular nuestra tabla, como agregar nuevas filas y columnas, combinar celdas, insertar imágenes o enlaces dentro de una celda, etc.

Contenido de la tabla

Las opciones de tabla permiten configurar algunos aspectos sobre el diseño de nuestra tabla, por ejemplo:

  • Especificar que la primera fila sea el encabezado y la última fila sea el píe de tabla.
  • Que las filas se muestren con colores alternos para diferenciarlas mejor.
  • Especificar dónde mostrar el nombre de la tabla.
  • Opciones CSS adicionales.

Conviene ir probando hasta encontrar la configuración que más se adapte a nuestras necesidades.

opciones de tabla

Las siguientes opciones tienen que ver con la interactividad de la que vamos a dotar nuestra tabla.

Algunas opciones permiten que nuestros usuarios puedan ordenar los datos de la tabla, paginarlos (por ejemplo a 10 resultados por página), realizar búsquedas, filtrar, etc.

Igualmente conviene ir probando para ver las posibilidades con las que contamos y adaptarlo a nuestras necesidades.

Funciones JavaScript de la Tabla

Una vez terminemos de definir nuestra tabla y sus opciones guardamos los cambios y nos dirigimos a la entrada o página donde queremos insertar nuestra nueva tabla.

Veremos el nuevo icono de TablePress en el editor de textos de WordPress.

 

Icono de tablepress en el editor de textos de WordPress

Haciendo clic en el icono de TablePress podemos insertar una tabla de forma rápida.

Nos abrirá en una ventana modal un listado de las tablas que ya tenemos creadas para seleccionar la que necesitemos:

Seleccionar la tabla para insertar

Una vez localizada la tabla hacemos clic en el botón Insertar código abreviado y guardamos los cambios.

insertar shortcode de TablePress

Y vemos cómo ha quedado nuestra nueva tabla, totalmente dinámica e interactiva, con posibilidad de realizar búsqueda, seleccionar los registros a mostrar por página, posibilidad de filtrar por campos, etc.

011

[/et_pb_text][/et_pb_column][/et_pb_row][/et_pb_section]

Archivado en:Publicaciones, Tutoriales, Wordpress Etiquetado con:páginas web, plugins, publicaciones, tutoriales, wordpress

Interacciones con los lectores

Este artículo puede contener código que podría no funcionar correctamente en tu versión de WordPress o causar incompatibilidad con tu plantilla o plugins. Úsalo bajo tu responsabilidad y haz siempre copia de tus archivos antes de modificarlos.

Deja una respuesta Cancelar la respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

  Acepto la política de privacidad

Barra lateral primaria

Daniel Sánchez

@danisanchez82
t.me/gestionatuweb

Buscar en la web

Entradas recientes

  • Adiós WhatsApp…
  • Configuración de WP Fastest Cache
  • Cómo añadir un enlace personalizado en el menú admin de WordPress
  • Hooks de Genesis Framework (init, header y framework) – Parte 1
  • Añade el soporte de Genesis Framework para tus Custom Post

Categorías

  • Actualidad
  • Destacado
  • Divi
  • Drupal
  • Elementor
  • Genesis
  • Joomla!
  • Linux
  • Publicaciones
  • Tutoriales
  • WooCommerce
  • Wordpress

Comentarios recientes

  • Carlos en Crear un WebView con Android Studio para cargar una web en una APP Android
  • william maffiold en Instalar LAMP y phpMyAdmin en MX Linux 19
  • dani en Divi, diseñar una plantilla predeterminada para cargar Custom Posts
  • dani en Subir un WordPress terminado de tu ordenador (local) al servidor final (hosting)
  • Carlos en Divi, diseñar una plantilla predeterminada para cargar Custom Posts

Hosting de confianza

Footer

Buscar en la web

  • Inicio
  • Agencias
  • Mantenimiento WordPress
  • Desarrollo WordPress
  • Soporte técnico WordPress
  • Cursos
  • Portfolio
  • Blog
  • Contacto
  • Política de privacidad

Mis redes

  • Facebook
  • LinkedIn
  • Twitter
  • YouTube

© 2016–2021 Gestionatuweb · Programado con Genesis Framework · Iniciar sesión

Utilizo cookies para obtener datos estadísticos sobre el uso de mi sitio web y personalizar la publicidad (no intrusiva) del blog según tus intereses. En ningún caso estas cookies te identifican como persona, solo a tu dispositivo en la Red. Aceptando el uso de cookies me ayudarás a mantenener el blog gracias a la publicidad y podré mejorar la experiencia de uso gracias a la analítica web. Puedes navegar por mi sitio web sin que se instale ninguna de estas cookies, aunque este mensaje permanecerá visible en todo momento.AceptoPolítica de privacidad