Cómo mostrar los descuentos de Shopify en la ficha de producto (y por qué hemos lanzado Discount Display) - PangoStudio

Cómo mostrar los descuentos de Shopify en la ficha de producto (y por qué hemos lanzado Discount Display)

Hay una fuga silenciosa en muchísimas tiendas Shopify: aplicas un descuento, el cliente lo verá… en el checkout. Pero en la ficha de producto, donde de verdad decide si compra, el precio sigue apareciendo como si no hubiera oferta. El ahorro está, pero es invisible justo donde más convierte.

En Pango Studio nos hemos topado con este problema —cómo mostrar los descuentos de Shopify en la ficha de producto— en tantas tiendas de clientes que hemos hecho lo que mejor sabemos hacer: construir la herramienta. Se llama Discount Display y ya está publicada en el Shopify App Store. Puedes instalarla gratis aquí mientras te contamos el problema y cómo lo hemos resuelto.

Etiquetas de descuento en productos de una tienda, ejemplo de rebajas visibles en la ficha de producto de Shopify

El problema: Shopify no muestra el descuento en la página de producto

Shopify calcula los descuentos automáticos y los códigos en el carrito y el checkout. Es correcto a nivel técnico, pero comercialmente es un disparo en el pie: el comprador que está mirando la ficha no ve el precio rebajado ni el ahorro. Y el ahorro visible en la página de producto es uno de los mayores motores de conversión que existen. Si tu oferta no se ve donde se toma la decisión, es como poner el cartel de rebajas dentro del almacén.

Las formas malas de mostrar descuentos en Shopify

1. Trucar el compare_at_price

La solución casera más común es meter el precio original en compare_at_price a mano. Funciona a medias y crea tres problemas: tienes que mantenerlo producto por producto, se desincroniza en cuanto cambias la oferta, y pisas un campo que Shopify usa para su propia lógica de rebajas e informes. Cuando gestionas cientos o miles de variantes, es inviable.

2. Apps de descuentos pesadas, llenas de JavaScript

Muchas apps de badges inyectan JavaScript que se ejecuta en el navegador del cliente para pintar el precio. Resultado: la ficha carga más lenta, penalizas Core Web Vitals y, por tanto, tu SEO. Cambiar una fuga de conversión por una penalización de velocidad no es un buen trato.

Cómo mostrar el precio tachado en Shopify con Discount Display

Nuestra app de descuentos lee tus promociones nativas de Shopify desde el Admin API, calcula el precio final por variante y lo muestra en la ficha de producto y en las tarjetas de colección. Tres decisiones de diseño la diferencian:

Muestra lo correcto según el tipo de descuento (3 niveles)

  • Precio tachado para descuentos automáticos de producto (porcentaje o importe por unidad, para todos los compradores y sin mínimos). El cliente ve el precio original tachado y el rebajado.
  • Badge claro para códigos, descuentos de pedido o envío, volumen o con mínimos: «-20%», «Envío gratis», «con el código VERANO».
  • Privacidad primero: los descuentos segmentados a un cliente concreto nunca se muestran en público.

Sin tocar el compare_at_price

La app es la única fuente de verdad del descuento mostrado. No sobrescribe tus precios ni tu inventario de ofertas. Lo que ves es lo que Shopify realmente va a aplicar.

Liquid puro, pensado para SEO y velocidad

Discount Display pinta el precio en Liquid, sin JavaScript de bloqueo. La ficha sigue siendo rápida y amigable con el posicionamiento. Y se mantiene sola: se resincroniza en tiempo real con webhooks cuando creas o cambias un descuento, un producto o una colección, más un resync diario para las ofertas que empiezan o caducan por fecha.

Compatible con tu ERP y con todo lo que ya usa el compare_at_price

Este es el punto que marca la diferencia en tiendas serias. Muchos ecommerce sincronizan el compare_at_price desde su ERP, su PIM o su feed de precios: lo usan para su propia lógica de rebajas, para los informes internos o para alimentar Google Shopping y el Merchant Center. Las apps de descuentos que secuestran ese campo para pintar el tachado entran en guerra con todo eso: se pisan, se desincronizan y acaban rompiendo la lógica de precios de tu ERP o de tu feed.

