Cómo crear una lista de precios o tabla de precios en WordPress 

Cuando necesité mostrar mis tarifas en un sitio de WordPress por primera vez, no quise complicarme con shortcodes o plugins torpes. Solo quería algo simple, limpio y fácil de actualizar.

Si estás en la misma situación, puedes crear ambos sin tocar código. Te mostraré cómo crear una lista de precios para servicios o artículos de menú, y cómo crear una tabla de precios para planes escalonados, ambos con el creador de arrastrar y soltar de SeedProd.

Empecemos por cuál encaja mejor en tu sitio.

Por qué tu sitio web necesita precios

La mayoría de los compradores comprueban los precios antes de estar listos para comprar. Mostrar tus precios les ayuda a comparar lo que ofreces y a sentirse seguros de su decisión.

Es especialmente útil para autónomos, dueños de salones y negocios locales donde la transparencia genera confianza.

Los precios claros mejoran la experiencia del usuario

Si los visitantes no encuentran tus precios rápidamente, probablemente abandonarán tu sitio. Mostrarlos claramente ayuda a la gente a decidir más rápido y ayuda a reducir tu tasa de rebote.

Lista de precios vs. Tabla de precios: ¿Cuál necesitas?

Estas dos se confunden mucho, pero resuelven problemas diferentes. Un vistazo rápido a cada una te dirá cuál crear.

Una tabla de precios muestra varios planes uno al lado del otro, generalmente con una lista de características y un botón debajo de cada uno. A menudo las verás en sitios de SaaS o de membresía.

Una lista de precios es más sencilla. Enumera servicios o artículos individuales con un precio para cada uno, lo que funciona mejor para restaurantes, autónomos o salones de belleza.

Aquí tienes la versión corta. Usa una lista de precios para un negocio de un solo servicio, un menú o una hoja de tarifas donde cada entrada es independiente.

Usa una tabla de precios cuando ofrezcas niveles o paquetes y quieras que la gente los compare de un vistazo. En cualquier caso, puedes crearlo con la misma herramienta, así que no estás atado a tu elección.

Para esta guía, usaré un creador de arrastrar y soltar porque es la forma más fácil de conseguir que cualquiera de los dos diseños se vea como quieres, y SeedProd es la mejor solución del mercado.

SeedProd es el creador de sitios web de arrastrar y soltar más fácil de usar para WordPress. Su interfaz facilita la creación de diseños de páginas personalizados, sin necesidad de código.

Tiene un bloque dedicado para cada tarea: un bloque Lista de precios y un bloque Tabla de precios. Ambos vienen con plantillas predefinidas, por lo que puedes tener un resultado elegante en cuestión de minutos.

Esto es lo que obtienes con SeedProd:

• Bloques integrados de Lista de precios y Tabla de precios
• Biblioteca de plantillas prediseñadas
• Constructor de temas de WordPress
• Constructor de páginas de destino

Sigue los pasos a continuación para crear el que necesites.

Cómo crear una lista de precios en WordPress

Una lista de precios es la opción correcta cuando cada servicio o artículo es independiente. Veamos qué incluir en ella y luego creemos una paso a paso.

¿Qué debe incluir una lista de precios?

Una buena lista de precios cubre cuatro cosas: el nombre del artículo, una breve descripción, el precio y una foto opcional. Algunas empresas también añaden un enlace a una página de producto o a un formulario de reserva, lo que funciona bien para generar conversiones a partir de cada entrada.

Establecer tus tarifas requiere un poco de investigación. Normalmente consulto las hojas de tarifas de la competencia para ver cuál es el estándar, y luego tengo en cuenta mis costes antes de decidir un formato.

Una tarifa fija es lo más claro para la mayoría de los lectores, pero los precios "a partir de" funcionan cuando tu servicio varía según el alcance. El bloque de lista de precios de SeedProd maneja todos estos campos en un solo diseño: título, descripción, precio, imagen y enlace.

Paso 1. Instalar y Activar SeedProd

El primer paso es ir al sitio web de SeedProd y descargar el plugin. Puedes elegir entre varios planes de precios que se adapten a tu presupuesto, pero yo estoy usando la versión SeedProd Pro para este tutorial.

