Aquí te voy a mostrar cómo crear una tabla de precios para un sitio WordPress, que además podamos personalizar y configurar a nuestra medida. Sin dudas, será algo muy útil para una gran diversidad de sitios que necesiten exhibir distintos precios y tarifas. Para ello vamos a utilizar un plugin llamado “CSS3 Responsive Web Pricing Tables Grid For WordPress”. Se trata de un plugin Premium que debemos adquirir en su sitio web para poder instalar.

Vídeo para crear una tabla de precios en WordPress

Características del plugin

Las tablas que podemos insertar con este plugin tienen varias características que las hacen óptimas para todo tipo de sitios. Entre ellas encontramos:

  • 2 estilos de tablas con 20 variaciones de colores
  • 60 tipos de etiquetas diferentes y 42 tipos de iconos (tics, cruces)
  • Número de filas y columnas ilimitadas
  • Diseño responsivo que se adapta a diferentes pantallas y dispositivos
  • Columnas deslizantes, siempre visibles
  • Dimensiones personalizables
  • Importación y exportación de datos

Su precio es de $16, luego del pago podremos descargarlo a nuestro ordenador para después instalarlo en nuestro sitio.

Instalación y configuración

Una vez descargado del sitio del plugin, vamos a nuestro Escritorio WordPress al menú “Plugins” y “Añadir nuevo”. Luego damos a la opción de “Subir” e indicamos la ubicación del archivo en nuestro ordenador. Instalamos y activamos. Para acceder a su configuración podemos ir a través del menú de “Plugins”, justo debajo de su nombre, o en la zona “Ajustes” en su propio menú. Una configuración básica podría ser la siguiente:

  1. Comenzamos eligiendo el estilo de tabla que queramos. Aquí hay muchas opciones y será cuestión de ir viendo para probar cuál nos gusta.
  2. Luego vamos a definir el número de filas y columnas.
  3. Seleccionar las fuentes para el texto y su tamaño.
  4. Ajustar el ancho de las columnas y el alto de las filas.
  5. Definir la alineación de la tabla y las celdas.
  6. Utilizar tipos de valores predeterminados, como por ejemplo el porcentaje (%).
  7. Insertar etiquetas o carteles, por ejemplo para promociones.
  8. Podemos ocultar ciertas columnas por períodos de tiempo.
  9. Es posible cambiar el orden de algunas celdas en la tabla.
  10. Insertamos diferentes símbolos e iconos disponibles.
  11. Agregamos, si tenemos, una URL a través de la cual se nos pueden efectuar pagos, por ejemplo de PayPal.

Algo muy útil es que al final de la página tenemos un botón para previsualizar lo que vamos haciendo. Todas las opciones se realizan desde campos desplegables que acompañan el diseño de la tabla, lo que lo hace más visual y sencillo de personalizar.

Insertar la tabla

Al finalizar guardamos los cambios y la tabla queda lista. En la parte superior de la página de configuración encontraremos ahora una línea de código, la cual utilizaremos para insertar la tabla en una de las páginas de nuestro sitio. Para ello simplemente copiamos el código y lo pegamos en la edición de una entrada, tal como si fuera texto. Al publicar la entrada aparecerá nuestra tabla.

¿Te gustó este artículo? Si es así, compártelo con tus amigos y conocidos 😉

Share on facebook
Share on twitter
Share on linkedin
Share on email
Share on whatsapp
Sobre mí

Sobre mí

¡Hola! Me llamo Jose AMD, vivo en Sevilla y soy Desarrollador Web. Estoy aquí para ayudarte a crear y mejorar tu página web, para que así puedas convertir tus grandes ideas en realidad. ¡Infórmate!

Déjame un mensaje

Me gustaría saber más sobre ti, tus proyectos y cómo crees que puedo ayudarte con tu página web. Puedes contactar conmigo enviándome un email a info@joseamd.es o rellenando el siguiente formulario, como prefieras 😉

  • Este campo es un campo de validación y debe quedar sin cambios.

Ir arriba