Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
Copa WPB
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Cómo añadir bonitas tablas de precios en WordPress (sin código)

Nota editorial: Ganamos una comisión de los enlaces de socios en WPBeginner. Las comisiones no afectan a las opiniones o evaluaciones de nuestros editores. Más información sobre Proceso editorial.

¿Quieres añadir bonitas tablas de precios a tu sitio WordPress?

Las tablas de precios influyen enormemente en las decisiones de compra de los usuarios. Añadir tablas de precios atractivas y fáciles de explorar permite a los usuarios seleccionar el producto adecuado. Esto te ayuda a aumentar las conversiones y las ofertas.

En este artículo, le mostraremos cómo añadir fácilmente hermosas tablas de precios en WordPress sin escribir ningún código.

How to Add Beautiful Pricing Tables in WordPress (No Code)

¿Por qué añadir tablas de precios con un plugin de WordPress?

Hay dos maneras de añadir nuevas características a su sitio web de WordPress. Puedes programarlas manualmente, utilizando código, o puedes utilizar un plugin de WordPress.

Si está familiarizado con HTML y CSS, puede crear una tabla de precios utilizando código. Los conocimientos de programación y diseño requeridos no son especialmente avanzados, y tendrá un control total sobre el diseño de la tabla.

Sin embargo, escribir y probar el código llevará tiempo. Y también tendrá que tener en cuenta a sus usuarios que utilizan dispositivos móviles o diferentes navegadores / exploradores web. Puede que acabes con una tabla de precios poco atractiva que no se vea bien para todos tus usuarios.

Utilizar un plugin de WordPress es más rápido y sencillo, y es la mejor solución si no tiene experiencia en diseño o codificación.

Dicho esto, echemos un vistazo a cómo añadir bonitas tablas de precios en WordPress sin escribir ningún código. Vamos a cubrir dos plugins de WordPress diferentes, y usted puede elegir el que funcione para usted:

Método 1: Añada bonitas tablas de precios con Easy Pricing Tables

Este método le permite añadir tablas de precios a una página o entrada existente. Si necesita personalizar el resto de la página, utilice el método 2.

Lo primero que tienes que hacer es instalar y activar el plugin Easy Pricing Tables. Para más detalles, consulte nuestra guía práctica sobre cómo instalar un plugin de WordPress.

Para este tutorial, utilizaremos el plugin gratuito. También hay un plugin premium que ofrece más características y comienza en $ 49 para una licencia de sitio único. Necesitarás la versión premium si deseas acceder a plantillas adicionales, añadir imágenes o integrar la tabla con WooCommerce.

Paso 1: Creación de la tabla de precios

Una vez activado, diríjase a la página Tablas de precios ” Añadir nuevo desde la barra lateral del administrador de WordPress.

Aquí se le preguntará dónde desea añadir la tabla a su sitio. Simplemente seleccione la opción “Nueva página con tabla de precios”.

Choose where you want to add the pricing table

Se abrirá una nueva página de precios en el editor de bloques de WordPress, en cuya pantalla aparecerá la indicación “Elija una plantilla”.

A partir de aquí, seleccione un diseño de su agrado para incrustar las tablas de precios en su página de WordPress.

Choose pricing table template

Paso 2: Personalizar la tabla de precios

Personalizar la tabla de precios es muy fácil. Por ejemplo, puedes empezar cambiando los encabezados de los planes de precios.

Después, puede hacer clic en la tabla para empezar a añadir subtítulos, características, precios y mucho más.

Edit pricing table

Puedes utilizar la barra de herramientas del bloque en la parte superior del bloque de tabla para añadir una nueva columna, cambiar la alineación de filas y columnas, reordenar las columnas y cambiar sus tamaños.

A menudo, en las tablas de precios, un plan aparece marcado como “destacado” o “más popular”. Puede hacerlo seleccionando la columna que desea resaltar y haciendo clic en el icono de estrella de la barra de herramientas.

También puede cambiar el aspecto visual de la mesa a su gusto desde el panel de bloques situado en la esquina derecha de la pantalla.

Por ejemplo, puede cambiar el color de acento para resaltar el mejor plan de precios o cambiar el color del botón en la parte inferior de la tabla.

Change accent color in the pricing table

También puede hacer clic en los botones para editar sus etiquetas.

