Módulos de comparación de productos

En este artículo se describen los módulos de comparación de productos y cómo implementarlos en sitios web de comercio electrónico de Microsoft Dynamics 365 Commerce.

Nota

Los módulos de botón de comparación de productos y comparación de productos están disponibles a partir de la versión 10.0.29 de Dynamics 365 Commerce. Úselos para sitios web de negocio a consumidor (B2C) y de negocio a negocio (B2B).

La funcionalidad de comparación de productos permite a los compradores comparar los detalles del producto en una página de comparación de productos para ayudarlos a tomar mejores decisiones de compra. Configure esta funcionalidad en el generador de sitios de Commerce mediante el módulo de comparación de productos. En las páginas de lista de productos (PLP), como los resultados de categoría, los resultados de búsqueda y las páginas de colecciones de productos, puede configurar un botón para la comparación de productos que permita a los compradores agregar productos a una bandeja de comparación. Configure esta funcionalidad en el generador de sitios mediante el módulo de botón de comparación de productos, que funciona como el módulo de vista rápida.

Cuando los usuarios del sitio agregan productos para compararlos seleccionándolos en mosaicos de productos, aparece una bandeja de comparación en la parte inferior de la página. La bandeja de comparación muestra los productos que el comprador está comparando actualmente, junto con vistas previas breves de los productos. Los usuarios del sitio también pueden agregar productos desde las páginas de detalles del producto (PDP) y pueden agregar variantes de productos específicas para comparar con los productos maestros.

Después de que los clientes agreguen algunos productos a la bandeja de comparación, pueden seleccionar Comparar para ser redirigido a una página de comparación de productos. La página de comparación de productos muestra los detalles del producto para cada producto seleccionado para que los clientes puedan comparar imágenes, precios, dimensiones del producto (tamaño, estilo y color), información de calificaciones agregadas y otros atributos del producto.

La siguiente ilustración muestra ejemplos del botón Comparar productos, el botón Eliminar de la comparación, la bandeja de comparación y la página de comparación de productos.

Captura de pantalla de información general de comparación de productos que muestra el botón Comparar producto, el botón Quitar de comparación, el panel de la bandeja de comparación y la página de comparación de productos.

Nota

  • La página de comparación de productos compara un conjunto predeterminado de propiedades de producto y todos los atributos que puede ver en un PDP para un producto determinado.
  • Las propiedades como el modo de entrega, el inventario disponible y la unidad de medida no se pueden ver en una página de comparación de productos.
  • Los clientes pueden agregar productos de diferentes categorías a la bandeja de comparación, si los productos son del mismo catálogo.
  • La función de comparación de productos actualmente se limita a comparar productos en un catálogo individual. Los usuarios del sitio no pueden hacer comparaciones entre catálogos.
  • Asegúrese de que la propiedad del módulo de renderizado del lado del cliente esté borrada para todos los módulos de comparación de productos.
  • Asegúrese de que el almacenamiento en caché de nivel de página está deshabilitado para todas las páginas en las que se usa el módulo de comparación de productos. Estas páginas incluyen PDP, PLP y páginas de comparación de productos. Para más información, consulte Configurar el almacenamiento en caché de páginas.

En la ilustración siguiente se muestra un ejemplo de una página de comparación de productos.

Captura de pantalla de una página de comparación de productos.

Agregar el módulo de comparación de productos a una nueva página de comparación de productos

Puede crear una página de comparación de productos dedicada agregando un módulo de comparación de productos al cuerpo de una página. Además de permitir que los clientes comparen los detalles de productos de diferentes productos, puede configurar el módulo de comparación de productos para brindarles a los clientes la opción de completar rápidamente su compra después de comparar productos. El módulo de comparación de productos también contiene una ranura Comparación vacía, donde puede agregar un módulo de bloque de contenido que describe el estado vacío (por ejemplo, "Su comparación de productos está vacía").

Para agregar un módulo de comparación de productos a una nueva página de comparación de productos, siga estos pasos:

  1. Vaya a Páginas y seleccione Nuevo para crear una nueva página.
  2. En el cuadro de diálogo Crear nueva página, en Nombre de página, introduzca un nombre de página apropiada (por ejemplo, Comparación de productos) y después seleccione Siguiente.
  3. En Elegir una plantilla, seleccione la plantilla adecuada (por ejemplo, la plantilla que usa la página de categoría predeterminada) y, a continuación, seleccione Siguiente.
  4. En Elija un diseño, seleccione un diseño de página (por ejemplo, Diseño flexible), y luego seleccione Siguiente.
  5. En Revisar y terminar, revise la configuración de la página. Si debe editar la información de la página, seleccione Atrás. Si la información de la página es correcta, seleccione Crear página.
  6. En la Franja principal, seleccione los puntos suspensivos (...) y después seleccione Agregar módulo.
  7. En el cuadro de diálogo Seleccionar módulos, seleccione el módulo Contenedor y, a continuación, Aceptar.
  8. En el espacio Contenedor, seleccione los puntos suspensivos (...) y después seleccione Agregar módulo.
  9. En el cuadro de diálogo Seleccionar módulos, seleccione el módulo Comparación de productos y, a continuación, Aceptar.
  10. En la ranura Botón Vista rápida, seleccione el botón de puntos suspensivos (...) y después seleccione Agregar módulo.
  11. En el cuadro de diálogo Seleccionar módulos, seleccione el módulo Vista rápida de los productos y, a continuación, seleccione Aceptar.
  12. En el panel de propiedades de la derecha, configure las propiedades del módulo Vista rápida de los productos.
  13. En el espacio Comparación vacía, seleccione los puntos suspensivos (...) y después seleccione Agregar módulo.
  14. En el cuadro de diálogo Seleccionar módulos, seleccione el módulo Bloque de contenido y, a continuación, Aceptar.
  15. En el panel de propiedades de la derecha, configure las propiedades del módulo Bloque de contenido.
  16. Seleccione Guardar y luego seleccione Vista previa para previsualizar la página.
  17. Seleccione Finalizar edición para proteger la página y luego seleccione Publicar para publicarla.