Como Discount Display no toca el compare_at_price, convive sin conflictos con tu ERP, tu PIM, tu conector de Google Shopping y cualquier automatización que ya dependa de ese campo. Tú lo sigues usando para lo que necesites; la app muestra el descuento nativo de Shopify por otra vía. Cuando hay integraciones de por medio —que es lo normal según crece la tienda— esto deja de ser un detalle y pasa a ser justo el motivo por el que la app no te dará un dolor de cabeza dentro de tres meses. Y si tu caso es más complejo (un ERP a medida, reglas de precio propias), es exactamente el tipo de integración que montamos en Pango.

Instala Discount Display en un minuto (y empieza gratis)

Se instala en minutos y sin tocar código: abres el editor de temas, arrastras el bloque «Discount Display» a tu página de producto y listo. Es compatible con Dawn y la mayoría de temas, con un snippet para las tarjetas de colección.

  • Free — hasta 50 productos, gratis para siempre.
  • Pro — productos ilimitados, badges en colección y soporte por email. 9,99 $/mes con 14 días de prueba.

👉 Instala Discount Display gratis desde el Shopify App Store y empieza a mostrar tus ofertas donde de verdad venden.

Preguntas frecuentes

¿Cómo muestro un descuento en la ficha de producto de Shopify?

Shopify no lo hace de serie: aplica el descuento en el checkout, no en la página de producto. La forma limpia de conseguirlo es una app que lea los descuentos nativos y pinte el precio en el tema. Con Discount Display se hace instalando la app y arrastrando su bloque a la ficha; en un minuto ya se ve el precio tachado o el badge.

¿Puedo mostrar el precio tachado sin tocar el compare_at_price?

Sí. Discount Display no escribe en compare_at_price ni modifica tus precios base: calcula y muestra el descuento por su cuenta, así que evitas la desincronización y los problemas de mantenimiento del apaño manual.

¿Es compatible con mi ERP o mi feed de Google Shopping?

Sí. Como la app no escribe en el compare_at_price, no interfiere con los sistemas que sí lo usan: tu ERP, tu PIM, tu conector de Google Shopping o cualquier automatización de precios pueden seguir gestionando ese campo como hasta ahora, sin conflictos ni pisadas.

¿Una app de descuentos ralentiza la tienda?

Depende de cómo esté hecha. Las que pintan el precio con JavaScript en el navegador sí penalizan velocidad y SEO. Discount Display trabaja en Liquid, del lado del servidor, así que no añade JavaScript de bloqueo ni te toca los Core Web Vitals.

¿Funciona con códigos de descuento?

Sí. Para los códigos y los descuentos de pedido o envío muestra un badge claro («con el código VERANO», «Envío gratis»), y el precio tachado lo reserva para los descuentos automáticos de producto, que es donde es honesto.

¿Tiene plan gratis?

Sí, hay un plan Free hasta 50 productos y un plan Pro para catálogos ilimitados. Puedes instalarla gratis y probarla en tu tienda sin coste.

Por qué lo construimos nosotros

Discount Display es un ejemplo de cómo trabajamos en Pango Studio: cuando un problema técnico se repite en las tiendas de nuestros clientes, no lo parcheamos, lo resolvemos de raíz con una herramienta bien hecha. Es la misma filosofía con la que hemos desarrollado nuestras otras apps de Shopify —como Tariffy y Revive Cart— y con la que afinamos el rendimiento de tiendas Shopify y Shopify Plus.

Si tu tienda tiene un problema parecido (descuentos que no se ven, una ficha lenta, un ERP que hay que integrar sin romper nada, o una funcionalidad que ninguna app del store resuelve bien), es justo el tipo de reto que nos gusta. Somos una agencia Shopify técnica en Madrid y desarrollamos tanto apps públicas como soluciones a medida. Hablamos.

Add comment: