Plugin propio para WooCommerce: imagen sobre el producto

Contenido del caso

Contexto del proyecto

SW Image Layer for YITH Product es un plugin propio de SergioWeb para tiendas online en WordPress y WooCommerce. Se puede descargar gratis en la página de plugins.

Muchas tiendas ofrecen productos personalizables: el cliente elige una imagen, un diseño o un acabado y lo añade al producto. Las herramientas estándar de WooCommerce solo permiten elegir la opción en una lista de texto, y el cliente no ve cómo quedará el resultado sobre el producto.

Objetivo

  • Mostrar al cliente el resultado de la personalización antes de la compra, directamente sobre la foto del producto.
  • Evitar crear una fotografía distinta para cada combinación de producto, color y opción.
  • Ofrecer a la tienda una herramienta de gestión sencilla, sin depender de un desarrollador.

Solución

El plugin funciona como extensión de YITH WooCommerce Product Add-ons. YITH gestiona la selección, el precio y el pedido; el plugin se encarga de lo que ve el cliente.

  • Superposición sobre la foto. La opción elegida aparece al instante sobre la imagen principal del producto, en el lugar y con el tamaño definidos.
  • Ajuste preciso en cada producto. La posición y el tamaño se definen en porcentajes, por lo que la imagen se mantiene igual en ordenador, tablet y móvil.
  • Selección rápida. Lista compacta con miniaturas y buscador que no distingue mayúsculas ni tildes.
  • Compatible con variaciones. Al cambiar el color del producto, la imagen elegida se mantiene en su sitio.
  • Versión móvil. En el móvil, la galería pasa automáticamente a la foto con la personalización.

La opción elegida aparece sobre la foto del producto en el momento de la selección.

Gestión

La configuración se realiza en la ficha de cada producto: posición horizontal, posición vertical y ancho. La vista previa muestra el resultado al instante, mientras se escriben los valores.

Una posición por defecto se define una sola vez para toda la tienda, y solo se ajustan las excepciones. Las actualizaciones se instalan desde el panel de WordPress con un clic. La interfaz está disponible en español, inglés y ruso.

La posición y el tamaño de la imagen se ajustan con vista previa.

Resultado

  • El cliente entiende en un clic qué está comprando: dónde irá la personalización y de qué tamaño será.
  • La tienda no necesita fotografiar cada combinación: una sola foto del producto sirve para todo el catálogo de opciones.
  • Las nuevas opciones y productos se añaden sin modificar el código.

Estado actual

El plugin ya funciona en varias tiendas online y está disponible para su descarga gratuita en la página de plugins de SergioWeb.

Otros casos de éxito:
Desarrollo de una landing multilingüe en 5 idiomas

Desarrollo de una landing multilingüe para un profesor particular de español. El proyecto se completó en 4 días, fue localizado manualmente a cinco idiomas y quedó totalmente preparado para el lanzamiento de campañas publicitarias. Al día siguiente de iniciar la publicidad comenzaron a llegar las primeras solicitudes.

Ver caso completo »

Analicemos su proyecto

Información básica sobre protección de datos

Responsable: Serhii Zvonarov (SergioWeb). Finalidad: responder a su consulta y, en su caso, enviarle un presupuesto. Legitimación: su consentimiento. Destinatarios: no se cederán datos a terceros, salvo obligación legal. Derechos: acceso, rectificación, supresión y demás derechos, escribiendo a info@sergioweb.es. Más información en la Política de privacidad.