PrestaShop Gestión de catálogo

Configurador de Producto por Pasos: opciones visuales, vista previa en vivo e impacto en el precio (PrestaShop 1.7, 8 y 9)

Cada producto se vuelve configurable, paso a paso

Color, grabado, accesorio: sus clientes componen su producto en un recorrido guiado, ven el resultado en tiempo real capa a capa, y el precio justo llega al carrito — calculado en el servidor, infalsificable.

De un vistazo
  • 10 tipos de campo (listas, tarjetas de radio, muestras de color, miniaturas, texto, subida de archivo, número, fecha) con campos condicionales «Mostrar solo si…»
  • Un configurador para varios productos o categorías enteras, duplicable en un clic
  • Vista previa compuesta en tiempo real (capas PNG, tinte, texto con estilo), o desactivada para conservar las imágenes del tema o del page builder
  • Precio y peso calculados en el servidor por opción: fijo, porcentaje, por carácter o fórmula, gastos de envío por peso nativos
  • Creative Elements: hook dedicado, enlace de información que abre una plantilla en ventana, ventana de carrito con el detalle de la personalización
PrestaShop 1.7, 8 y 9 Multimoneda Vista previa en vivo Creative Elements Sin Composer
  • Reembolso de 30 días
  • 12 meses de actualizaciones
  • Soporte 24h
  • PrestaShop Certified Agency 2026
  • PrestaShop Expert Certification — Core Skills

Desarrollado por una agencia certificada PrestaShop

www.datafirefly.com/es/
Configurador de producto por pasos en PrestaShop con opciones visuales y vista previa del precio en vivo
v1.3.0 · actualizado 2026-10-11
Qué hace

La versión corta.

01

Recorrido guiado por pasos

Cree tantos pasos como necesite cada producto: 10 tipos de campo, opciones visuales, grabado, subida de archivo, con campos condicionales que solo aparecen cuando se elige una opción concreta (el marco solo para una impresión enmarcada). La numeración y la barra de pasos se muestran u ocultan según su diseño.

02

Vista previa compuesta en tiempo real

Cada opción puede llevar una capa PNG transparente apilada sobre la foto del producto, o teñir su silueta. El texto grabado se muestra en directo con la fuente, el tamaño y el color elegidos por el cliente, en zonas de colocación que usted dibuja con el ratón. La vista previa se desactiva en un clic cuando las imágenes las gestiona un page builder.

03

Precio calculado en el servidor

Cada opción lleva un impacto sin impuestos (fijo, porcentaje del precio base, por carácter, por unidad o fórmula) y un peso. El total mostrado es orientativo; el cálculo real pasa por el mecanismo de precios nativo de PrestaShop con conversión de moneda e IVA, y el peso se suma al carrito para el envío.

04

Pensado para page builders

Coloque el configurador donde quiera con el hook displayDfProductConfigurator, desde el widget Módulos o Shortcode de Creative Elements, sin tocar las imágenes ni los bloques de la página. Cada campo puede mostrar un enlace de información («Guía de materiales») que abre en una ventana una plantilla diseñada en Creative Elements.

05

Un configurador, todo un catálogo

Vincule un configurador a varios productos y a categorías enteras, subcategorías incluidas: cada producto conserva su propio precio base. Duplique un configurador en un clic para crear una gama; las condiciones entre campos se reconectan automáticamente en la copia.

06

Carrito limpio, taller servido

Cada configuración crea una personalización nativa de PrestaShop con un resumen legible, del carrito a la factura. Tras añadir, una ventana muestra el producto, cada elección y los totales del carrito con «Seguir comprando» y «Finalizar compra». El detalle del pedido reúne el resumen, los archivos del cliente y el visual final.

La versión larga

Todo lo que querrías saber antes de instalar.

Una mirada detallada a cómo funciona Configurador de Producto por Pasos: opciones visuales, vista previa en vivo e impacto en el precio (PrestaShop 1.7, 8 y 9), por qué lo construimos así y la lógica detrás de las características anteriores.

§ 01

Vender a medida sin disparar su catálogo

Cuadros de foto, botellas grabadas, joyas personalizadas, muebles configurables: en cuanto un producto se declina en tamaños, acabados y opciones de pago, las combinaciones nativas muestran sus límites (explosión combinatoria, stock inmanejable, sin grabado posible). El Configurador de Producto añade un recorrido guiado en la ficha de producto: el cliente elige, ve y paga el precio justo, sin que usted cree una sola combinación más.

§ 02

Una vista previa que vende por usted, o sus propios visuales

Cada opción puede llevar una capa PNG transparente apilada en tiempo real sobre la foto del producto, y el texto grabado se muestra con la fuente, el tamaño y el color elegidos. Si sus fichas están creadas con Creative Elements, desactive la vista previa: sus galerías y bloques quedan intactos, y el configurador se coloca bajo el título y el precio gracias a su hook dedicado.

§ 03

El precio justo, aplicado donde nadie puede hacer trampa

Cada opción lleva un impacto de precio sin impuestos, positivo o negativo, y un peso. El total se actualiza en directo en la moneda del visitante, pero ese importe es solo una visualización: el recargo real lo aplica el cálculo de precios nativo de PrestaShop, en el servidor, con conversión de moneda e IVA del cliente. El peso de las opciones se suma al carrito, lo que mantiene correctos los envíos por peso y el umbral de envío gratuito.

§ 04

Personalizaciones nativas, no una capa frágil

En lugar de reinventar el carrito, el módulo se apoya en las personalizaciones nativas de PrestaShop: cada configuración validada crea su propia línea con un resumen legible (Tamaño: 40 × 60 cm · Tipo: Impresión enmarcada · Marco: Nogal) que sigue el pedido hasta la factura y el back-office. Tras añadir, una ventana resume las elecciones y propone seguir comprando o finalizar la compra.

§ 05

Una administración pensada para ir rápido

Una sola pantalla por configurador: los productos y categorías objetivo, y luego los campos, que reordena arrastrando y soltando y pliega para conservar una vista de conjunto. Cada campo lleva sus opciones (etiqueta, precio, peso, referencia, color, miniatura), sus condiciones de visualización elegidas en una lista y, si hace falta, un enlace de información. Un configurador se duplica en un clic para crear una gama, y tres juegos de demostración se importan desde los ajustes del módulo.

€129,00
Pago único · 12 meses de actualizaciones
Leer la documentación
  • Instalaciones dev y staging ilimitadas
  • Código fuente incluido
  • Reembolso de 30 días
  • Soporte 24h · EN / FR
5,0/5 20 reseñas