A continuación, instala y activa el archivo zip del plugin en tu sitio web de WordPress. Puedes seguir esta publicación sobre cómo instalar un plugin de WordPress si es la primera vez que lo haces.

Tras activar el plugin, ve a la página SeedProd » Ajustes y pega tu clave de licencia. Puedes encontrar tu clave de licencia en tu cuenta de SeedProd en la sección Descargas.

Ahora haz clic en el botón Verificar clave.

Paso 2. Elige el tema o el constructor de páginas de destino

Hay varias formas de personalizar tu sitio de WordPress con el constructor de sitios de arrastrar y soltar de SeedProd.

Puedes reemplazar el diseño de tu sitio existente por uno nuevo creando un tema de WordPress personalizado. O puedes mantener tu diseño actual y crear una página de precios independiente con el Landing Page Builder.

En cualquier caso, todavía puedes usar el bloque Price List de SeedProd, porque utiliza la misma interfaz de page builder.

Para esta guía, elegiré la opción Theme Builder, así que navega a SeedProd » Theme Builder y haz clic en el botón Theme Template Kits .

Paso 3. Selecciona una plantilla personalizada

En la siguiente pantalla, verás la biblioteca de plantillas de sitios web prediseñadas de SeedProd. Incluyen todas las funciones y páginas que necesitas para crear un sitio web completo y un diseño profesional que puedes personalizar fácilmente.

Haz clic en el icono de la lupa en cualquier plantilla para previsualizar el tema completo. Por ejemplo, si previsualizas el tema Andaman Budget Hotel, verás que la página de Comedor ya tiene una lista de precios sencilla que puedes editar.

Puedes filtrar la biblioteca de plantillas para mostrar solo temas de WooCommerce o hacer clic en el menú desplegable para mostrar primero los temas más nuevos, más antiguos o más populares.

Una vez que encuentres un diseño que te guste, haz clic en el icono de la marca de verificación para importarlo, lo que debería tardar solo unos segundos.

Ahora verás las partes de tu tema en el panel de control del Theme Builder. Puedes editar cualquier plantilla pasando el ratón por encima y haciendo clic en el enlace Editar diseño.

Consulta nuestra guía sobre cómo crear un tema personalizado de WordPress para obtener más detalles sobre cómo personalizar las partes de tu tema.

SeedProd también creará las páginas de la demostración del tema para que las personalices con su constructor de páginas. Simplemente ve a Páginas » Todas las páginas, y las verás en la lista con “SeedProd” junto al título de la página.

Personalizaré la página “Dining” para mostrarte cómo usar la función Price List de SeedProd. Así que pasa el ratón sobre la página y haz clic en el enlace Edit with SeedProd .

Paso 4. Personaliza tu página de lista de precios

Cuando abras cualquier página con SeedProd, verás un diseño como este:

El page builder tiene bloques de WordPress y ajustes a la izquierda y una vista previa en vivo de tu diseño a la derecha. Los bloques funcionan como el editor de bloques de WordPress, así que arrastras nuevos bloques a tu página y haces clic para editarlos en tiempo real.

Cuando miras el menú de este diseño, verás que está hecho de bloques de encabezado y texto.

El bloque Price List es una forma más fácil de mostrar los elementos de tu menú y sus precios. Incluye automáticamente espacio para tu artículo, descripción, precio e imagen, con muchas opciones de personalización.

Desde el panel izquierdo, desplázate hasta la sección Avanzado, busca el bloque Lista de precios y arrástralo a tu página.

El bloque añadirá contenido de relleno para darte una idea de cómo se verán las cosas. Así que vamos a añadir algunos elementos de la lista de precios.

Para hacerlo, haz clic en el encabezado “Elemento 1” para expandirlo. Dentro, puedes agregar un título, descripción y precio, subir una foto e incluso agregar un enlace a la página del producto individual.

Repite este paso para cada elemento de tu lista de precios.

Después de agregar elementos a tu lista de precios, puedes expandir los ajustes de Diseño. En este panel, puedes cambiar la posición de la imagen y el precio, elegir un separador de precios diferente y ajustar la alineación general de la lista.