Una vez hecho esto, puede añadir una etiqueta y una URL de su elección a los campos.

Add button label and URL

Paso 3: Publicación de la tabla de precios

Para publicar la tabla de precios en su sitio de WordPress, sólo tiene que hacer clic en el botón “Actualizar” o “Publicar” situado en la esquina superior derecha de la pantalla.

También puede enlazar el enlace “Vista previa” para ver la página antes de publicarla en su sitio web.

Save and publish pricing page

Ahora, puede visitar su sitio web para ver el resultado final.

pricing table preview

Método 2: Añadir bonitas tablas de precios con un maquetador de páginas

Este método es el mejor si desea un control total sobre el diseño de su página de precios.

Primero, necesitas instalar y activar el plugin SeedProd. Para más detalles, consulte nuestra guía paso a paso sobre cómo instalar un plugin de WordPress.

SeedProd es un maquetador de páginas de WordPress de arrastrar y soltar para empresas, bloggers y propietarios de sitios web, y la mejor opción para crear páginas de precios de alta conversión. Necesitarás el plan Pro o Elite para acceder al bloque de tabla de precios que utilizamos en este tutorial.

Tras la activación, vaya a la página SeedProd ” Ajustes para introducir la clave de licencia de su plugin. Puede encontrar esta información en su cuenta en el sitio web de SeedProd.

Enter your SeedProd license key

Después de introducir su clave de licencia, empezaremos por crear una nueva página de destino y, a continuación, añadiremos un bloque de tabla de precios.

Creación de una nueva página de destino

Para crear la página de destino de su tabla de precios, debe dirigirse a SeedProd ” Páginas de destino y, a continuación, hacer clic en el botón “Crear una nueva página de destino”.

Add a New SeedProd Landing Page

En la siguiente pantalla, se le pedirá que elija un tema para la página de destino. SeedProd viene con docenas de hermosas plantillas de páginas de destino cuidadosamente organizadas para diferentes tipos de campañas.

Basta con hacer clic para seleccionar una plantilla que desee utilizar como punto de partida.

Select a SeedProd Landing Page Template

Puede aprender a personalizar la página y añadir nuevos bloques en nuestra guía sobre cómo crear una página de destino con WordPress. Cuando estés listo, seguiremos adelante y añadiremos la tabla de precios.

Añadir una tabla de precios

En primer lugar, debe añadir algunas columnas para poder colocar los bloques de la tabla de precios. Puede arrastrar el bloque ‘Columna’ a la página, y luego seleccionar suficientes columnas para mostrar sus precios. Para este tutorial, seleccionaremos tres columnas.

Start by Adding a Column Block to Your Landing Page

Después, tienes que localizar el bloque ‘Tabla de precios’ y arrastrarlo sobre las palabras ‘Arrastrar nuevo bloque aquí’ en cada una de las celdas que acabas de crear.

Para este tutorial, tendrás que arrastrar el bloque a la página tres veces distintas, una por cada columna.

Add a SeedProd Pricing Table Block to Each Column

Para editar una tabla de precios, basta con hacer clic en ella.

Ahora puede utilizar los ajustes de la pestaña Contenido para editar el nombre del plan e introducir el nombre de su producto o servicio. También puede cambiar el precio y la divisa, añadir el precio que cuesta normalmente el elemento / artículo cuando no está en oferta, y mucho más.

Customize Your Pricing Table Blocks Using the Content Tab

Después, debe cambiar a la pestaña Avanzado para personalizar la fuente y el tamaño del texto, el color y el tamaño de los botones, el espaciado, los efectos al pasar el cursor, etc.

Por ejemplo, puede hacer que un nivel de precios destaque más que otros, animando a sus usuarios a elegir esa opción.

Customize Your Pricing Table Blocks Using the Advanced Tab

Publicación de la tabla de precios

Una vez que esté satisfecho con su página de destino y las tablas de precios, es hora de publicarla.

Basta con hacer clic en la flecha desplegable del botón “Guardar” y pulsar “Publicar”.

Publish Your SeedProd Landing Page

Verá un aviso que le informará de que su página ha sido publicada.

También puede hacer clic en el botón “Ver página en vivo” para ver el aspecto de su nueva página de precios de WordPress.

SeedProd Pricing Table Preview

Bonificación: Aumente las conversiones de la página de precios