La siguiente ilustración muestra un ejemplo de una página de comparación vacía en el generador de sitios.

Captura de pantalla del módulo de comparación de productos en el generador de sitios.

Agregue un botón de comparación de productos a los mosaicos de productos en las páginas de resultados de búsqueda y categoría

El botón de comparación de productos permite a los usuarios agregar rápidamente un producto a la bandeja de comparación cuando buscan productos en una página de lista. Pueden agregar uno o más productos a la bandeja de comparación desde una página de lista sin tener que ir a un PDP.

El botón de comparación de productos es compatible con los módulos de colección de productos, resultados de búsqueda y caja de compra de PDP.

Para agregar un botón de comparación de productos a iconos de productos en páginas de resultados de búsqueda y categoría, siga estos pasos:

  1. En el creador de sitios, vaya a Páginas y abra la página de categoría a la que desea agregar un botón de comparación de productos.
  2. En la Franja principal, seleccione los puntos suspensivos (...) y después seleccione Agregar módulo.
  3. En el cuadro de diálogo Seleccionar módulos, seleccione el módulo Resultados de la búsqueda y, a continuación, seleccione Aceptar.
  4. En el espacio Botón de comparación de productos del módulo Resultados de búsqueda, seleccione los puntos suspensivos (...) y, a continuación, Agregar módulo.
  5. En el cuadro de diálogo Seleccionar módulos, seleccione el módulo Botón de comparación de productos y, a continuación, Aceptar.
  6. En el panel de propiedades de la derecha, configure las propiedades del módulo Botón de comparación de productos.
  7. Seleccione Guardar y luego seleccione Vista previa para previsualizar la página.
  8. Seleccione Finalizar edición para proteger la página y luego seleccione Publicar para publicarla.

Agregar un módulo de panel de vista previa de comparación de productos a las páginas de su sitio web

Un módulo de panel de vista previa de comparación de productos proporciona a sus clientes la opción de revisar los productos que agregan o eliminan de la comparación. El panel de vista previa también ofrece las opciones de navegar directamente a la página de comparación o borrar toda la lista de productos.

Habilite el panel de vista previa en todas las páginas que tengan habilitado el botón Comparación de productos. Agregue el módulo al botón Comparación de productos como ranura o úselo como módulo independiente que puede configurar en cualquier página, incluso cuando no haya ninguna funcionalidad para agregar o quitar productos que se van a comparar.

Debe agregar manualmente el módulo de panel de vista previa de comparación de productos a la página. Agregue solo un módulo de panel de vista previa en una página. Si agrega varias instancias del módulo a una página, se representa el primer módulo y el resto se omite.

Captura de pantalla del panel de vista previa de comparación de productos.

Si especifica un límite de comparación de productos, puede habilitar marcadores de posición grises en el panel de vista previa que indiquen cuántos productos más se pueden agregar a la comparación. Los marcadores de posición grises se reemplazan con productos a medida que se agregan a la comparación. Para configurar un límite de comparación de productos y habilitar los marcadores de posición grises, en el generador de sitios, vaya a Extensiones de configuración > del sitio y realice los cambios en la sección Comparaciones de productos. La configuración se aplica a todos los paneles de vista previa de todas las páginas.

Establezca el número máximo de productos que se mostrarán en la bandeja de comparación.

Puede establecer el número máximo de productos que se mostrarán en la bandeja de comparación; para ello, vaya a Extensiones de configuración > del sitio en el generador de sitios. Puede establecer diferentes límites máximos para las vistas de escritorio y móvil o tableta. De forma predeterminada, no se aplica ningún límite si no establece un límite máximo.

Nota

Para obtener la mejor experiencia de navegación, establezca el número máximo de productos en la bandeja de comparación en 2 para la ventanilla móvil y 4 para la ventanilla de escritorio. Esta configuración reduce la cantidad de desplazamiento horizontal.

Para establecer el número máximo de productos en la bandeja de comparación, siga estos pasos:

  1. En el generador de sitios, vaya a Configuración del sitio > Extensiones.
  2. Para la propiedad Productos en el límite de comparación: dispositivos de escritorio, introduzca el número máximo de productos que aparecen en la bandeja de comparación para las ventanas gráficas de escritorio.
  3. Para la propiedad Productos en el límite de comparación: dispositivos móviles y tabletas, introduzca el número máximo de productos que aparecen en la bandeja de comparación para las ventanas gráficas de móviles y tabletas.
  4. En la barra de comandos, seleccione Guardar y publicar.

Captura de pantalla de la configuración del sitio para limitar los productos en la bandeja de comparación.