Incluso puedes enlazar la caja de precio completa a la página de precios individual. Simplemente haz clic en el interruptor a la posición Sí.

En el panel Área de imagen, puedes controlar el tamaño y la forma de cualquier imagen en tu lista de precios. Las opciones incluyen Predeterminado, Redondeado, Círculo y Personalizado, donde puedes definir tu propio radio de borde de imagen.

Ahora haz clic en la pestaña Avanzado para ver opciones de estilo adicionales.

Este panel te permite controlar la tipografía, el tamaño de fuente y los colores de los elementos individuales de tu lista. El bloque Price List te da control total sobre cómo aparecen los precios de tus servicios en pantalla.

También puedes ajustar el espaciado, los bordes, los colores de fondo y la visibilidad en dispositivos de escritorio y móviles. Y no necesitarás escribir CSS o HTML personalizados.

Simplemente apunta y haz clic para agregar nuevos estilos.

Una vez que estés satisfecho con tu lista de precios, puedes eliminar el contenido de relleno antiguo. Para hacerlo, pasa el cursor sobre cada columna hasta que veas un contorno azul y haz clic en el icono de la papelera.

Haz eso para cada elemento de la página que ya no necesites. Ahora, haz clic en el botón Guardar en la esquina superior derecha de tu pantalla.

Ahora que tu página de precios está completa, puedes editar y personalizar el resto de tu tema de WordPress.

Aquí tienes algunas guías útiles que pueden ayudarte con tus personalizaciones:

• Cómo agregar un botón al encabezado de tu sitio web
• Cómo agregar el horario de tu negocio a tu sitio web
• Cómo agregar iconos sociales personalizados a tu sitio web

Paso 5. Publica tu página de lista de precios

Cuando hayas terminado de personalizar tu sitio web, estarás listo para publicar los cambios en el front-end.

Primero, asegúrate de haber guardado tus cambios, luego haz clic en el icono X para salir del constructor de páginas y navegar de regreso a la página Theme Builder en tu panel de WordPress.

Desde allí, encuentra el interruptor que dice "Enable SeedProd Theme" y ponlo en la posición Yes.

Ahora puedes visitar tu sitio web en vivo para ver cómo quedan tus personalizaciones. Aquí está la página Dining que personalicé con una nueva lista de precios en este tutorial. Si quieres ir más allá, nuestra guía de sitios web de restaurantes cubre cómo construir un sitio completo utilizando el mismo enfoque.

Cómo crear una tabla de precios en WordPress

Si ofreces planes o paquetes por niveles, una tabla de precios es la mejor opción. Pone cada plan uno al lado del otro para que los visitantes puedan comparar características y elegir el que mejor les convenga.

SeedProd tiene un bloque dedicado Pricing Table para esto exactamente, y funciona en el mismo constructor de arrastrar y soltar. Me gusta empezar aquí porque no solo estás insertando una tabla, puedes construir una sección de precios completa a su alrededor con testimonios, un temporizador de cuenta atrás y botones de llamada a la acción que impulsan las inscripciones.

Así es como se construye una en una landing page. Si aún no has creado tu página, sigue nuestra guía paso a paso sobre cómo crear una landing page con SeedProd, y luego vuelve aquí para la tabla de precios.

Paso 1. Añadir el bloque de Tabla de Precios

Abre tu página en el constructor de SeedProd y añade una fila donde quieras que vaya tu tabla. Elegí una plantilla predefinida y añadí una fila con tres columnas para albergar una tabla de tres planes.

Desde el panel de bloques, arrastra el bloque Pricing Table a la primera columna. Para una tabla de tres columnas, repite esto dos veces más para que cada plan tenga su propia columna.

Paso 2. Personaliza tus planes

Haz clic en el icono de configuración de cualquier bloque de tabla para editar ese plan. Cada uno tiene campos para todo lo que un buen plan necesita.

• Nombre del plan
• Precio y divisa
• Un precio "normal" para mostrar un descuento
• Una descripción corta
• Una lista de características
• Uno o más botones CTA