Una vez creada una página de precios atractiva, es importante optimizarla para obtener conversiones y animar a los usuarios a realizar una compra.

Para ello, puede ofrecer descuentos a los nuevos usuarios en un plan de precios específico. Esto puede servir de incentivo y motivar a los usuarios.

Para crear un cupón de descuento, recomendamos utilizar el plugin Advanced Coupons. Para más detalles, puedes consultar nuestro tutorial sobre cómo crear cupones inteligentes en WooCommerce.

Is Advanced Coupons the right coupon plugin for your WooCommerce store or WordPress website?

Otro truco para aumentar las ventas en su página de precios es crear una sensación de urgencia. De este modo, los usuarios se sentirán atraídos e incitados a actuar.

Puede hacerlo añadiendo temporizadores de cuenta atrás, ofreciendo productos limitados, descuentos por tiempo limitado, etc.

Además, puede utilizar TrustPulse que es el mejor plugin de prueba social de WordPress en el mercado.

Is TrustPulse the best social proof plugin for WordPress?

Muestra en directo la actividad de los clientes en su sitio web, como compras y registros, para aumentar las conversiones. Para obtener más consejos, puede consultar nuestro tutorial sobre cómo aumentar las conversiones de la página de precios en un 30%.

Esperamos que este tutorial te haya ayudado a aprender cómo añadir bonitas tablas de precios en WordPress, sin necesidad de código. Puede que también quieras aprender cómo crear un sitio de membresía en WordPress o ver nuestra lista de plugins esenciales de WordPress para sitios web de negocios.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

Descargo: Nuestro contenido está apoyado por los lectores. Esto significa que si hace clic en algunos de nuestros enlaces, podemos ganar una comisión. Vea cómo se financia WPBeginner , por qué es importante, y cómo puede apoyarnos. Aquí está nuestro proceso editorial .

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

El último kit de herramientas de WordPress

Obtenga acceso GRATUITO a nuestro kit de herramientas - una colección de productos y recursos relacionados con WordPress que todo profesional debería tener!

Reader Interactions

9 comentariosDeja una respuesta

  1. Syed Balkhi says

    Hey WPBeginner readers,
    Did you know you can win exciting prizes by commenting on WPBeginner?
    Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
    You can get more details about the contest from here.
    Start sharing your thoughts below to stand a chance to win!

  2. Moinuddin Waheed says

    Pricing table is a must have feature for any website that is making an online sale of products and services.
    Having a good looking, informative and call to action pricing table helps make quick purchase decision.
    it also helps make a comparison of different available options for some tweak of the costs, thus helps make informed decisions regarding the plan that best suits the need.

  3. Anika says

    Hi
    I want to make pricing table and add buy now button, on clicking on the buy now button wordpress admin will get an email notification of the plan choosed by the user
    Is it possible with this plugin

  4. Alex says

    I’ve created a really nice price table, which i can preview in table editing, but when I copied the ‘deployed’ text into the wanted webpage, nothing shows up. In page editing the deployed text is just written and in preview the page is blank :(

    So 2 questions: 1) where do you insert the deployed text? 2) after copying the text how do you activate it, so it is visible on the webpage?

    Thanks!

  5. Donna Heath says

    I don’t sell anything. I want to do reveiws on animal products and thus get advertisers. But, I am having a hard time gettig my followers numbers up. Should I go ahead write the reviews and contact the companies and ask for them to advertise on my page for a fee. When they say yes, hopeful thinking, how do I put advertisements on my site?

  6. Allan Jackson says

    This plugin sounds good but a bit pricey to my mind. Elementor does the same thing and much, much more for $45. I guess this would work if you couldn’t use a page builder for some reason.

  7. Farukh hussain says

    This is a very useful article for me. I was just finding some way to make these tables. Thanx for sharing.

  8. Krishna says

    Please make a tutorial video on how to make left navigation bar or WordPress custom page .just like any tutorial website like w3school . threy have a beautiful navigation sidebar on their website . I want this feature in WordPress website too.please do fast and notify me via email

Deja tu comentario

Gracias por elegir dejar un comentario. Tenga en cuenta que todos los comentarios son moderados de acuerdo con nuestros política de comentarios, y su dirección de correo electrónico NO será publicada. Por favor, NO utilice palabras clave en el campo de nombre. Tengamos una conversación personal y significativa.