En la pestaña Avanzado, puedes cambiar los colores, fuentes, iconos, espaciado, botones y efectos de desplazamiento de cada tabla. Así es como haces que un nivel destaque entre los demás, lo que impulsa a los compradores hacia el plan que quieres que elijan.

Sigue editando hasta que estés satisfecho con el aspecto de los niveles. Luego haz clic en el botón Guardar para conservar tus cambios.

Paso 3. Publicar su tabla de precios

Cuando tu tabla esté lista, haz clic en la flecha desplegable junto al botón Guardar y elige Publicar. Eso es todo lo que se necesita para lanzar la página.

Haz clic en Ver página en vivo para ver tu tabla de precios terminada, como el ejemplo de tres columnas en la parte superior de esta guía. ¿Prefieres añadir una tabla dentro de una publicación o página normal en lugar de una página de destino? Un plugin independiente puede hacer eso, y nuestro resumen de los mejores plugins de tablas de precios para WordPress repasa las opciones.

Preguntas Frecuentes

¿Cuál es la diferencia entre una lista de precios y una tabla de precios en WordPress?

Una lista de precios muestra servicios o artículos individuales con sus precios, una entrada por fila. Una tabla de precios compara múltiples planes uno al lado del otro, a menudo con listas de características y botones de llamada a la acción.

Usa una lista de precios para un menú de restaurante o una página de tarifas de servicios. Usa una tabla de precios para productos SaaS o niveles de membresía.

¿Qué debe incluir una lista de precios?

Una lista de precios debe incluir el nombre del artículo, una breve descripción y el precio. Agregar una foto opcional y un enlace a una página de producto o reserva puede mejorar las conversiones.

El bloque de Lista de Precios de SeedProd tiene campos dedicados para todo esto, por lo que no necesitas construir el diseño tú mismo.

¿Cuántos niveles debería tener mi tabla de precios?

No hay una única respuesta correcta, pero de tres a cuatro niveles funciona para la mayoría de las empresas. Muy pocos y pierdes la venta adicional, demasiados y la gente se paraliza en la decisión.

Si no estás seguro, empieza con tres y destaca el del medio como tu plan recomendado.

¿Cuál es la diferencia entre una tabla de precios vertical y una horizontal?

Se reduce a la orientación. Una tabla de precios vertical apila las características de cada plan en su propia columna, una al lado de la otra, que es el diseño que la mayoría de la gente imagina.

Una tabla horizontal presenta las características en filas a través de los planes. La vertical funciona mejor en la mayoría de los sitios porque se lee limpiamente en dispositivos móviles.

¿Puedo añadir una lista de precios o tabla de precios a cualquier página de mi sitio de WordPress?

Sí. Con SeedProd, puedes añadir cualquiera de las dos a una página de precios dedicada, una sección en tu página de inicio o una página de servicios. Ambos bloques funcionan en el Theme Builder y en el Landing Page Builder.

Eso significa que no estás limitado a una sola ubicación, y puedes reutilizar el mismo bloque en varias páginas de tu sitio.

¿Necesito un plugin para añadir precios en WordPress?

No necesitas un plugin dedicado, pero una herramienta como SeedProd lo hace mucho más rápido. Te proporciona bloques integrados de Lista de Precios y Tabla de Precios con controles de diseño, opciones de imagen y configuraciones de tipografía.

Sin uno, tendrías que construir el diseño desde cero con HTML o shortcodes, lo que lleva significativamente más tiempo.

¡Eso es todo!

Espero que este artículo te haya ayudado a aprender cómo añadir una lista de precios o una tabla de precios en WordPress. 

SeedProd es el mejor plugin de WordPress para personalizar tu sitio web. No necesitarás ningún shortcode, widget o complemento adicional, solo un creador de sitios web directo y fácil de usar con arrastrar y soltar que te pondrá en marcha rápidamente.

¿Listo para añadir precios a tu sitio de WordPress?

También te puede interesar esta reseña de Elementor vs WPBakery vs SeedProd, para ver cómo se comparan.

¡Gracias por leer! Nos encantaría conocer tu opinión, así que únete a la conversación en YouTube, X y Facebook para obtener más consejos y contenido útil para hacer crecer tu negocio.